:root {
  --ink: #101113;
  --paper: #f4f1eb;
  --muted: #9f9f9c;
  --line: rgba(244, 241, 235, .18);
  --neon: #d7ff3f;
  --card: #17181a;
  --placeholder-line: rgba(244, 241, 235, .24);
  --placeholder-soft: rgba(244, 241, 235, .56);
  --display: 'Oswald', Impact, sans-serif;
  --body: 'Manrope', Arial, sans-serif;
  --mono: 'DM Mono', monospace;
  color-scheme: dark;
}

:root[data-theme='light'] {
  --ink: #eeece7;
  --paper: #121315;
  --muted: #666864;
  --line: rgba(18, 19, 21, .16);
  --card: #e5e2db;
  --placeholder-line: rgba(18, 19, 21, .22);
  --placeholder-soft: rgba(18, 19, 21, .58);
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html.immersive-scroll-active {
  scroll-behavior: auto !important;
  scroll-snap-type: none !important;
}

.sr-only { clip: rect(0 0 0 0); clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; }
body {
  margin: 0;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--body);
  overflow-x: hidden;
}
button, input, textarea { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }

.site-header {
  align-items: center;
  border-bottom: 1px solid var(--line);
  display: flex;
  height: 76px;
  justify-content: space-between;
  left: 0;
  padding: 0 3.6vw;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 20;
  mix-blend-mode: difference;
}
.wordmark { font-size: 27px; font-weight: 800; letter-spacing: .05em; line-height: 1; }
.site-nav { display: flex; gap: 28px; font: 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.site-nav a { transition: color .2s ease; }
.site-nav a:hover { color: var(--neon); }
.round-button {
  align-items: center;
  background: transparent;
  border: 1px solid currentColor;
  border-radius: 50%;
  color: inherit;
  display: inline-flex;
  height: 38px;
  justify-content: center;
  width: 38px;
}
.round-button svg { height: 17px; width: 17px; }
.site-actions { align-items: center; display: flex; gap: 14px; }
.mobile-more { display: none; }

.hero {
  align-items: flex-end;
  display: grid;
  height: min(900px, 100svh);
  min-height: 650px;
  overflow: hidden;
  padding: 76px 3.6vw 50px;
  position: relative;
}
.hero-image-wrap { inset: 0; overflow: hidden; position: absolute; }
.hero-image {
  filter: grayscale(1) contrast(1.16) brightness(.7);
  height: 112%;
  left: -3%;
  object-fit: cover;
  position: absolute;
  top: -6%;
  transform: scale(1.05);
  transition: transform .16s linear;
  width: 106%;
}
.hero-image-wrap { background: var(--card); }
.placeholder-visual {
  align-items: center;
  background: var(--card);
  border: 1px solid var(--placeholder-line);
  color: var(--placeholder-soft);
  display: flex;
  flex-direction: column;
  inset: 0;
  justify-content: center;
  overflow: hidden;
  position: relative;
}
.placeholder-visual::before, .placeholder-visual::after {
  border: 1px solid var(--placeholder-line);
  content: '';
  height: 42%;
  position: absolute;
  width: 42%;
}
.placeholder-visual::before { border-bottom: 0; border-right: 0; left: 9%; top: 9%; }
.placeholder-visual::after { border-left: 0; border-top: 0; bottom: 9%; right: 9%; }
.placeholder-index, .placeholder-label, .placeholder-category {
  font: 10px var(--mono);
  letter-spacing: .08em;
  position: relative;
  text-transform: uppercase;
  z-index: 1;
}
.placeholder-index { color: var(--paper); font-size: 13px; margin-bottom: 18px; }
.placeholder-mark { border: 1px solid var(--placeholder-line); border-radius: 50%; font: 22px/31px var(--body); height: 32px; margin-bottom: 15px; position: relative; text-align: center; width: 32px; z-index: 1; }
.placeholder-label { color: var(--paper); }
.placeholder-category { margin-top: 8px; opacity: .66; }
.hero-placeholder { height: 100%; width: 100%; }
.placeholder-hero { border: 0; }
.placeholder-hero .placeholder-mark { height: 46px; font-size: 30px; line-height: 44px; width: 46px; }
.placeholder-lightbox { min-height: min(60vh, 620px); width: min(70vw, 760px); }
.hero-upload-note { color: var(--muted); display: inline-block; margin-top: 10px; }
.hero:after { background: linear-gradient(180deg, rgba(16,17,19,.02) 26%, var(--ink) 99%); content: ''; inset: 0; position: absolute; }
.hero-topline, .hero-content { position: relative; z-index: 1; }
.hero-topline { align-self: start; display: flex; justify-content: space-between; margin-top: 34px; }
.eyebrow { font: 11px var(--mono); letter-spacing: .08em; margin: 0; text-transform: uppercase; }
.hero-content { align-items: end; display: flex; justify-content: space-between; }
.hero h1 { font: 700 clamp(88px, 18vw, 272px)/.77 var(--display); letter-spacing: .01em; margin: 0; text-transform: uppercase; }
.hero h1 span { color: var(--neon); }
.hero-side-note { font: 11px/1.7 var(--mono); max-width: 220px; padding-bottom: 12px; text-transform: uppercase; }
.scroll-cue { bottom: 50px; font: 10px var(--mono); letter-spacing: .12em; position: absolute; right: 3.6vw; transform: rotate(90deg); transform-origin: right; z-index: 2; }

.intro { display: grid; gap: 36px; grid-template-columns: 1fr 1.7fr; padding: 140px 10vw 160px 30vw; }
.section-kicker, .project-index { color: var(--muted); font: 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.intro-copy { font-size: clamp(27px, 3.3vw, 55px); font-weight: 500; letter-spacing: -.035em; line-height: 1.16; margin: 0; }
.accent { color: var(--neon); }

.works { padding: 0 3.6vw 150px; }
.works-heading { align-items: baseline; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; margin-bottom: 26px; padding-bottom: 18px; }
.works-heading h2 { font: 600 clamp(52px, 8vw, 110px)/.86 var(--display); letter-spacing: .01em; margin: 0; text-transform: uppercase; }
.works-heading p { font: 11px var(--mono); margin: 0; text-transform: uppercase; }
.work-filters { align-items: center; display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 0 0 32px; }
.work-filter { background: transparent; border: 0; border-bottom: 1px solid transparent; color: var(--muted); font: 10px var(--mono); letter-spacing: .08em; min-height: 30px; padding: 0 0 4px; text-transform: uppercase; transition: border-color .2s ease, color .2s ease; }
.work-filter:hover, .work-filter.active { border-bottom-color: var(--paper); color: var(--paper); }
.work-grid { align-items: start; display: grid; gap: 82px clamp(30px, 7vw, 132px); grid-template-columns: minmax(0, 1.14fr) minmax(0, .86fr); perspective: 1600px; }
.work-card { cursor: zoom-in; outline-offset: 8px; position: relative; transform-style: preserve-3d; }
.work-card[hidden] { display: none; }
.work-card.is-placeholder { cursor: default; }
.work-card.is-placeholder .work-visual { cursor: default; }
.work-card.is-placeholder .work-meta { color: var(--muted); }
.work-card:focus-visible { outline: 1px solid var(--neon); }
.work-card:nth-child(even) { margin-top: clamp(60px, 12vw, 180px); }
.work-card:nth-child(3n) { margin-left: 10%; }
.work-card:nth-child(4n) { margin-left: 0; margin-top: clamp(18px, 4vw, 70px); }
.work-visual { aspect-ratio: 4 / 5; background: var(--card); overflow: hidden; }
.work-card:nth-child(3n + 2) .work-visual { aspect-ratio: 3 / 4; }
.work-card:nth-child(3n) .work-visual { aspect-ratio: 16 / 10; }
.work-card img { height: 100%; object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1), filter .7s ease; width: 100%; }
.work-card:hover img { filter: saturate(1.15); transform: scale(1.06); }
.work-meta { align-items: baseline; display: flex; font-size: 12px; justify-content: space-between; padding-top: 11px; }
.work-meta span:last-child { color: var(--muted); font: 10px var(--mono); letter-spacing: .05em; }
.empty-works { border: 1px dashed var(--line); color: var(--muted); grid-column: 1 / -1; padding: 50px; }

.lightbox { align-items: center; background: var(--paper); color: var(--ink); display: grid; inset: 0; justify-items: center; padding: 88px 9vw 70px; position: fixed; z-index: 100; }
.lightbox-header { align-items: center; display: flex; justify-content: space-between; left: 3.6vw; position: absolute; right: 3.6vw; top: 27px; }
.lightbox-brand, .lightbox-close, .lightbox-hint { font: 10px var(--mono); letter-spacing: .09em; text-transform: uppercase; }
.lightbox-brand span { color: var(--muted); }
.lightbox-close { background: transparent; border: 0; color: inherit; padding: 10px 0; }
.lightbox-close:hover { color: var(--muted); }
.lightbox-figure { display: grid; margin: 0; max-height: 100%; max-width: min(1060px, 78vw); position: relative; width: 100%; }
.lightbox-frame { align-items: center; display: flex; justify-content: center; max-height: calc(100svh - 190px); overflow: hidden; }
.lightbox-frame img { display: block; max-height: calc(100svh - 190px); max-width: 100%; object-fit: contain; }
.lightbox-frame .placeholder-visual { min-height: min(60vh, 620px); width: min(70vw, 760px); }
.lightbox-frame.is-entering img { animation: lightbox-image-in .48s cubic-bezier(.2,.72,.2,1) both; }
.lightbox-frame.from-previous.is-entering img { animation-name: lightbox-image-in-reverse; }
.lightbox-meta { align-items: baseline; display: flex; font-size: 13px; justify-content: space-between; padding-top: 14px; }
.lightbox-meta span:last-child { color: var(--muted); font: 10px var(--mono); letter-spacing: .05em; text-align: right; text-transform: uppercase; }
.lightbox-step { background: transparent; border: 0; color: var(--ink); font-size: 30px; height: 68px; position: absolute; top: calc(50% - 34px); transition: color .2s ease, transform .2s ease; width: 68px; }
.lightbox-step:hover { color: var(--muted); transform: scale(1.14); }
.lightbox-prev { left: 2vw; }
.lightbox-next { right: 2vw; }
.lightbox-hint { bottom: 25px; color: var(--muted); margin: 0; position: absolute; }
.mobile-hint { display: none; }
@keyframes lightbox-image-in { from { opacity: 0; transform: translate3d(18px, 0, 0) scale(.96); } to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); } }
@keyframes lightbox-image-in-reverse { from { opacity: 0; transform: translate3d(-18px, 0, 0) scale(.96); } to { opacity: 1; transform: translate3d(0, 0, 0) scale(1); } }

.manifesto { align-items: end; background: var(--neon); color: #111; display: grid; grid-template-columns: 1fr 2.5fr; min-height: 72vh; padding: 70px 10vw; }
.manifesto h2 { font: 600 clamp(60px, 10.8vw, 160px)/.8 var(--display); letter-spacing: .01em; margin: 0; text-transform: uppercase; }
.manifesto-copy { font-size: clamp(18px, 2vw, 29px); font-weight: 600; letter-spacing: -.025em; line-height: 1.32; max-width: 580px; }

.site-footer { align-items: end; display: grid; grid-template-columns: 1fr auto; min-height: 360px; padding: 50px 3.6vw 36px; }
.contact-label { color: var(--muted); font: 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.contact-link { border-bottom: 1px solid var(--paper); display: inline-block; font-size: clamp(23px, 4vw, 58px); font-weight: 500; letter-spacing: -.045em; margin-top: 16px; }
.footer-note { color: var(--muted); font: 10px var(--mono); letter-spacing: .07em; text-align: right; text-transform: uppercase; }

.admin-shell { background: var(--paper); color: #111; min-height: 100vh; padding: 34px clamp(20px, 6vw, 96px) 70px; }
.admin-top { align-items: center; border-bottom: 1px solid #bbb9b1; display: flex; justify-content: space-between; padding-bottom: 22px; }
.admin-brand { color: #111; font-size: 25px; font-weight: 800; letter-spacing: .05em; }
.admin-back { font: 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.admin-heading { margin: 90px 0 48px; max-width: 760px; }
.admin-heading p { color: #6b6a66; font: 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.admin-heading h1 { font: 600 clamp(52px, 8vw, 112px)/.88 var(--display); letter-spacing: .01em; margin: 12px 0; text-transform: uppercase; }
.admin-panel { background: #fff; border: 1px solid #d7d3cb; max-width: 1120px; padding: clamp(24px, 4vw, 46px); }
.admin-panel h2 { font-size: 25px; letter-spacing: -.04em; margin: 0 0 9px; }
.admin-panel > p { color: #66645e; font-size: 14px; line-height: 1.65; margin: 0 0 30px; }
.field { display: grid; gap: 8px; margin: 18px 0; }
.field label { color: #5f5d57; font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.field input, .field textarea, .field select { background: #f6f4ef; border: 1px solid #d6d1c8; border-radius: 0; color: #111; min-height: 46px; padding: 12px; width: 100%; }
.field textarea { min-height: 80px; resize: vertical; }
.admin-action { background: #111; border: 0; border-radius: 0; color: #fff; font: 11px var(--mono); letter-spacing: .08em; margin-top: 10px; min-height: 48px; padding: 0 20px; text-transform: uppercase; }
.admin-action:disabled { cursor: wait; opacity: .55; }
.admin-message { background: #eff8ca; border-left: 3px solid #a5cc12; font-size: 13px; line-height: 1.5; margin: 20px 0 0; padding: 12px 14px; }
.admin-message.error { background: #fae8e4; border-color: #e35f49; }
.admin-session { align-items: center; background: #ebf3c7; display: flex; font: 12px var(--mono); justify-content: space-between; margin: 0 0 22px; padding: 13px; }
.admin-session button { background: none; border: 0; font: inherit; text-decoration: underline; }
.admin-tabs { border-bottom: 1px solid #d7d3cb; display: flex; gap: 24px; margin: 0 0 32px; }
.admin-tabs button { background: transparent; border: 0; border-bottom: 2px solid transparent; color: #78756d; font: 11px var(--mono); letter-spacing: .07em; min-height: 43px; padding: 0; text-transform: uppercase; }
.admin-tabs button.active { border-bottom-color: #111; color: #111; }
.admin-text-button { background: transparent; border: 0; color: #5b5953; font: 12px var(--mono); margin-top: 18px; padding: 0; text-decoration: underline; }
.reset-panel { border-top: 1px solid #dedad1; margin-top: 24px; padding-top: 4px; }
.security-grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.security-block { background: #f5f3ee; border: 1px solid #dedad1; padding: clamp(18px, 2.4vw, 30px); }
.security-block h3 { font-size: 17px; letter-spacing: -.03em; margin: 0 0 8px; }
.security-email { color: #6b6962; font-size: 13px; line-height: 1.6; margin: 0 0 22px; }
.security-block #recovery-confirm-form { border-top: 1px solid #dedad1; margin-top: 22px; padding-top: 4px; }
.upload-preview { background: #efede8; display: none; margin: 16px 0; max-height: 260px; object-fit: cover; width: 100%; }
.upload-preview.show { display: block; }
.position-grid { display: grid; gap: 18px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.position-card { background: #f5f3ee; border: 1px solid #dedad1; display: flex; flex-direction: column; min-width: 0; padding: 10px; }
.position-card[draggable='true'] { cursor: grab; position: relative; }
.position-card[draggable='true']:active { cursor: grabbing; }
.position-drag-handle { align-items: center; background: #111; color: #fff; display: flex; font: 700 14px/1 var(--mono); height: 26px; justify-content: center; letter-spacing: .08em; position: absolute; right: 16px; top: 16px; width: 26px; z-index: 1; }
.position-card.is-dragging { opacity: .38; }
.position-card.is-drag-over { border-color: #111; box-shadow: 0 0 0 2px #111; }
.position-grid.is-sorting { opacity: .62; pointer-events: none; }
.position-card > img { aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }
.position-card > .position-placeholder { align-items: center; aspect-ratio: 4 / 3; background: #efede8; border: 1px dashed #b9b4aa; color: #77746d; display: flex; flex-direction: column; font: 10px var(--mono); justify-content: center; letter-spacing: .08em; text-align: center; text-transform: uppercase; }
.position-placeholder strong { border: 1px solid #aaa59a; border-radius: 50%; font: 24px/32px var(--body); height: 34px; margin-bottom: 10px; width: 34px; }
.position-card-copy { display: grid; gap: 4px; padding: 13px 2px 8px; }
.position-card-copy span { font-size: 14px; font-weight: 700; letter-spacing: -.02em; }
.position-card-copy small { color: #77746d; font: 10px var(--mono); letter-spacing: .04em; text-transform: uppercase; }
.position-caption { margin: 5px 0 10px; }
.position-caption input { min-height: 38px; padding: 8px 10px; }
.position-collection { margin: 5px 0 12px; }
.position-collection select { min-height: 38px; padding: 8px 10px; }
.position-actions { display: grid; gap: 8px; grid-template-columns: 1fr auto; margin-top: auto; }
.position-action, .position-delete { align-items: center; border: 0; cursor: pointer; display: flex; font: 10px var(--mono); justify-content: center; letter-spacing: .08em; min-height: 40px; padding: 0 12px; text-transform: uppercase; }
.position-action { background: #111; color: #fff; }
.position-delete { background: transparent; border: 1px solid #bbb6ac; color: #69675f; }
.position-action:disabled, .position-delete:disabled { cursor: wait; opacity: .55; }
.position-file-input { height: 0; opacity: 0; position: absolute; width: 0; }
.position-card-add { align-items: center; border-style: dashed; justify-content: center; min-height: 330px; text-align: center; }
.position-card-add .position-card-copy { padding-bottom: 22px; }
.position-add-mark { align-items: center; border: 1px solid #a6a29a; border-radius: 50%; display: flex; font-size: 26px; height: 54px; justify-content: center; margin-bottom: 8px; width: 54px; }
.collection-create-form { border-bottom: 1px solid #dedad1; margin-bottom: 26px; padding-bottom: 28px; }
.collection-list { display: grid; gap: 12px; }
.collection-item { align-items: start; background: #f5f3ee; border: 1px solid #dedad1; display: grid; gap: 20px; grid-template-columns: 42px minmax(0, 1fr); padding: 16px; }
.collection-index { color: #77746d; font: 10px var(--mono); letter-spacing: .08em; padding-top: 13px; }
.collection-item .field { margin: 0 0 10px; }
.collection-actions { display: grid; gap: 8px; grid-template-columns: auto auto; justify-content: start; }
.empty-collections { border: 1px dashed #d7d3cb; color: #77746d; font-size: 13px; margin: 0; padding: 24px; }

@media (max-width: 700px) {
  html { scroll-snap-type: y mandatory; }
  .site-header { height: 62px; padding: 0 20px; }
  .wordmark { font-size: 23px; }
  .site-nav { display: none; }
  .hero { height: 92svh; min-height: 590px; padding: 62px 20px 32px; }
  .hero-topline { margin-top: 24px; }
  .hero-content { display: block; }
  .hero h1 { font-size: clamp(83px, 26vw, 140px); }
  .hero-side-note { margin: 28px 0 0; max-width: 180px; }
  .scroll-cue { display: none; }
  .intro { display: block; padding: 90px 24px 110px; }
  .intro-copy { margin-top: 35px; }
  .works { padding: 0 20px 92px; }
  .works-heading { align-items: end; }
  .works-heading h2 { font-size: 58px; }
  .works-heading p { max-width: 90px; text-align: right; }
  .work-filters { gap: 6px 15px; margin-bottom: 24px; overflow-x: auto; padding-bottom: 3px; scrollbar-width: none; }
  .work-filters::-webkit-scrollbar { display: none; }
  .work-grid { display: grid; gap: 36px 12px; grid-template-columns: repeat(2, 1fr); }
  .work-card, .work-card:nth-child(even), .work-card:nth-child(3n), .work-card:nth-child(4n) { margin-left: 0; margin-top: 0; }
  .work-card:nth-child(even) { margin-top: 64px; }
  .work-card:nth-child(3n + 2) .work-visual, .work-card:nth-child(3n) .work-visual { aspect-ratio: 3 / 4; }
  .work-meta { display: block; line-height: 1.5; }
  .work-meta span:last-child { display: block; }
  .lightbox { padding: 68px 20px 62px; }
  .lightbox-header { left: 20px; right: 20px; top: 16px; }
  .lightbox-figure { max-width: 100%; }
  .lightbox-frame, .lightbox-frame img { max-height: calc(100svh - 160px); }
  .lightbox-frame .placeholder-visual { min-height: 56svh; width: 100%; }
  .lightbox-meta { font-size: 12px; gap: 16px; }
  .lightbox-meta span:last-child { max-width: 48%; }
  .lightbox-step { display: none; }
  .desktop-hint { display: none; }
  .mobile-hint { display: inline; }
  .lightbox-hint { bottom: 20px; }
  .manifesto { display: block; min-height: 0; padding: 70px 24px; }
  .manifesto-copy { margin: 42px 0 0; }
  .site-footer { display: block; min-height: 300px; padding: 50px 20px 30px; }
  .footer-note { margin-top: 100px; text-align: left; }
  .admin-shell { padding: 24px 20px 56px; }
  .admin-heading { margin: 65px 0 34px; }
  .position-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .security-grid { grid-template-columns: 1fr; }
}

/* Public portfolio redesign */
.site-header {
  background: var(--ink);
  border-bottom-color: var(--line);
  mix-blend-mode: normal;
  padding: 0 4vw;
}
.wordmark { align-items: baseline; display: flex; font-size: 20px; gap: 7px; letter-spacing: .08em; }
.wordmark span { color: var(--muted); font-weight: 400; }
.wordmark small { color: var(--paper); font: 11px var(--body); letter-spacing: .08em; }
.site-nav { gap: 22px; letter-spacing: .04em; }
.site-nav a { color: var(--muted); }
.site-nav a:last-child { color: var(--paper); }
.site-nav a:hover { color: var(--paper); }
.round-button { border-color: var(--line); height: 36px; width: 36px; }

.portfolio-main { overflow: clip; }
.hero {
  align-items: flex-end;
  display: grid;
  height: min(900px, 100svh);
  min-height: 650px;
  overflow: hidden;
  padding: 76px 3.6vw 50px;
  position: relative;
}
.hero::after { background: linear-gradient(180deg, rgba(16,17,19,.02) 26%, var(--ink) 99%); content: ''; inset: 0; pointer-events: none; position: absolute; }
.hero-image-wrap .hero-image { filter: contrast(1.08) brightness(.76); height: 112%; left: -3%; top: -6%; width: 106%; }
.hero-image-wrap .placeholder-visual { height: 100%; width: 100%; }
.hero-topline, .hero-content { position: relative; z-index: 1; }
.hero-topline { align-self: start; display: flex; justify-content: space-between; margin-top: 34px; }
.hero .eyebrow { color: var(--paper); letter-spacing: .08em; }
.hero-content { align-items: end; display: flex; justify-content: space-between; }
.hero h1 { color: var(--paper); font: 700 clamp(88px, 18vw, 272px)/.77 var(--display); letter-spacing: .01em; margin: 0; text-transform: uppercase; }
.hero h1 span { color: var(--neon); opacity: 1; }
.hero-side-note { color: var(--paper); font: 11px/1.7 var(--mono); max-width: 220px; padding-bottom: 12px; text-transform: uppercase; }
.scroll-cue { bottom: 50px; color: var(--paper); display: block; font: 10px var(--mono); letter-spacing: .12em; position: absolute; right: 3.6vw; transform: rotate(90deg); transform-origin: right; z-index: 2; }

.intro { border-top: 1px solid var(--line); display: grid; gap: 28px; grid-template-columns: minmax(120px, .45fr) minmax(0, 1.55fr); margin: 100px 4vw 0; padding: 28px 0 138px; }
.section-kicker { color: var(--muted); letter-spacing: .09em; }
.intro-copy { color: var(--paper); font-size: clamp(29px, 4vw, 65px); font-weight: 400; letter-spacing: 0; line-height: 1.18; }
.intro-copy span { color: var(--muted); }

.works { padding: 0 4vw 160px; }
.works-heading { align-items: end; border-bottom: 0; display: grid; gap: 28px; grid-template-columns: 1fr auto; margin-bottom: 36px; padding: 0; }
.works-heading h2 { color: var(--paper); font: 600 clamp(64px, 9vw, 140px)/.78 var(--display); letter-spacing: 0; margin: 18px 0 0; }
.works-heading p { color: var(--muted); font: 10px/1.6 var(--mono); letter-spacing: .07em; text-align: right; text-transform: uppercase; }
.works-heading p span { color: var(--paper); font-size: 16px; }
.work-filters { border-bottom: 1px solid var(--line); gap: 0; margin-bottom: 56px; padding-bottom: 13px; }
.work-filter { color: var(--muted); margin-right: 23px; min-height: 24px; padding: 0; }
.work-filter:hover, .work-filter.active { border-bottom-color: var(--paper); color: var(--paper); }
.work-grid { gap: clamp(72px, 9vw, 138px) clamp(34px, 7vw, 132px); grid-template-columns: minmax(0, 1.16fr) minmax(0, .84fr); perspective: none; }
.work-card, .work-card:nth-child(even), .work-card:nth-child(3n), .work-card:nth-child(4n) { margin: 0; }
.work-card { grid-column: auto; transform: none !important; }
.work-card:nth-child(even) { margin-top: clamp(84px, 11vw, 154px); }
.work-card:nth-child(3n) { margin-left: 9%; }
.work-card:nth-child(4n) { margin-left: 0; margin-top: clamp(24px, 4vw, 58px); }
.work-visual { background: var(--card); border: 1px solid var(--line); }
.work-card:nth-child(3n + 2) .work-visual { aspect-ratio: 3 / 4; }
.work-card:nth-child(3n) .work-visual { aspect-ratio: 4 / 3; }
.work-card img { filter: none; }
.work-card:hover img { filter: saturate(1.08); }
.work-meta { border-top: 1px solid var(--line); color: var(--paper); font-size: 13px; gap: 14px; margin-top: 12px; padding-top: 10px; }
.work-meta span:last-child { color: var(--muted); font-size: 9px; text-align: right; }
.work-card.is-placeholder .work-meta { color: var(--paper); }
.mobile-stories { display: none; }
.placeholder-visual { background: var(--card); border-color: var(--line); color: var(--muted); }
.placeholder-visual::before, .placeholder-visual::after { border-color: var(--line); }
.placeholder-index, .placeholder-label { color: var(--paper); }
.placeholder-category { color: var(--muted); }
.placeholder-mark { border-color: var(--line); }

.capabilities { border-top: 1px solid var(--line); margin: 0 4vw; padding: 30px 0 0; }
.capabilities-heading { display: grid; gap: 32px; grid-template-columns: minmax(120px, .45fr) minmax(0, 1.55fr); padding-bottom: 76px; }
.capabilities h2 { color: var(--paper); font-size: clamp(29px, 4vw, 65px); font-weight: 400; letter-spacing: 0; line-height: 1.18; margin: 0; }
.capability-list { border-top: 1px solid var(--line); }
.capability-list article { align-items: baseline; border-bottom: 1px solid var(--line); display: grid; gap: 20px; grid-template-columns: 110px 1fr auto; padding: 25px 0 23px; }
.capability-list span, .capability-list p { color: var(--muted); font: 10px var(--mono); letter-spacing: .07em; margin: 0; text-transform: uppercase; }
.capability-list h3 { color: var(--paper); font-size: clamp(19px, 2vw, 31px); font-weight: 500; letter-spacing: 0; margin: 0; }
.availability { align-items: baseline; background: var(--paper); color: var(--ink); display: grid; gap: 24px; grid-template-columns: 1fr minmax(0, 2fr) 1fr; margin-top: 148px; padding: 34px 4vw; }
.availability span { font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.availability span:last-child { text-align: right; }
.availability p { font-size: clamp(18px, 2vw, 29px); font-weight: 500; letter-spacing: 0; line-height: 1.35; margin: 0; }

.site-footer { align-items: start; border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto; margin: 0 4vw; min-height: 370px; padding: 72px 0 34px; }
.contact-label { color: var(--muted); display: block; letter-spacing: .08em; }
.contact-link { border-bottom-color: var(--paper); color: var(--paper); font-size: clamp(28px, 5vw, 70px); font-weight: 400; letter-spacing: 0; margin-top: 18px; }
.contact-note { color: var(--muted); font-size: 12px; margin: 18px 0 0; }
.footer-note { color: var(--muted); line-height: 1.6; margin: 3px 0 0; }

@media (max-width: 700px) {
  .site-header { padding: 0 20px; transition: background-color .28s ease, border-color .28s ease; }
  .site-header.is-gallery-header { background: transparent; border-bottom-color: transparent; }
  .site-header.is-gallery-header .site-nav, .site-header.is-gallery-header .round-button { opacity: var(--gallery-chrome-opacity, 1); pointer-events: var(--gallery-chrome-events, auto); transition: opacity .16s linear; }
  .site-header.is-gallery-header .site-nav, .site-header.is-gallery-header .round-button { pointer-events: none; }
  .site-header.is-gallery-header .wordmark, .site-header.is-gallery-header .wordmark span, .site-header.is-gallery-header .wordmark small { color: #fff; text-shadow: 0 1px 8px rgba(0, 0, 0, .62); }
  .mobile-more { background: transparent; border: 0; color: var(--paper); display: block; font: 10px var(--mono); letter-spacing: .09em; min-height: 36px; padding: 0; text-transform: uppercase; }
  .site-header.is-gallery-header .mobile-more { color: #fff; text-shadow: 0 1px 8px rgba(0, 0, 0, .62); }
  .wordmark { font-size: 18px; }
  .site-nav { display: flex; gap: 15px; }
  .site-nav a:nth-child(2), .site-nav a:nth-child(3), .site-nav a:last-child { display: none; }
  .hero { display: grid; height: 100svh; min-height: 590px; padding: 62px 20px 32px; scroll-snap-align: start; }
  .hero-topline { margin-top: 24px; }
  .hero-content { display: block; }
  .hero h1 { font-size: clamp(83px, 26vw, 140px); }
  .hero-side-note { margin: 28px 0 0; max-width: 180px; }
  .scroll-cue { display: none; }
  .intro { display: none; }
  .intro-copy { font-size: 31px; margin-top: 30px; }
  .works { display: none; }
  .mobile-stories { display: block; }
  .mobile-story-chapter { height: 100svh; min-height: 560px; overflow: hidden; position: relative; scroll-snap-align: start; scroll-snap-stop: always; }
  .mobile-story-slide-media { background: #171817; height: 100%; inset: 0; position: absolute; width: 100%; }
  .mobile-story-slide-media img { display: block; height: 100%; object-fit: cover; width: 100%; }
  .mobile-story-shade { background: linear-gradient(180deg, rgba(8, 9, 10, .18), rgba(8, 9, 10, 0) 35%, rgba(8, 9, 10, .78)); inset: 0; pointer-events: none; position: absolute; }
  .mobile-story-track { display: flex; height: 100%; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .mobile-story-track::-webkit-scrollbar { display: none; }
  .mobile-story-slide { flex: 0 0 100%; height: 100%; overflow: hidden; position: relative; scroll-snap-align: start; width: 100%; }
  .mobile-story-slide.is-panorama .mobile-story-slide-media { overflow: hidden; }
  .mobile-story-slide.is-panorama .mobile-story-slide-media img { max-width: none; object-fit: cover; object-position: center; transform: translateX(var(--panorama-offset)); width: var(--panorama-width); }
  .mobile-story-slide-meta { bottom: max(28px, env(safe-area-inset-bottom)); left: 20px; position: absolute; right: 20px; z-index: 1; }
  .mobile-story-slide-meta p { display: none; }
  .mobile-story-slide-meta span, .mobile-story-chapter-heading span, .mobile-story-chapter-heading small { color: rgba(244, 241, 235, .72); font: 10px var(--mono); letter-spacing: .09em; text-transform: uppercase; }
  .mobile-story-chapter-heading { display: grid; gap: 7px; left: 20px; pointer-events: none; position: absolute; right: 20px; top: max(84px, calc(env(safe-area-inset-top) + 60px)); z-index: 2; }
  .mobile-story-chapter-heading strong { color: #fff; font: 600 34px/.92 var(--display); letter-spacing: 0; text-shadow: 0 1px 10px rgba(0, 0, 0, .72); text-transform: uppercase; }
  .mobile-story-chapter.is-untitled .mobile-story-chapter-heading { align-content: start; }
  .mobile-work-index { background: #101113; color: #f4f1eb; inset: 0; overflow-y: auto; position: fixed; z-index: 300; }
  .mobile-work-index-head { align-items: center; border-bottom: 1px solid rgba(244, 241, 235, .2); display: flex; height: 62px; justify-content: space-between; padding: 0 20px; position: sticky; top: 0; z-index: 2; background: #101113; }
  .mobile-work-index-head span, .mobile-work-index-head button, .mobile-work-index-kicker { font: 10px var(--mono); letter-spacing: .09em; text-transform: uppercase; }
  .mobile-work-index-head button { background: transparent; border: 0; color: inherit; min-height: 36px; padding: 0; }
  .mobile-work-index-content { padding: 28px 20px 52px; }
  .mobile-work-index-kicker { color: rgba(244, 241, 235, .58); margin: 0 0 32px; }
  .mobile-work-index-group { border-top: 1px solid rgba(244, 241, 235, .2); padding: 18px 0 30px; }
  .mobile-work-index-group h2 { font: 600 31px/.95 var(--display); letter-spacing: 0; margin: 0 0 18px; text-transform: uppercase; }
  .mobile-work-index-group > div { display: grid; gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mobile-work-index-group button { background: transparent; border: 0; color: inherit; min-width: 0; padding: 0; text-align: left; }
  .mobile-work-index-group img { aspect-ratio: 4 / 5; display: block; object-fit: cover; width: 100%; }
  .mobile-work-index-group button span { display: block; font-size: 11px; line-height: 1.35; margin-top: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .works-heading { gap: 18px; margin-bottom: 30px; }
  .works-heading h2 { font-size: 70px; margin-top: 14px; }
  .work-filters { flex-wrap: nowrap; gap: 0; margin-bottom: 38px; overflow-x: auto; padding-bottom: 11px; }
  .work-filter { flex: 0 0 auto; margin-right: 18px; }
  .work-grid { gap: 54px 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .work-card, .work-card:nth-child(1), .work-card:nth-child(2), .work-card:nth-child(3), .work-card:nth-child(4), .work-card:nth-child(5), .work-card:nth-child(6) { align-self: auto; grid-column: span 1; margin: 0; }
  .work-card:nth-child(even) { margin-top: 56px; }
  .work-card:nth-child(3n) .work-visual, .work-card:nth-child(3n + 2) .work-visual { aspect-ratio: 3 / 4; }
  .work-meta { display: block; font-size: 11px; }
  .work-meta span:last-child { display: block; margin-top: 4px; text-align: left; }
  .capabilities { margin: 0 20px; padding-top: 23px; }
  .capabilities-heading { display: block; padding-bottom: 48px; }
  .capabilities h2 { font-size: 31px; margin-top: 30px; }
  .capability-list article { display: grid; gap: 8px; grid-template-columns: 42px 1fr; padding: 20px 0; }
  .capability-list p { grid-column: 2; }
  .availability { display: block; margin-top: 82px; padding: 26px 20px; }
  .availability p { font-size: 21px; margin: 28px 0; }
  .availability span:last-child { display: block; text-align: left; }
  .site-footer { display: block; margin: 0 20px; min-height: 320px; padding-top: 48px; }
  .contact-link { font-size: 31px; max-width: 100%; overflow-wrap: anywhere; }
  .footer-note { margin-top: 86px; text-align: left; }
}

/* Admin workbench */
.admin-shell { background: #efeee9; color: #191917; min-height: 100svh; padding: 22px clamp(18px, 3vw, 54px) 34px; }
.asset-delete-dialog {
  background: #f7f5ef;
  border: 1px solid #bbb7ad;
  border-radius: 4px;
  color: #191917;
  max-width: calc(100vw - 32px);
  padding: 0;
  width: min(520px, calc(100vw - 32px));
}
.asset-delete-dialog::backdrop { backdrop-filter: blur(5px); background: rgba(7, 8, 9, .68); }
.asset-delete-dialog form { display: grid; gap: 16px; margin: 0; padding: 26px; }
.asset-delete-dialog form > span { color: #77736b; font: 10px var(--mono); letter-spacing: .08em; }
.asset-delete-dialog h2 { font-size: clamp(23px, 3vw, 32px); letter-spacing: 0; line-height: 1.15; margin: 0; overflow-wrap: anywhere; }
.asset-delete-dialog p { color: #66625b; font-size: 13px; line-height: 1.7; margin: 0; }
.asset-delete-dialog form > div { border-top: 1px solid #d3cfc6; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding-top: 18px; }
.asset-delete-dialog button { background: transparent; border: 1px solid #aaa69d; color: inherit; min-height: 38px; padding: 0 14px; }
.asset-delete-dialog button:hover { border-color: #191917; }
.asset-delete-dialog button.is-danger { background: #9a3f36; border-color: #9a3f36; color: #fff; }
.admin-top { border-bottom-color: #cbc8bf; min-height: 52px; padding-bottom: 16px; }
.admin-top-actions { align-items: center; display: flex; gap: 18px; }
.admin-theme-toggle { height: 34px; width: 34px; }
.admin-brand { align-items: baseline; display: flex; font-size: 19px; gap: 6px; letter-spacing: .08em; }
.admin-brand span { color: #89867e; font-weight: 400; }
.admin-back { color: #5f5c56; }
.admin-heading { display: none; }
.admin-panel { background: #fbfaf7; border-color: #d6d2c9; box-shadow: none; margin-top: 26px; max-width: 620px; padding: clamp(22px, 3vw, 38px); }
.admin-panel-loading { max-width: 420px; }
.admin-panel h2 { font-size: 24px; letter-spacing: 0; }
.admin-panel > p { color: #6a6760; }
.admin-workbench { background: #fbfaf7; display: grid; grid-template-columns: 220px minmax(0, 1fr) 324px; margin-top: 22px; max-width: none; min-height: calc(100svh - 110px); padding: 0; position: relative; }
.admin-workbench.is-wide-workbench { grid-template-columns: 220px minmax(0, 1fr); }
.workbench-sidebar { background: #f3f1ec; border-right: 1px solid #d6d2c9; display: flex; flex-direction: column; justify-content: space-between; min-height: 100%; padding: 26px 18px 18px; }
.workbench-kicker, .inspector-kicker, .setting-kicker { color: #75716a; font: 10px var(--mono); letter-spacing: .09em; margin: 0; text-transform: uppercase; }
.workbench-sidebar h2 { font-size: 25px; letter-spacing: 0; margin: 8px 0 7px; }
.workbench-site-state { color: #77736b; font-size: 12px; margin: 0; }
.workbench-nav { display: grid; gap: 4px; margin: 54px 0 auto; }
.workbench-nav button { align-items: center; background: transparent; border: 0; color: #66625c; display: flex; font: 12px var(--body); gap: 12px; min-height: 40px; padding: 0 8px; text-align: left; }
.workbench-nav button span { color: #969188; font: 9px var(--mono); letter-spacing: .07em; }
.workbench-nav button.active { background: #1b1b19; color: #fff; }
.workbench-nav button.active span { color: #bbb8b0; }
.workbench-sidebar-footer { border-top: 1px solid #d6d2c9; display: grid; gap: 12px; padding-top: 16px; }
.workbench-sidebar-footer a, .workbench-sidebar-footer button { background: transparent; border: 0; color: #5f5c56; font: 10px var(--mono); letter-spacing: .07em; padding: 0; text-align: left; text-transform: uppercase; }
.workbench-main { min-width: 0; padding: clamp(22px, 3vw, 42px); }
.workbench-view-header { align-items: end; border-bottom: 1px solid #d6d2c9; display: flex; justify-content: space-between; padding-bottom: 20px; }
.workbench-view-header h2 { font-size: clamp(28px, 3vw, 42px); font-weight: 500; line-height: 1; margin: 9px 0 0; }
.workbench-view-header h2 span { color: #969188; font: 12px var(--mono); margin-left: 8px; vertical-align: top; }
.workbench-header-actions button, .category-create-bar button, .batch-toolbar button { background: #1b1b19; border: 0; color: #fff; font: 10px var(--mono); letter-spacing: .07em; min-height: 38px; padding: 0 14px; text-transform: uppercase; }
.workbench-file-input { height: 0; opacity: 0; position: absolute; width: 0; }
.collection-tabs { align-items: center; border-bottom: 1px solid #d6d2c9; display: flex; gap: 18px; margin-top: 18px; min-height: 38px; overflow-x: auto; }
.collection-tab { background: transparent; border: 0; border-bottom: 2px solid transparent; color: #69655e; flex: 0 0 auto; font: 11px var(--body); min-height: 38px; padding: 0 0 8px; }
.collection-tab span { color: #a09b92; font: 9px var(--mono); margin-left: 5px; }
.collection-tab.active { border-bottom-color: #1b1b19; color: #1b1b19; }
.collection-tab.active span { color: #1b1b19; }
.image-category-tabs > .collection-tab.active { background: #1b1b19; border-bottom-color: transparent; color: #fff; padding: 0 9px 8px; }
.collection-tab-item { align-items: center; border-bottom: 2px solid transparent; display: inline-flex; flex: 0 0 auto; min-height: 38px; }
.collection-tab-item[draggable='true'] { cursor: grab; }
.collection-tab-item[draggable='true']:active { cursor: grabbing; }
.collection-tab-item.is-dragging { opacity: .42; }
.collection-tab-item.is-drag-over { border-bottom-color: #1b1b19; box-shadow: inset 0 -2px 0 #1b1b19; }
.collection-tab-item .collection-tab { border-bottom: 0; padding-right: 5px; }
.collection-tab-item.active { border-bottom-color: #1b1b19; }
.collection-tab-item.active .collection-tab, .collection-tab-item.active .collection-tab span { color: #1b1b19; }
.collection-tab-delete { background: transparent; border: 0; color: #aaa59c; font: 17px/1 var(--body); height: 22px; margin: 0 0 8px; padding: 0; width: 18px; }
.collection-tab-delete:hover, .collection-tab-delete:focus-visible { color: #a14c40; }
.collection-tab-delete:disabled { cursor: wait; opacity: .45; }
.collection-tab-add { align-items: center; border: 1px solid #bdb8af; display: inline-flex; font: 18px/1 var(--body); height: 24px; justify-content: center; margin-bottom: 7px; padding: 0; width: 24px; }
.image-category-tabs .collection-tab-item.active { background: #1b1b19; border-bottom-color: transparent; padding: 0 7px; }
.image-category-tabs .collection-tab-item.active .collection-tab { color: #fff; }
.image-category-tabs .collection-tab-item.active .collection-tab-delete { color: rgba(255,255,255,.72); }
.image-category-tabs .collection-tab-item.active .collection-tab-delete:hover { color: #ff907e; }
.image-category-tabs [data-image-category] { transition: background-color .16s ease, color .16s ease, outline-color .16s ease; }
.image-category-tabs [data-image-category].is-project-drop-target { background: #b8ed18; color: #111; outline: 2px solid #b8ed18; outline-offset: 2px; }
.collection-inline-create { align-items: center; background: #f1efe9; border-bottom: 1px solid #d6d2c9; display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto auto; padding: 10px 0; }
.collection-inline-create input { background: #fbfaf7; border: 1px solid #cfcac1; min-height: 36px; padding: 0 10px; }
.collection-inline-create button { background: #1b1b19; border: 0; color: #fff; font: 10px var(--mono); min-height: 36px; padding: 0 12px; }
.collection-inline-create #collection-inline-cancel { background: transparent; color: #615e57; }
.batch-toolbar { align-items: center; background: #e6e4dc; border: 1px solid #d4d0c7; display: flex; gap: 10px; margin-top: 18px; min-height: 52px; padding: 7px 10px; }
.batch-toolbar > span { color: #3f3d38; font: 11px var(--mono); margin-right: auto; }
.batch-toolbar select { background: #fbfaf7; border: 1px solid #c9c5bc; color: #1b1b19; font-size: 12px; min-height: 34px; padding: 0 9px; }
.batch-toolbar #batch-clear-button { background: transparent; color: #5f5c56; padding: 0 4px; }
.batch-toolbar .batch-delete-button { background: #9a493d; }
.asset-dropzone { position: relative; }
.asset-dropzone-note { align-items: center; color: #6d6961; display: flex; font: 10px var(--mono); justify-content: space-between; letter-spacing: .06em; padding-top: 18px; text-transform: uppercase; }
.asset-dropzone-note small { color: #9a958c; font: inherit; }
.asset-dropzone-overlay { align-items: center; background: rgba(27, 27, 25, .94); color: #fff; display: none; font: 12px var(--mono); inset: 0; justify-content: center; letter-spacing: .08em; position: absolute; text-transform: uppercase; z-index: 8; }
.asset-dropzone.is-file-dragover .asset-dropzone-overlay { display: flex; }
.asset-grid { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-top: 22px; }
.asset-tile { background: #f0eee9; border: 1px solid #d6d2c9; min-width: 0; position: relative; }
.asset-tile[draggable='true'] { cursor: grab; }
.asset-tile[draggable='true']:active { cursor: grabbing; }
.asset-tile.is-active { border-color: #1b1b19; box-shadow: inset 0 0 0 1px #1b1b19; }
.asset-tile.is-dragging { opacity: .36; }
.asset-tile.is-drag-over { border-color: #1b1b19; box-shadow: 0 0 0 2px #1b1b19; }
.asset-grid.is-sorting { opacity: .65; pointer-events: none; }
.asset-tile-select { background: transparent; border: 0; display: block; padding: 0; position: relative; text-align: left; width: 100%; }
.asset-tile-select img { aspect-ratio: 4 / 3; display: block; object-fit: cover; width: 100%; }
.asset-slot, .asset-category { bottom: 27px; color: #fff; font: 10px var(--mono); letter-spacing: .06em; position: absolute; text-shadow: 0 1px 8px rgba(0, 0, 0, .55); }
.asset-slot { left: 0; padding: 8px 10px; }
.asset-category { max-width: 70%; overflow: hidden; padding: 8px 10px; right: 0; text-overflow: ellipsis; white-space: nowrap; }
.asset-role { background: rgba(17, 17, 16, .72); bottom: 0; color: #fff; display: grid; font: 9px var(--mono); gap: 2px; left: 0; letter-spacing: .06em; padding: 7px 9px; position: absolute; right: 0; text-align: left; text-transform: uppercase; }
.asset-role strong { font: inherit; }
.asset-role small { color: rgba(255, 255, 255, .75); font: 8px var(--mono); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asset-tile-delete, .asset-tile-replace { align-items: center; background: rgba(20, 20, 18, .88); border: 0; bottom: 5px; color: #fff; display: flex; font: 16px/1 var(--body); height: 20px; justify-content: center; opacity: 0; padding: 0; position: absolute; transition: opacity .16s ease; width: 20px; z-index: 4; }
.asset-tile-delete { left: 5px; }
.asset-tile-replace { font-size: 14px; right: 5px; }
.asset-tile:hover .asset-tile-delete, .asset-tile:hover .asset-tile-replace, .asset-tile.is-active .asset-tile-delete, .asset-tile.is-active .asset-tile-replace, .asset-tile:focus-within .asset-tile-delete, .asset-tile:focus-within .asset-tile-replace { opacity: 1; }
.asset-tile-delete:hover, .asset-tile-delete:focus-visible { background: #9a493d; }
.asset-tile-replace:hover, .asset-tile-replace:focus-visible { background: #1b1b19; }
.asset-batch-check { align-items: center; background: #fbfaf7; border: 1px solid #c9c5bc; display: flex; height: 22px; justify-content: center; left: 9px; position: absolute; top: 9px; width: 22px; z-index: 2; }
.asset-batch-check input { height: 14px; margin: 0; width: 14px; }
.asset-drag-handle { align-items: center; background: #1b1b19; color: #fff; display: flex; font: 700 13px/1 var(--mono); height: 24px; justify-content: center; position: absolute; right: 9px; top: 9px; width: 24px; }
.asset-tile-empty { border-style: dashed; min-height: 0; }
.asset-empty-action { align-items: center; aspect-ratio: 4 / 3; background: transparent; border: 0; color: #6d6961; display: flex; flex-direction: column; gap: 8px; justify-content: center; width: 100%; }
.asset-empty-action span { border: 1px solid #aaa59c; border-radius: 50%; font-size: 21px; height: 30px; line-height: 27px; width: 30px; }
.asset-empty-action strong { font-size: 12px; font-weight: 600; }
.asset-empty-action small { font: 9px var(--mono); letter-spacing: .07em; text-transform: uppercase; }
.workbench-inspector { align-self: start; background: #f6f4ef; border-left: 1px solid #d6d2c9; max-height: 100svh; min-width: 0; overflow-y: auto; padding: 26px 20px; position: sticky; top: 0; }
.inspector-mobile-toggle { display: none; }
.inspector-heading { border-bottom: 1px solid #d6d2c9; display: flex; justify-content: space-between; padding-bottom: 13px; }
.inspector-heading > span { color: #6d6961; font-size: 11px; }
.inspector-preview { background: #e8e5de; margin: 18px 0 8px; max-height: 44svh; overflow: hidden; position: relative; }
.inspector-preview img { display: block; height: 100%; object-fit: cover; width: 100%; }
.inspector-preview-empty { align-items: center; aspect-ratio: 4 / 3; color: #77736b; display: flex; font-size: 12px; justify-content: center; }
.category-reveal-preview {
  background: #030405;
  isolation: isolate;
}
.category-reveal-preview::after {
  background: linear-gradient(180deg, transparent 0 46%, rgba(0,0,0,.24) 62%, rgba(0,0,0,.68) 100%);
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}
.category-reveal-preview img,
.category-reveal-preview .category-title-preview {
  will-change: clip-path, filter, opacity, transform;
}
.category-reveal-preview .category-title-preview {
  z-index: 3;
}
.category-preview-wipe {
  background: linear-gradient(90deg, rgba(213,255,36,0), rgba(255,235,190,.46), rgba(255,118,66,.38), rgba(255,255,255,0));
  inset: -16% -34%;
  mix-blend-mode: screen;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  z-index: 4;
}
.category-preview-scan {
  background: linear-gradient(180deg, transparent, rgba(255,255,255,.88), transparent);
  height: 34%;
  left: 0;
  mix-blend-mode: screen;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  right: 0;
  top: 34%;
  z-index: 4;
}
.admin-ghost-action {
  background: transparent;
  border: 1px solid rgba(241,240,234,.18);
  color: inherit;
  cursor: pointer;
  font: 10px var(--mono);
  letter-spacing: .08em;
  margin-top: 10px;
  padding: 9px 10px;
  text-transform: uppercase;
  width: 100%;
}
.admin-ghost-action:hover {
  border-color: rgba(213,255,36,.5);
  color: var(--neon);
}
.inspector-crop-picker { background: transparent; border: 0; cursor: crosshair; inset: 0; padding: 0; position: absolute; width: 100%; }
.inspector-crop-picker span { background: rgba(255, 255, 255, .14); border: 1px solid #fff; border-radius: 50%; box-shadow: 0 0 0 999px rgba(0, 0, 0, .08); height: 18px; position: absolute; transform: translate(-50%, -50%); width: 18px; }
.inspector-crop-hint { color: #77736b; font: 9px var(--mono); letter-spacing: .06em; margin: 0 0 15px; text-transform: uppercase; }
.inspector-form .field { margin: 14px 0; }
.inspector-form .field input, .inspector-form .field select { background: #fbfaf7; min-height: 42px; padding: 9px 10px; }
.featured-toggle { align-items: center; border: 1px solid #d6d2c9; color: #45423d; display: flex; font-size: 12px; gap: 9px; margin: 14px 0; min-height: 40px; padding: 0 10px; }
.featured-toggle input { accent-color: #1b1b19; height: 15px; margin: 0; width: 15px; }
.inspector-role-note { background: #ece9e2; color: #605d56; font: 11px/1.5 var(--mono); margin: 14px 0; padding: 10px; }
.inspector-form .admin-action { margin-top: 2px; width: 100%; }
.inspector-actions { display: grid; gap: 8px; grid-template-columns: 1fr 1fr; margin-top: 10px; }
.inspector-secondary, .inspector-danger { background: transparent; border: 1px solid #bbb6ad; color: #4f4c46; font: 10px var(--mono); letter-spacing: .06em; min-height: 38px; padding: 0 10px; text-transform: uppercase; }
.inspector-danger { border-color: #b7786e; color: #9a493d; }
.inspector-meta { border-top: 1px solid #d6d2c9; color: #77736b; font: 9px/1.6 var(--mono); letter-spacing: .06em; margin: 20px 0 0; padding-top: 13px; text-transform: uppercase; }
.workbench-empty-inspector { color: #68645d; }
.workbench-empty-inspector h3 { color: #242320; font-size: 19px; letter-spacing: 0; margin: 10px 0; }
.workbench-empty-inspector p:last-child { font-size: 13px; line-height: 1.65; }
.admin-workbench .admin-message { margin-top: 18px; }
.workbench-loading { color: #68645d; font-size: 14px; margin-top: 24px; }

:root[data-theme='dark'] .admin-shell { background: #101216; color: #f1f0ea; }
:root[data-theme='dark'] .asset-delete-dialog { background: #171a1f; border-color: #3b4048; color: #f1f0ea; }
:root[data-theme='dark'] .asset-delete-dialog form > span,
:root[data-theme='dark'] .asset-delete-dialog p { color: #a4a7a4; }
:root[data-theme='dark'] .asset-delete-dialog form > div { border-top-color: #30343a; }
:root[data-theme='dark'] .asset-delete-dialog button { border-color: #555b65; }
:root[data-theme='dark'] .asset-delete-dialog button:hover { border-color: #f1f0ea; }
:root[data-theme='dark'] .admin-top { border-bottom-color: #30343a; }
:root[data-theme='dark'] .admin-brand { color: #f1f0ea; }
:root[data-theme='dark'] .admin-brand span,
:root[data-theme='dark'] .admin-back { color: #a4a7a4; }
:root[data-theme='dark'] .admin-panel,
:root[data-theme='dark'] .admin-workbench { background: #171a1f; border-color: #30343a; }
:root[data-theme='dark'] .workbench-sidebar { background: #13161b; border-right-color: #30343a; }
:root[data-theme='dark'] .workbench-inspector { background: #14171c; border-left-color: #30343a; }
:root[data-theme='dark'] .workbench-view-header,
:root[data-theme='dark'] .workbench-sidebar-footer,
:root[data-theme='dark'] .category-cover-picker,
:root[data-theme='dark'] .home-effect-form { border-color: #30343a; }
:root[data-theme='dark'] .workbench-sidebar h2,
:root[data-theme='dark'] .workbench-view-header h2,
:root[data-theme='dark'] .workbench-empty-inspector h3,
:root[data-theme='dark'] .project-admin-card { color: #f1f0ea; }
:root[data-theme='dark'] .workbench-kicker,
:root[data-theme='dark'] .inspector-kicker,
:root[data-theme='dark'] .setting-kicker,
:root[data-theme='dark'] .workbench-site-state,
:root[data-theme='dark'] .workbench-nav button,
:root[data-theme='dark'] .workbench-sidebar-footer a,
:root[data-theme='dark'] .workbench-sidebar-footer button,
:root[data-theme='dark'] .project-admin-card > span,
:root[data-theme='dark'] .project-admin-card small,
:root[data-theme='dark'] .workbench-empty-inspector { color: #a4a7a4; }
:root[data-theme='dark'] .workbench-nav button.active { background: #ecebe4; color: #171a1f; }
:root[data-theme='dark'] .workbench-nav button.active span { color: #565953; }
:root[data-theme='dark'] .workbench-header-actions button,
:root[data-theme='dark'] .category-create-bar button,
:root[data-theme='dark'] .batch-toolbar button,
:root[data-theme='dark'] .admin-action { background: #ecebe4; color: #171a1f; }
:root[data-theme='dark'] .field input,
:root[data-theme='dark'] .field select,
:root[data-theme='dark'] .field textarea,
:root[data-theme='dark'] .home-effect-form label,
:root[data-theme='dark'] .category-reveal-form select { background: #101216; border-color: #3b4048; color: #f1f0ea; }
:root[data-theme='dark'] .field label,
:root[data-theme='dark'] .home-effect-form small,
:root[data-theme='dark'] .category-reveal-form small { color: #a4a7a4; }
:root[data-theme='dark'] .asset-tile-empty,
:root[data-theme='dark'] .project-admin-empty,
:root[data-theme='dark'] .inline-project-dropzone { background: #1d2128; border-color: #3b4048; color: #bfc2bb; }
:root[data-theme='dark'] .security-workbench-grid section,
:root[data-theme='dark'] .contact-workbench-form,
:root[data-theme='dark'] .profile-settings-section,
:root[data-theme='dark'] .category-title-preview { background-color: transparent; border-color: #30343a; color: #f1f0ea; }
:root[data-theme='dark'] .profile-settings-section > header p,
:root[data-theme='dark'] .share-cover-uploader p { color: #a4a7a4; }
:root[data-theme='dark'] .share-cover-upload-preview { background: #232830; }
:root[data-theme='dark'] .inspector-secondary { background: #232830; border-color: #454b55; color: #ecebe4; }
:root[data-theme='dark'] .inspector-danger { background: transparent; border-color: #9c514b; color: #ff8c80; }
:root[data-theme='dark'] .admin-message { background: #27331d; color: #e8efd4; }
:root[data-theme='dark'] .image-category-tabs .collection-tab-item.active { background: #ecebe4; }
:root[data-theme='dark'] .image-category-tabs .collection-tab-item.active .collection-tab { color: #171a1f; }
:root[data-theme='dark'] .image-category-tabs .collection-tab-item.active .collection-tab-delete { color: #575b55; }
:root[data-theme='dark'] .image-category-tabs > .collection-tab.active { background: #ecebe4; color: #171a1f; }

@media (max-width: 1150px) and (min-width: 701px) {
  .admin-shell { padding-left: 30px; padding-right: 30px; }
  .admin-workbench { grid-template-columns: 180px minmax(0, 1fr) 278px; }
  .workbench-sidebar { padding-left: 14px; padding-right: 14px; }
  .workbench-main { padding: 26px; }
  .workbench-inspector { padding: 22px 16px; }
  .security-workbench-grid { grid-template-columns: 1fr; }
}
.category-create-bar { border-bottom: 1px solid #d6d2c9; display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto; padding: 22px 0; }
.category-create-bar input { background: #fbfaf7; border: 1px solid #d6d2c9; min-height: 40px; padding: 0 12px; }
.project-category-create { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; }
.project-category-list { padding-top: 18px; }
.project-category-row { align-items: center; border-top: 1px solid #dedad2; display: grid; gap: 10px; grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr) 58px 66px 56px; padding: 10px 0; }
.project-category-row[draggable='true'] { cursor: grab; }
.project-category-row.is-dragging { opacity: .4; }
.project-category-row input { background: transparent; border: 0; color: #1b1b19; min-width: 0; padding: 8px 0; }
.project-category-order, .project-category-row > span:not(.project-category-order) { color: #77736b; font: 10px var(--mono); }
.project-category-row .inspector-secondary, .project-category-row .inspector-danger { min-height: 32px; padding: 0 6px; }
.category-table { padding-top: 16px; }
.category-table-head, .category-table-row { align-items: center; display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr) 92px 168px; }
.category-table-head { color: #77736b; font: 9px var(--mono); letter-spacing: .08em; padding: 0 12px 10px; text-transform: uppercase; }
.category-table-row { border-top: 1px solid #dedad2; padding: 10px 12px; }
.category-table-row input { background: transparent; border: 0; color: #1b1b19; font-size: 15px; min-width: 0; padding: 7px 0; }
.category-table-row > span { color: #6d6961; font: 11px var(--mono); }
.category-table-row > div { display: grid; gap: 7px; grid-template-columns: 1fr 1fr; }
.security-workbench-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); padding-top: 22px; }
.contact-workbench-form { max-width: 560px; padding-top: 22px; }
.contact-workbench-form .field { margin: 14px 0; }
.contact-workbench-form .admin-action { margin-top: 6px; }
.profile-settings-form { max-width: 920px; padding-top: 26px; }
.profile-settings-section { border-bottom: 1px solid #d6d2c9; padding: 0 0 32px; }
.profile-settings-section + .profile-settings-section { padding-top: 32px; }
.profile-settings-section > header { margin-bottom: 20px; }
.profile-settings-section > header h3 { font-size: 20px; font-weight: 500; margin: 0 0 6px; }
.profile-settings-section > header p { color: #77736b; font-size: 11px; line-height: 1.6; margin: 0; }
.profile-fields-grid { display: grid; gap: 18px 20px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.profile-fields-grid .field { margin: 0; }
.profile-field-wide { grid-column: 1 / -1; }
.profile-save-action { margin-top: 24px; }
.share-cover-uploader { align-items: center; display: grid; gap: 18px; grid-template-columns: minmax(180px, 280px) minmax(0, 1fr); }
.share-cover-upload-preview { align-items: center; aspect-ratio: 1.91 / 1; background: #e8e5de; display: flex; justify-content: center; overflow: hidden; }
.share-cover-upload-preview img { height: 100%; object-fit: cover; width: 100%; }
.share-cover-upload-preview span { color: #77736b; font-size: 11px; }
.share-cover-uploader > div:last-of-type { align-items: start; display: grid; gap: 10px; }
.share-cover-uploader p { color: #77736b; font-size: 10px; line-height: 1.55; margin: 0; max-width: 46ch; }
.security-workbench-grid section { background: #f6f4ef; border: 1px solid #d6d2c9; padding: 20px; }
.security-workbench-grid h3 { font-size: 18px; font-weight: 500; letter-spacing: 0; margin: 8px 0 16px; overflow-wrap: anywhere; }
.security-workbench-grid .field { margin: 12px 0; }
.security-workbench-grid .admin-action { margin-top: 4px; }
.security-workbench-grid #recovery-confirm-form { border-top: 1px solid #d6d2c9; margin-top: 17px; padding-top: 4px; }
.project-admin-grid { align-items: start; display: grid; gap: 22px; grid-template-columns: repeat(3, minmax(0, 1fr)); padding-top: 24px; }
.project-admin-card { background: transparent; border: 0; color: #1b1b19; display: grid; gap: 7px; padding: 0; text-align: left; }
.category-project-grid .project-admin-card[draggable="true"] { cursor: grab; }
.category-project-grid .project-admin-card.is-dragging { cursor: grabbing; opacity: .42; }
.project-admin-card img, .project-admin-empty { aspect-ratio: 4 / 5; background: #ebe8e1; display: block; object-fit: cover; width: 100%; }
.project-admin-empty { align-items: center; color: #77736b; display: flex; font: 10px var(--mono); justify-content: center; text-transform: uppercase; }
.project-admin-card > span, .project-admin-card small { color: #77736b; font: 10px var(--mono); letter-spacing: .06em; }
.project-admin-card strong { font-size: 15px; font-weight: 500; }
.project-admin-card:hover img, .project-admin-card.is-active img { opacity: .78; transform: translateY(-2px); }
.project-admin-card img { transition: opacity .2s ease, transform .2s ease; }
.project-form .field { margin: 14px 0; }
.project-form .field input, .project-form .field select { background: #fbfaf7; min-height: 40px; padding: 8px 10px; }
.project-assets-heading { align-items: baseline; border-top: 1px solid #d6d2c9; display: flex; justify-content: space-between; margin-top: 22px; padding-top: 16px; }
.project-assets-heading span { color: #1b1b19; font-size: 12px; }
.project-assets-heading small { color: #77736b; font: 9px var(--mono); text-align: right; }
.project-asset-picker { display: grid; gap: 7px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 12px 0 18px; max-height: 280px; overflow-y: auto; }
.project-asset-choice { border: 1px solid #d6d2c9; display: block; min-width: 0; padding: 4px; position: relative; }
.project-asset-choice input { left: 8px; position: absolute; top: 8px; z-index: 1; }
.project-asset-choice img { aspect-ratio: 1; display: block; object-fit: cover; width: 100%; }
.project-asset-choice span { display: block; font-size: 9px; overflow: hidden; padding: 5px 1px 1px; text-overflow: ellipsis; white-space: nowrap; }
.project-sequence { border-top: 1px solid #d6d2c9; margin-top: 20px; padding-top: 14px; }
#project-sequence-list { display: grid; gap: 7px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
#project-sequence-list article { cursor: grab; margin: 0; min-width: 0; position: relative; }
#project-sequence-list article.is-dragging { opacity: .35; }
#project-sequence-list img { aspect-ratio: 1; display: block; object-fit: cover; width: 100%; }
#project-sequence-list span { background: #1b1b19; color: #fff; font: 8px var(--mono); left: 0; padding: 3px 4px; position: absolute; top: 0; }
.project-delete-button { margin-top: 18px; width: 100%; }
.project-layout-editor { border-top: 1px solid #d6d2c9; margin-top: 40px; padding-top: 19px; }
.project-layout-editor > header { align-items: end; display: flex; justify-content: space-between; }
.project-layout-editor h3 { color: #1b1b19; font-size: 18px; font-weight: 500; letter-spacing: 0; margin: 4px 0 0; }
.project-layout-editor > header button { background: #1b1b19; border: 1px solid #1b1b19; color: #fff; font: 10px var(--mono); min-height: 36px; padding: 0 14px; }
.project-layout-editor > header button:disabled { background: transparent; color: #77736b; cursor: default; }
.project-layout-actions { align-items: center; display: flex; gap: 7px; }
.project-layout-actions #project-layout-magazine { background: transparent; color: #1b1b19; }
.project-layout-actions #project-layout-magazine:hover { background: #1b1b19; color: #fff; }
.project-layout-modes { align-items: center; display: flex; gap: 6px; margin-top: 14px; }
.project-layout-modes button { background: transparent; border: 1px solid #c9c5bc; color: #77736b; font: 10px var(--mono); min-height: 30px; padding: 0 10px; }
.project-layout-modes button.active { background: #1b1b19; border-color: #1b1b19; color: #fff; }
.project-layout-modes output { color: #77736b; font: 10px var(--mono); margin-left: auto; }
.project-layout-editor > p { color: #77736b; font-size: 12px; line-height: 1.6; margin: 10px 0 16px; }
.project-layout-canvas-viewport { border: 1px solid #d6d2c9; max-height: 68svh; overflow: auto; overscroll-behavior: contain; }
.project-layout-canvas { aspect-ratio: var(--project-editor-ratio, 3 / 4); background-color: #ebe8e1; background-image: linear-gradient(to right, rgba(91, 87, 80, .13) 1px, transparent 1px), linear-gradient(to bottom, rgba(91, 87, 80, .13) 1px, transparent 1px); background-size: calc(100% / 24) calc(100% / 36); min-height: 0; overflow: hidden; position: relative; transition: max-width .25s ease; width: 100%; }
.project-layout-canvas.is-mobile-layout { background-size: calc(100% / 9) calc(100% / 36); margin: 0 auto; max-width: 360px; min-height: 0; }
.project-layout-extend { background: #1b1b19; border: 0; color: #fff; display: block; font: 10px var(--mono); min-height: 42px; position: sticky; width: 100%; }
.project-layout-extend span { font-size: 16px; margin-right: 5px; vertical-align: -1px; }
.project-layout-extend:disabled { color: #77736b; cursor: default; }
.project-layout-item { background: #d4d0c7; cursor: grab; height: var(--layout-h); left: var(--layout-x); margin: 0; overflow: hidden; position: absolute; top: var(--layout-y); touch-action: none; user-select: none; width: var(--layout-w); }
.project-layout-item.is-adjusting { cursor: grabbing; z-index: 3; }
.project-layout-item[style*='--asset-ratio'] { aspect-ratio: var(--asset-ratio); height: auto; }
.project-layout-item img { display: block; height: 100%; object-fit: contain; pointer-events: none; width: 100%; }
.project-layout-item > span { background: rgba(27, 27, 25, .82); color: #fff; font: 9px var(--mono); left: 0; padding: 4px 5px; position: absolute; top: 0; }
.project-layout-item > i { background: rgba(20, 20, 18, .62); bottom: 0; cursor: nwse-resize; height: 28px; position: absolute; right: 0; touch-action: none; width: 28px; }
.project-layout-item > i::after { border-bottom: 2px solid #fff; border-right: 2px solid #fff; bottom: 7px; content: ''; height: 9px; position: absolute; right: 7px; width: 9px; }

@media (max-width: 980px) {
  .admin-workbench { grid-template-columns: 190px minmax(0, 1fr) 280px; }
  .asset-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-admin-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .admin-shell { padding: 14px 14px 24px; }
  .admin-top { min-height: 46px; }
  .admin-workbench { display: block; margin-top: 14px; min-height: calc(100svh - 76px); }
  .workbench-sidebar { border-bottom: 1px solid #d6d2c9; border-right: 0; min-height: 0; padding: 17px 16px 0; }
  .workbench-sidebar > div:first-child { display: none; }
  .workbench-nav { display: flex; gap: 12px; margin: 0; overflow-x: auto; }
  .workbench-nav button { flex: 0 0 auto; min-height: 42px; padding: 0 3px; }
  .workbench-nav button span { display: none; }
  .workbench-nav button.active { background: transparent; border-bottom: 2px solid #1b1b19; color: #1b1b19; }
  .workbench-sidebar-footer { display: none; }
  .workbench-main { padding: 20px 16px 88px; }
  .workbench-view-header h2 { font-size: 30px; }
  .profile-fields-grid { grid-template-columns: 1fr; }
  .profile-field-wide { grid-column: auto; }
  .share-cover-uploader { align-items: stretch; grid-template-columns: 1fr; }
  .collection-tabs { gap: 15px; margin-top: 14px; }
  .collection-inline-create { grid-template-columns: minmax(0, 1fr) auto; }
  .project-category-create { grid-template-columns: 1fr 1fr; }
  .project-category-create button { grid-column: 1 / -1; }
  .project-category-row { grid-template-columns: 28px minmax(0, 1fr) minmax(0, 1fr); }
  .project-category-row > span:not(.project-category-order) { display: none; }
  .project-category-row .inspector-secondary, .project-category-row .inspector-danger { grid-column: span 1; }
  .collection-inline-create #collection-inline-cancel { grid-column: 1 / -1; justify-self: start; padding: 0; }
  .asset-grid { gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-admin-grid { gap: 28px 12px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-layout-editor { margin-top: 30px; }
  .project-layout-editor > header { align-items: start; gap: 12px; }
  .asset-category { display: none; }
  .batch-toolbar { align-items: stretch; flex-wrap: wrap; }
  .batch-toolbar > span { min-width: 100%; }
  .batch-toolbar select { flex: 1; }
  .workbench-inspector { bottom: 0; box-shadow: 0 -8px 30px rgba(20, 20, 18, .12); left: 0; max-height: 62svh; overflow: auto; position: fixed; right: 0; transform: translateY(calc(100% - 50px)); transition: transform .2s ease; z-index: 50; }
  .workbench-inspector.is-open { transform: translateY(0); }
  .inspector-mobile-toggle { background: #1b1b19; border: 0; color: #fff; display: block; font: 10px var(--mono); height: 50px; letter-spacing: .07em; margin: -26px -20px 18px; text-align: left; text-transform: uppercase; width: calc(100% + 40px); }
  .security-workbench-grid { grid-template-columns: 1fr; }
  .category-table-head { display: none; }
  .category-table-row { grid-template-columns: minmax(0, 1fr) auto; padding: 13px 0; }
  .category-table-row > div { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
}

/* Commercial portfolio v2 */
:root {
  --ink: #1A1A1A;
  --paper: #FFFFFF;
  --muted: #666666;
  --line: rgba(26, 26, 26, .12);
  --accent: #FFD166;
  --card: #F5F5F3;
  --soft: #F8F8F6;
  --body: 'DM Mono', 'PingFang SC', 'Source Han Sans SC', 'Microsoft YaHei', monospace;
  --mono: 'DM Mono', 'PingFang SC', 'Microsoft YaHei', monospace;
  --heading: 'Cormorant Garamond', 'Noto Serif SC', 'Songti SC', SimSun, serif;
  --contact: 'Jost', 'Avenir Next', 'Helvetica Neue', sans-serif;
  color-scheme: light;
}

:root[data-theme='dark'] {
  --ink: #F4F4F1;
  --paper: #0F1114;
  --muted: #9A9A94;
  --line: rgba(244, 244, 241, .14);
  --card: #181A1E;
  --soft: #14161A;
  color-scheme: dark;
}

:root[data-theme='light'] {
  --ink: #1A1A1A;
  --paper: #F4F3EE;
  --muted: #625F58;
  --line: rgba(26, 26, 26, .12);
  --card: #EAE8E0;
  --soft: #F8F7F3;
  color-scheme: light;
}

html { scroll-behavior: smooth; }
body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--body);
  letter-spacing: 0;
}

body.is-gallery-open { overflow: hidden; }

.site-header {
  align-items: center;
  background: rgba(255, 255, 255, .92);
  backdrop-filter: blur(14px);
  border-bottom: 0;
  color: var(--ink);
  display: flex;
  height: 72px;
  justify-content: space-between;
  left: 0;
  mix-blend-mode: normal;
  padding: 0 clamp(22px, 4vw, 64px);
  position: fixed;
  right: 0;
  top: 0;
  transition: background-color .58s ease, backdrop-filter .58s ease, border-color .58s ease;
  z-index: 40;
}

:root[data-theme='light'] .site-header { background: rgba(244, 243, 238, .94); }

:root[data-theme='dark'] .site-header {
  background: rgba(15, 17, 20, .92);
}

.site-header.is-home-transparent {
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

.site-header.is-immersive-transparent {
  backdrop-filter: none;
  background: transparent;
  border-color: transparent;
}

:root[data-theme='light'] .site-header.is-home-transparent,
:root[data-theme='dark'] .site-header.is-home-transparent,
:root[data-theme='light'] .site-header.is-immersive-transparent,
:root[data-theme='dark'] .site-header.is-immersive-transparent {
  background: transparent;
}

/* The home Hero uses a fixed white masthead over photography in every theme. */
.site-header.is-home-transparent .wordmark,
.site-header.is-home-transparent .wordmark span,
.site-header.is-home-transparent .wordmark small,
.site-header.is-home-transparent .site-nav a,
.site-header.is-home-transparent .admin-link,
.site-header.is-home-transparent .site-actions > * {
  color: #fff !important;
}
.site-header.is-home-transparent .site-nav a:is(:hover, :focus-visible, .active),
.site-header.is-home-transparent .admin-link:is(:hover, :focus-visible),
.site-header.is-home-transparent .site-actions > :is(:hover, :focus-visible) {
  color: #fff !important;
}
.site-header.is-home-transparent .round-button { border-color: rgba(255,255,255,.72); }
.site-header.is-home-transparent .round-button:is(:hover, :focus-visible) {
  background: rgba(255,255,255,.12);
  border-color: #fff;
  outline-color: #fff;
}
.site-header.is-poster-hero .wordmark span,
.site-header.is-poster-hero .wordmark small { display: none; }

.wordmark {
  align-items: baseline;
  color: var(--ink);
  display: flex;
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: 27px;
  font-weight: 600;
  gap: 7px;
  letter-spacing: .05em;
  line-height: 1;
}

:root:not([data-theme='dark']) .wordmark { color: #151515; }
:root:not([data-theme='dark']) .wordmark span,
:root:not([data-theme='dark']) .wordmark small { color: #5e5e58; }
:root:not([data-theme='dark']) .site-nav a,
:root:not([data-theme='dark']) .admin-link { color: #4a4a45; }
:root:not([data-theme='dark']) .site-nav a.active,
:root:not([data-theme='dark']) .site-nav a:hover,
:root:not([data-theme='dark']) .admin-link:hover { color: #151515; }
:root:not([data-theme='dark']) .round-button { border-color: #9a9a93; color: #20201d; }
:root[data-theme='dark'] .site-nav a,
:root[data-theme='dark'] .site-nav a:last-child,
:root[data-theme='dark'] .admin-link { color: #a8aaa5; }
:root[data-theme='dark'] .site-nav a.active,
:root[data-theme='dark'] .site-nav a:hover,
:root[data-theme='dark'] .admin-link:hover { color: #f4f4f1; }

.wordmark span,
.wordmark small {
  color: var(--muted);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0;
}
.wordmark small { font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif; }

.site-nav {
  display: flex;
  font: 400 16px/1 var(--body);
  gap: 30px;
  letter-spacing: 0;
  text-transform: none;
}

.site-nav a,
.admin-link {
  color: var(--muted);
  transition: color .25s ease;
}

.site-nav a:hover,
.site-nav a.active,
.admin-link:hover {
  color: var(--ink);
}

.site-actions {
  align-items: center;
  display: flex;
  gap: 18px;
}

.admin-link {
  font-size: 13px;
}

.round-button {
  align-items: center;
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--ink);
  display: inline-flex;
  height: 38px;
  justify-content: center;
  width: 38px;
}

.round-button:hover { border-color: var(--accent); color: var(--ink); }
.round-button svg { height: 17px; width: 17px; }

.portfolio-main,
.portfolio-page,
.info-page {
  background: var(--paper);
  min-height: 100svh;
}

.home-hero {
  display: grid;
  min-height: 100svh;
  overflow: hidden;
  padding: 72px 0 0;
  position: relative;
}

.hero-media {
  background: var(--card);
  inset: 0;
  overflow: hidden;
  position: absolute;
}

.hero-media::after {
  background: linear-gradient(180deg, rgba(244, 243, 238, .02) 20%, rgba(244, 243, 238, .12) 54%, rgba(244, 243, 238, .93) 100%);
  content: '';
  inset: 0;
  position: absolute;
}
.hero-media .category-cover-picture,
.category-slide .category-cover-picture {
  display: block;
  inset: 0;
  overflow: hidden;
  position: absolute;
  z-index: 1;
}
.hero-media .category-cover-backdrop,
.category-slide .category-cover-backdrop {
  background-color: var(--card);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: blur(24px) brightness(.66) saturate(.9);
  inset: -28px;
  position: absolute;
  transform: scale(1.08);
  z-index: 0;
}
.hero-media .category-cover-picture img,
.category-slide .category-cover-picture img {
  background: var(--card);
  height: 100%;
  object-fit: cover;
  position: relative;
  width: 100%;
  z-index: 1;
}

/* Keep the Hero photograph unfiltered by a page tint. Text contrast lives on
   the copy itself, rather than on a white or dark image overlay. */
.home-hero > .hero-media::after,
.immersive-hero .hero-media::after,
.home-hero.is-scroll-cinema::after,
.immersive-hero::before,
.immersive-hero::after {
  background: none !important;
  content: none;
}

.hero-image,
.hero-media img {
  display: block;
  filter: none;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  position: static;
  transform: none;
  transition: opacity .7s ease;
  width: 100%;
}

.hero-media img.is-loaded,
img.is-loaded { opacity: 1; }

.motion-title-line {
  display: block;
  transform-origin: left bottom;
  will-change: opacity, transform;
}

.album-cover img,
.about-portrait img,
.gallery-image { will-change: filter, opacity, transform; }

.hero-copy {
  align-self: end;
  color: #171717;
  max-width: 760px;
  padding: 0 clamp(40px, 5vw, 78px) clamp(56px, 7vw, 100px);
  position: relative;
  z-index: 1;
}

.eyebrow {
  color: var(--muted);
  font-size: 12px;
  font-weight: 300;
  letter-spacing: .5px;
  margin: 0 0 18px;
  text-transform: uppercase;
}

.hero-copy h1 {
  align-items: flex-end;
  color: #151515;
  display: flex;
  font-family: var(--display);
  font-size: clamp(108px, 17vw, 260px);
  font-weight: 600;
  letter-spacing: 0;
  line-height: .77;
  margin: 0;
}

.hero-copy h1 i {
  background: #d5ff24;
  display: block;
  height: .15em;
  margin: 0 0 0 .08em;
  transform: translateY(.06em);
  width: .15em;
}

.hero-statement {
  color: #1d1d1c;
  font: 400 clamp(13px, 1.4vw, 19px)/1.65 var(--mono);
  letter-spacing: .04em;
  margin: 34px 0 0;
  text-transform: uppercase;
}
.home-hero .hero-copy,
.home-hero .hero-copy > h1,
.immersive-hero .hero-copy > h1,
#immersive-stage .immersive-hero .hero-copy > h1,
.home-hero .hero-statement,
.home-hero .hero-scroll-hint {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.28);
}
.hero-scroll-hint { color: var(--muted); display: block; font: 10px var(--mono); letter-spacing: .12em; margin-top: 22px; }

/* Optional editorial Hero: an inset photographic plate with outline type.
   The image remains the asset selected in the CMS; only the composition moves. */
.hero-layout-poster-peak {
  background: #080b0d;
  color: #fff;
  isolation: isolate;
}
.home-hero.hero-layout-poster-peak { min-height: 100svh; padding: 0; }
.hero-layout-poster-peak .hero-media {
  inset: 0;
  z-index: 0;
}
.hero-layout-poster-peak .hero-media::after {
  background: linear-gradient(180deg, rgba(3, 10, 13, .14), rgba(3, 8, 10, .24) 44%, rgba(3, 8, 10, .68));
  content: '';
  z-index: 1;
}
.hero-layout-poster-peak .hero-copy { align-self: stretch; max-width: none; padding: 0; position: static; }
.hero-layout-poster-peak .hero-copy h1 {
  color: transparent !important;
  font-family: 'Bebas Neue', 'Oswald', Impact, sans-serif;
  font-size: clamp(172px, 35vw, 500px);
  font-weight: 400;
  justify-content: flex-start;
  left: var(--hero-desktop-title-x, 7%);
  letter-spacing: -.018em;
  line-height: .8;
  position: absolute;
  right: auto;
  text-align: left;
  text-shadow: none !important;
  top: var(--hero-desktop-title-y, 32%);
  -webkit-text-stroke: 1px rgba(255, 255, 255, .88);
  transform: scale(var(--hero-desktop-title-scale, 1));
  transform-origin: left center;
  z-index: 2;
}
.hero-layout-poster-peak .hero-copy h1 i { display: none; }
.hero-layout-poster-peak .hero-statement { bottom: auto; color: #fff !important; display: grid; font: 500 clamp(10px, 1vw, 14px)/1.55 var(--mono); gap: 2px; left: var(--hero-desktop-statement-x, clamp(26px, 7vw, 108px)); letter-spacing: .12em; margin: 0; position: absolute; text-shadow: 0 1px 8px rgba(0,0,0,.48); top: var(--hero-desktop-statement-y, 64%); z-index: 3; }
.hero-layout-poster-peak .hero-statement span:not(.hero-statement-label) { display: block; white-space: nowrap; }
.hero-statement-label { align-items: center; display: flex; gap: 18px; margin-bottom: 13px; }
.hero-statement-label strong { font-family: var(--heading); font-size: clamp(20px, 1.9vw, 30px); font-weight: 500; letter-spacing: .08em; }
.hero-statement-label i { border-top: 1px solid rgba(255,255,255,.65); display: block; width: clamp(90px, 12vw, 190px); }
.hero-layout-poster-peak .hero-statement b { font: 500 clamp(10px, .9vw, 13px)/1.5 var(--mono); letter-spacing: .1em; margin-top: 8px; }
.hero-layout-poster-peak .hero-scroll-hint { display: none; }
.hero-poster-brand,.hero-poster-role,.hero-poster-enter,.hero-poster-mark { color: #fff; font: 500 11px/1.35 var(--mono); letter-spacing: .02em; position: absolute; text-shadow: 0 1px 8px rgba(0,0,0,.45); z-index: 3; }
.hero-poster-brand { font-family: var(--display); font-size: clamp(24px, 2.4vw, 38px); left: clamp(38px, 7vw, 108px); top: clamp(35px, 5vw, 76px); }
.hero-poster-brand i { font-family: var(--mono); font-size: .58em; font-style: normal; font-weight: 400; margin: 0 .16em; vertical-align: .15em; }
.hero-poster-brand small { font-family: var(--body); font-size: .46em; font-weight: 500; letter-spacing: .04em; vertical-align: .2em; }
.hero-poster-role { right: clamp(38px, 7vw, 108px); text-align: right; top: clamp(40px, 5.6vw, 84px); }
.hero-poster-role::after { border-top: 1px solid rgba(255,255,255,.55); content: ''; display: block; margin: 6px 0 0 auto; width: 24px; }
.hero-poster-scroll { bottom: clamp(40px, 5vw, 70px); color: rgba(255,255,255,.92); font: 500 10px/1 var(--mono); left: clamp(26px, 7vw, 108px); letter-spacing: .18em; position: absolute; transform: rotate(180deg); writing-mode: vertical-rl; z-index: 3; }
.immersive-hero.hero-layout-poster-peak .hero-media { inset: 0; }
.immersive-hero.hero-layout-poster-peak .hero-copy { align-self:stretch; padding:0; position:static; }
.immersive-hero.hero-layout-poster-peak .immersive-swipe-hint { display:none; }

@media (min-width: 701px) {
  .hero-layout-poster-peak .hero-statement { top: var(--hero-desktop-statement-y, 64%); }
}


.home-hero.is-scroll-cinema {
  --cinema-surface: #030405;
  --cinema-overlay:
    radial-gradient(circle at 50% 58%, transparent 0 30%, rgba(0,0,0,.16) 47%, rgba(0,0,0,.58) 100%),
    linear-gradient(180deg, transparent 0 52%, rgba(0,0,0,.72));
  background: var(--cinema-surface);
  isolation: isolate;
}
.home-hero.is-scroll-cinema::after {
  background: var(--cinema-overlay);
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 1;
}
.home-hero.is-scroll-cinema .hero-copy {
  color: #fff;
  text-shadow: 0 2px 12px rgba(0,0,0,.28);
  will-change: filter, opacity, transform;
}
.home-hero.is-scroll-cinema .hero-copy h1,
.home-hero.is-scroll-cinema .hero-statement { color: #fff; }
.home-hero.is-scroll-cinema .hero-media {
  will-change: filter, transform;
}
.home-hero.is-scroll-cinema + .category-showcase {
  background: var(--cinema-surface, #030405);
  color: #fff;
  padding-top: 0;
}

.immersive-hero { cursor: s-resize; isolation: isolate; }
.immersive-hero::before { background: linear-gradient(90deg, rgba(0, 0, 0, .3), transparent 42%, rgba(0, 0, 0, .14)); content: ''; inset: 0; pointer-events: none; position: absolute; z-index: 1; }
.immersive-hero .hero-copy { padding-bottom: clamp(150px, 15vw, 210px); transition: opacity .5s ease, transform .5s ease; }
.immersive-entry { align-items: end; background: transparent; border: 0; bottom: clamp(30px, 4vw, 58px); color: #fff; display: grid; gap: 4px; justify-items: start; padding: 0; position: absolute; right: clamp(24px, 5vw, 78px); text-align: left; z-index: 2; }
.immersive-entry span,
.immersive-entry small { font: 10px var(--mono); letter-spacing: .1em; text-transform: uppercase; }
.immersive-entry strong { font-family: var(--heading); font-size: clamp(24px, 3vw, 46px); font-weight: 500; }
.immersive-entry i { border: 1px solid rgba(255,255,255,.7); border-radius: 50%; font-size: 20px; font-style: normal; height: 38px; line-height: 34px; margin-top: 10px; text-align: center; width: 38px; }
.immersive-hero.is-entering-category .hero-copy { opacity: 0; transform: translateY(-28px); }
.immersive-hero.is-entering-category .immersive-entry { animation: immersive-entry-out .5s ease forwards; }
.immersive-hero.is-entering-category .hero-media { animation: immersive-media-out .52s cubic-bezier(.3,.7,.2,1) forwards; }
@keyframes immersive-entry-out { to { opacity: 0; transform: translateY(38px); } }
@keyframes immersive-media-out { to { filter: brightness(1.14); transform: scale(1.045); } }

.immersive-home {
  --immersive-progress: 0;
  background: #030405;
  color: #fff;
  height: 100svh;
  height: 100dvh;
  isolation: isolate;
  min-height: 0;
  overflow: hidden;
  position: relative;
}
.immersive-home::before {
  background:
    linear-gradient(90deg, rgba(255,255,255,.09) 0 1px, transparent 1px 18vw),
    linear-gradient(180deg, rgba(255,255,255,.04) 0 1px, transparent 1px 18vh);
  content: '';
  inset: 0;
  opacity: .18;
  pointer-events: none;
  position: absolute;
  z-index: 4;
}
.immersive-home::after {
  background: linear-gradient(180deg, transparent 0 44%, rgba(255,255,255,.18) 50%, transparent 56%);
  content: '';
  inset: -24% 0;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  transform: translateY(-52%);
  z-index: 5;
}
.immersive-home.is-scanning::after { animation: immersive-scan 1.05s cubic-bezier(.2,.8,.2,1) both; }
.immersive-slide {
  color: #fff;
  display: grid;
  inset: 0;
  overflow: hidden;
  padding: 76px clamp(40px, 5vw, 78px) clamp(56px, 7vw, 100px);
  pointer-events: none;
  position: absolute;
  transform: translate3d(0, 106%, 0) scale(.96);
  transition: opacity .52s cubic-bezier(.22,.72,.2,1), transform .68s cubic-bezier(.22,.72,.2,1);
  z-index: 1;
}
.immersive-slide::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.1) 32%, rgba(0,0,0,.84)),
    linear-gradient(90deg, rgba(0,0,0,.5), transparent 28%, transparent 66%, rgba(0,0,0,.42));
  content: '';
  inset: 0;
  position: absolute;
  z-index: 0;
}
.immersive-category-cover::after,
.immersive-category-cover .hero-media::after { background: none; content: none; }
.immersive-slide.is-active { opacity: 1; pointer-events: auto; transform: translate3d(0, 0, 0) scale(1); z-index: 3; }
.immersive-slide.is-before { opacity: 0; transform: translate3d(0, -34%, 0) scale(1.04); z-index: 1; }
.immersive-slide.is-after { opacity: 0; }
.immersive-slide .hero-media {
  background: #050607;
  transform-origin: center center;
  will-change: filter, transform;
  z-index: -1;
}
.immersive-slide .hero-media img {
  filter: saturate(.92) contrast(1.08) brightness(.82);
  transform: scale(1.018);
}
@media (min-width: 761px) {
  #immersive-stage.is-scrolltrigger-home .immersive-slide .hero-media img { filter: none; }
}
.immersive-hero { align-items: end; cursor: s-resize; }
.immersive-hero .hero-copy { align-self: end; padding: 0 0 clamp(50px, 8vw, 112px); z-index: 1; }
.immersive-hero.is-active .hero-copy h1 { animation: immersive-title-in .8s cubic-bezier(.2,.8,.2,1) both; }
.immersive-hero.is-active .hero-copy p { animation: immersive-copy-in .7s .16s cubic-bezier(.2,.8,.2,1) both; }
.immersive-category-cover { align-items: end; clip-path: circle(0% at 50% 52%); cursor: pointer; opacity: 1; text-align: left; transform: scale(1.08); transition: clip-path .78s cubic-bezier(.2,.8,.2,1), transform .78s cubic-bezier(.2,.8,.2,1); }
.immersive-category-cover.is-after,
.immersive-category-cover.is-before { opacity: 1; transform: scale(1.08); }
.immersive-category-cover.is-active { clip-path: circle(150% at 50% 52%); transform: scale(1); }
.immersive-category-cover::before { background: var(--neon); border-radius: 50%; content: ''; height: 10px; left: 50%; position: absolute; top: 52%; transform: translate(-50%, -50%); transition: opacity .12s ease; width: 10px; z-index: 2; }
.immersive-category-cover.is-active::before { opacity: 0; }
.immersive-category-cover.reveal-split-horizontal { clip-path: polygon(0 50%, 100% 50%, 100% 50%, 0 50%); transform: scale(1.025); }
.immersive-category-cover.reveal-split-horizontal.is-active { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transform: scale(1); }
.immersive-category-cover.reveal-split-horizontal::before { border-radius: 0; height: 2px; width: 38px; }
.immersive-category-cover.reveal-split-vertical { clip-path: polygon(50% 0, 50% 0, 50% 100%, 50% 100%); transform: scale(1.025); }
.immersive-category-cover.reveal-split-vertical.is-active { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transform: scale(1); }
.immersive-category-cover.reveal-split-vertical::before { border-radius: 0; height: 38px; width: 2px; }
.immersive-category-cover.reveal-corner-iris { clip-path: circle(0 at 0 0); transform: scale(1.1); }
.immersive-category-cover.reveal-corner-iris.is-active { clip-path: circle(155% at 0 0); transform: scale(1); }
.immersive-category-cover.reveal-corner-iris::before { left: 0; top: 0; }
.immersive-category-cover.reveal-curtain-left { clip-path: inset(0 100% 0 0); transform: translateX(-3%) scale(1.04); }
.immersive-category-cover.reveal-curtain-left.is-active { clip-path: inset(0); transform: translateX(0) scale(1); }
.immersive-category-cover.reveal-curtain-left::before { border-radius: 0; height: 100%; left: 0; top: 0; transform: none; width: 4px; }
.immersive-category-cover.reveal-curtain-right { clip-path: inset(0 0 0 100%); transform: translateX(3%) scale(1.04); }
.immersive-category-cover.reveal-curtain-right.is-active { clip-path: inset(0); transform: translateX(0) scale(1); }
.immersive-category-cover.reveal-curtain-right::before { border-radius: 0; height: 100%; left: auto; right: 0; top: 0; transform: none; width: 4px; }
.immersive-category-cover.reveal-diagonal-wipe { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transform: scale(1.08); }
.immersive-category-cover.reveal-diagonal-wipe.is-active { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transform: scale(1); }
.immersive-category-cover.reveal-diagonal-wipe::before { left: 0; top: 0; }
.immersive-category-cover.reveal-shutter { clip-path: polygon(0 8%, 100% 8%, 100% 8%, 0 8%, 0 27%, 100% 27%, 100% 27%, 0 27%, 0 46%, 100% 46%, 100% 46%, 0 46%, 0 65%, 100% 65%, 100% 65%, 0 65%, 0 84%, 100% 84%, 100% 84%, 0 84%); transform: scale(1.03); }
.immersive-category-cover.reveal-shutter.is-active { animation: immersive-shutter-open .86s cubic-bezier(.18,.8,.2,1) both; transform: scale(1); }
.immersive-category-cover.reveal-shutter::before { border-radius: 0; height: 2px; width: 72px; }
.immersive-category-cover.reveal-lens-zoom { clip-path: circle(22% at 50% 52%); filter: blur(16px); opacity: 0; transform: scale(.62); }
.immersive-category-cover.reveal-lens-zoom.is-active { clip-path: circle(150% at 50% 52%); filter: blur(0); opacity: 1; transform: scale(1); }
.immersive-category-cover.reveal-lens-zoom::before { box-shadow: 0 0 0 12px rgba(210,255,36,.2), 0 0 0 28px rgba(210,255,36,.08); }
.immersive-category-cover.reveal-mosaic-grid { clip-path: inset(45% 45%); transform: scale(1.08); }
.immersive-category-cover.reveal-mosaic-grid.is-active { animation: immersive-mosaic-open .82s cubic-bezier(.2,.8,.2,1) both; transform: scale(1); }
.immersive-category-cover.reveal-mosaic-grid::before { box-shadow: -33vw -33vh 0 rgba(210,255,36,.92), 33vw -33vh 0 rgba(210,255,36,.92), -33vw 33vh 0 rgba(210,255,36,.92), 33vw 33vh 0 rgba(210,255,36,.92); }
.immersive-category-cover[class*="reveal-gsap-"] { clip-path: inset(0); transform: none; transition: none; }
.immersive-category-cover[class*="reveal-gsap-"].is-before,
.immersive-category-cover[class*="reveal-gsap-"].is-after { opacity: 0; }
.immersive-category-cover[class*="reveal-gsap-"]::before { display: none; }
#immersive-stage.is-gsap-ready .immersive-hero.is-active .hero-copy h1,
#immersive-stage.is-gsap-ready .immersive-hero.is-active .hero-copy p { animation: none; }
#immersive-stage.is-gsap-ready .immersive-category-cover.is-active .immersive-category-copy > span,
#immersive-stage.is-gsap-ready .immersive-category-cover.is-active .immersive-category-copy h2,
#immersive-stage.is-gsap-ready .immersive-category-cover.is-active .immersive-category-copy p,
#immersive-stage.is-gsap-ready .immersive-category-cover.is-active .immersive-category-copy small { animation: none; }
#immersive-stage.is-gsap-transition .immersive-slide { transition: none; }
#immersive-stage.is-gsap-transition .immersive-category-cover.is-active .immersive-category-copy > span,
#immersive-stage.is-gsap-transition .immersive-category-cover.is-active .immersive-category-copy h2,
#immersive-stage.is-gsap-transition .immersive-category-cover.is-active .immersive-category-copy p,
#immersive-stage.is-gsap-transition .immersive-category-cover.is-active .immersive-category-copy small { animation: none; }
.immersive-category-copy { left:var(--category-desktop-title-x,7%);max-width:760px;padding:0;position:absolute;text-shadow:0 2px 2px rgba(0,0,0,.72),0 10px 28px rgba(0,0,0,.56),0 22px 44px rgba(0,0,0,.22);top:var(--category-desktop-title-y,78%);transform:translateY(-50%);z-index:1; }
.immersive-category-copy > span,
.immersive-category-copy p,
.immersive-category-copy small { font: 11px var(--mono); letter-spacing: .09em; margin: 0; text-transform: uppercase; }
.immersive-category-copy h2 { font-family: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', STSong, SimSun, serif; font-size: clamp(74px, 11vw, 190px); font-weight: 500; letter-spacing: .035em; line-height: .9; margin: 16px 0 14px; }
.immersive-category-copy p { font-size: clamp(15px, 1.45vw, 23px); font-weight: 500; letter-spacing: .12em; line-height: 1.2; }
.immersive-category-copy small { border-bottom: 1px solid rgba(255,255,255,.7); display: inline-block; margin-top: 34px; padding-bottom: 7px; }
.immersive-category-cover.title-modern-grotesk .immersive-category-copy h2 { font-family: 'Helvetica Neue', 'Arial Narrow', 'PingFang SC', 'Microsoft YaHei', sans-serif; font-size: clamp(66px, 10vw, 166px); font-weight: 700; letter-spacing: 0; line-height: .86; }
.immersive-category-cover.title-modern-grotesk .immersive-category-copy p { font-family: 'Helvetica Neue', Arial, sans-serif; font-size: clamp(18px, 1.8vw, 28px); font-weight: 700; letter-spacing: .16em; }
.immersive-category-cover.title-italic-editorial .immersive-category-copy h2 { font-family: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', serif; font-size: clamp(70px, 10.5vw, 178px); font-weight: 500; letter-spacing: .06em; }
.immersive-category-cover.title-italic-editorial .immersive-category-copy p { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(23px, 2.2vw, 34px); font-style: italic; font-weight: 400; letter-spacing: .06em; text-transform: none; }
.immersive-category-cover.title-mono-poster .immersive-category-copy h2 { font-family: var(--mono); font-size: clamp(54px, 8.3vw, 134px); font-weight: 500; letter-spacing: 0; line-height: .94; }
.immersive-category-cover.title-mono-poster .immersive-category-copy p { font-family: var(--mono); font-size: clamp(18px, 1.8vw, 28px); font-weight: 500; letter-spacing: .06em; }
.immersive-category-cover.title-outline-display .immersive-category-copy h2 { color: transparent; font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-size: clamp(74px, 11.5vw, 194px); font-weight: 700; letter-spacing: 0; -webkit-text-stroke: 1.25px rgba(255, 255, 255, .95); text-shadow: 0 4px 20px rgba(0, 0, 0, .66); }
.immersive-category-cover.title-outline-display .immersive-category-copy p { font-size: clamp(18px, 1.75vw, 27px); font-weight: 600; letter-spacing: .16em; }
.immersive-category-cover.title-compact-label .immersive-category-copy h2 { font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-size: clamp(46px, 6.8vw, 110px); font-weight: 700; letter-spacing: .02em; line-height: 1; margin-bottom: 6px; }
.immersive-category-cover.title-compact-label .immersive-category-copy p { border-left: 2px solid var(--neon); font-size: clamp(20px, 2vw, 31px); font-weight: 500; letter-spacing: .08em; padding-left: 12px; }
.immersive-category-cover.title-cn-songti-light .immersive-category-copy h2 { font-family: 'Songti SC', STSong, SimSun, serif; font-weight: 400; letter-spacing: .1em; }
.immersive-category-cover.title-cn-modern-grotesk .immersive-category-copy h2 { font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-weight: 700; letter-spacing: 0; }
.immersive-category-cover.title-cn-mono-poster .immersive-category-copy h2 { font-family: var(--mono); font-size: clamp(58px, 8.7vw, 142px); letter-spacing: 0; }
.immersive-category-cover.title-cn-outline-display .immersive-category-copy h2 { color: transparent; font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-weight: 700; letter-spacing: 0; -webkit-text-stroke: 1.25px #fff; }
.immersive-category-cover.title-cn-compact-label .immersive-category-copy h2 { font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-size: clamp(50px, 7.2vw, 118px); font-weight: 700; letter-spacing: .03em; }
.immersive-category-cover.title-cn-black-poster .immersive-category-copy h2 { font-family: Impact, 'Arial Black', 'PingFang SC', sans-serif; font-size: clamp(78px, 12vw, 204px); font-weight: 900; letter-spacing: 0; }
.immersive-category-cover.title-cn-classic-title .immersive-category-copy h2 { font-family: 'Noto Serif SC', 'Source Han Serif SC', serif; font-weight: 600; letter-spacing: .16em; }
.immersive-category-cover.title-en-extended-sans .immersive-category-copy p { font-family: 'Helvetica Neue', Arial, sans-serif; font-size: clamp(18px, 1.8vw, 29px); font-weight: 700; letter-spacing: .22em; }
.immersive-category-cover.title-en-italic-editorial .immersive-category-copy p { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(23px, 2.2vw, 35px); font-style: italic; font-weight: 400; letter-spacing: .06em; text-transform: none; }
.immersive-category-cover.title-en-mono-signal .immersive-category-copy p { font-family: var(--mono); font-size: clamp(18px, 1.8vw, 28px); font-weight: 500; letter-spacing: .06em; }
.immersive-category-cover.title-en-condensed-bold .immersive-category-copy p { font-family: 'Arial Narrow', 'Helvetica Neue', sans-serif; font-size: clamp(22px, 2.25vw, 36px); font-stretch: condensed; font-weight: 800; letter-spacing: .05em; }
.immersive-category-cover.title-en-spaced-serif .immersive-category-copy p { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(19px, 1.9vw, 30px); font-weight: 600; letter-spacing: .18em; }
.immersive-category-cover.title-en-outline-caps .immersive-category-copy p { color: transparent; font-family: 'Helvetica Neue', Arial, sans-serif; font-size: clamp(19px, 1.9vw, 30px); font-weight: 700; letter-spacing: .13em; -webkit-text-stroke: .7px #fff; }
.immersive-category-cover.title-en-lowercase-editorial .immersive-category-copy p { font-family: Georgia, 'Times New Roman', serif; font-size: clamp(23px, 2.2vw, 35px); font-style: italic; font-weight: 400; letter-spacing: .04em; text-transform: lowercase; }

/* Immersive category covers always lead with the English discipline name. */
.immersive-category-cover .immersive-category-copy h2 {
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: clamp(78px, 12vw, 204px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: .92;
  text-transform: uppercase;
}
.immersive-category-cover .immersive-category-copy p {
  font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
  font-size: clamp(16px, 1.5vw, 22px);
  font-weight: 500;
  letter-spacing: .14em;
  line-height: 1.25;
  text-transform: none;
}
#immersive-stage .immersive-category-cover .immersive-category-copy h2 {
  color: #fff !important;
  font-family: 'Oswald', 'Arial Narrow', sans-serif !important;
  font-style: normal !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  -webkit-text-stroke: 0 !important;
}
.immersive-chaos-word { display: inline-block; white-space: nowrap; }
.immersive-chaos-char {
  display: inline-block;
  transform-origin: 50% 68%;
  will-change: filter, opacity, transform;
}

.inspector-preview { overflow: hidden; position: relative; }
.category-title-preview { bottom: 0; color: #fff; left: 0; padding: 18px; pointer-events: none; position: absolute; right: 0; text-shadow: 0 2px 2px rgba(0, 0, 0, .72), 0 8px 18px rgba(0, 0, 0, .56); }
.category-title-preview h3 { font-family: 'Source Han Serif SC', 'Noto Serif SC', 'Songti SC', STSong, SimSun, serif; font-size: clamp(32px, 3.2vw, 54px); font-weight: 500; letter-spacing: .035em; line-height: .9; margin: 0 0 8px; }
.category-title-preview p { font: 500 13px/1.2 var(--mono); letter-spacing: .12em; margin: 0; text-transform: uppercase; }
.category-title-preview.title-modern-grotesk h3 { font-family: 'Helvetica Neue', 'Arial Narrow', 'PingFang SC', sans-serif; font-weight: 700; letter-spacing: 0; }
.category-title-preview.title-modern-grotesk p { font-family: 'Helvetica Neue', Arial, sans-serif; font-size: 15px; font-weight: 700; letter-spacing: .14em; }
.category-title-preview.title-italic-editorial p { font-family: Georgia, 'Times New Roman', serif; font-size: 18px; font-style: italic; font-weight: 400; letter-spacing: .05em; text-transform: none; }
.category-title-preview.title-mono-poster h3 { font-family: var(--mono); font-size: 30px; font-weight: 500; letter-spacing: 0; }
.category-title-preview.title-mono-poster p { font-size: 15px; letter-spacing: .05em; }
.category-title-preview.title-outline-display h3 { color: transparent; font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-weight: 700; letter-spacing: 0; -webkit-text-stroke: 1px #fff; }
.category-title-preview.title-outline-display p { font-size: 15px; font-weight: 600; letter-spacing: .14em; }
.category-title-preview.title-compact-label h3 { font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-size: 29px; font-weight: 700; letter-spacing: .02em; margin-bottom: 4px; }
.category-title-preview.title-compact-label p { border-left: 2px solid var(--neon); font-size: 16px; padding-left: 8px; }
.category-title-preview.title-cn-songti-light h3 { font-family: 'Songti SC', STSong, SimSun, serif; font-weight: 400; letter-spacing: .1em; }
.category-title-preview.title-cn-modern-grotesk h3 { font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-weight: 700; letter-spacing: 0; }
.category-title-preview.title-cn-mono-poster h3 { font-family: var(--mono); letter-spacing: 0; }
.category-title-preview.title-cn-outline-display h3 { color: transparent; font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-weight: 700; letter-spacing: 0; -webkit-text-stroke: 1px #fff; }
.category-title-preview.title-cn-compact-label h3 { font-family: 'Helvetica Neue', 'PingFang SC', sans-serif; font-weight: 700; }
.category-title-preview.title-cn-black-poster h3 { font-family: Impact, 'Arial Black', 'PingFang SC', sans-serif; font-size: 43px; font-weight: 900; letter-spacing: 0; }
.category-title-preview.title-cn-classic-title h3 { font-family: 'Noto Serif SC', 'Source Han Serif SC', serif; font-weight: 600; letter-spacing: .13em; }
.category-title-preview.title-en-extended-sans p { font-family: 'Helvetica Neue', Arial, sans-serif; font-size: 16px; font-weight: 700; letter-spacing: .2em; }
.category-title-preview.title-en-italic-editorial p { font-family: Georgia, serif; font-size: 19px; font-style: italic; letter-spacing: .05em; text-transform: none; }
.category-title-preview.title-en-mono-signal p { font-family: var(--mono); font-size: 15px; letter-spacing: .05em; }
.category-title-preview.title-en-condensed-bold p { font-family: 'Arial Narrow', Arial, sans-serif; font-size: 18px; font-weight: 800; letter-spacing: .04em; }
.category-title-preview.title-en-spaced-serif p { font-family: Georgia, serif; font-size: 16px; font-weight: 600; letter-spacing: .16em; }
.category-title-preview.title-en-outline-caps p { color: transparent; font-family: 'Helvetica Neue', Arial, sans-serif; font-size: 16px; font-weight: 700; letter-spacing: .12em; -webkit-text-stroke: .6px #fff; }
.category-title-preview.title-en-lowercase-editorial p { font-family: Georgia, serif; font-size: 19px; font-style: italic; letter-spacing: .04em; text-transform: lowercase; }
.category-title-preview p { color: inherit; font-family: 'Oswald', 'Arial Narrow', sans-serif; font-size: 15px; font-style: normal; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; -webkit-text-stroke: 0; }
.category-reveal-preview .category-title-preview { padding: clamp(14px, 2vw, 22px); }
.category-reveal-preview .category-title-preview h3 { color: #fff; font-family: 'Oswald', 'Arial Narrow', sans-serif; font-size: clamp(34px, 4.2vw, 62px); font-style: normal; font-weight: 700; letter-spacing: 0; line-height: .86; margin: 0 0 10px; text-transform: uppercase; -webkit-text-stroke: 0; }
.category-reveal-preview .category-title-preview p { color: #fff; font-family: 'Noto Sans SC', 'PingFang SC', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: 0; line-height: 1.2; margin: 0; text-transform: none; }

.project-entry-transition { background: #111 var(--entry-image) center / cover no-repeat; inset: 0; opacity: 0; pointer-events: none; position: fixed; transform: scale(1); z-index: 100; }
.project-entry-transition::after { background: rgba(10, 12, 15, .3); content: ''; inset: 0; position: absolute; }
.project-entry-transition.is-active { animation: entry-fade-through .62s ease both; }
.project-entry-transition.effect-center-iris { clip-path: circle(0 at 50% 50%); opacity: 1; }
.project-entry-transition.effect-center-iris.is-active { animation: entry-iris .62s ease both; }
.project-entry-transition.effect-horizon-split.is-active { animation: entry-horizon .62s cubic-bezier(.2,.8,.2,1) both; }
.project-entry-transition.effect-vertical-gate.is-active { animation: entry-gate .62s cubic-bezier(.2,.8,.2,1) both; }
.project-entry-transition.effect-diagonal-cut.is-active { animation: entry-diagonal .62s ease both; }
.project-entry-transition.effect-lens-flash.is-active { animation: entry-flash .62s ease both; }
.project-entry-transition.effect-zoom-tunnel.is-active { animation: entry-zoom .62s cubic-bezier(.2,.7,.2,1) both; }
.project-entry-transition.effect-shutter-close.is-active { animation: entry-shutter .62s ease both; }
.project-entry-transition.effect-film-burn.is-active { animation: entry-burn .62s ease both; }
.project-entry-transition.effect-paper-tear.is-active { animation: entry-tear .62s ease both; }
.project-entry-transition.effect-mosaic-collapse.is-active { animation: entry-mosaic .62s ease both; }
.project-entry-transition.effect-line-scan.is-active { animation: entry-scan .62s linear both; }
.project-entry-transition.effect-curtain-fold.is-active { animation: entry-curtain .62s ease both; }
.project-entry-transition.effect-prism-shift.is-active { animation: entry-prism .62s ease both; }
.project-entry-transition.effect-ripple-ring.is-active { animation: entry-ripple .62s ease both; }
.project-entry-transition.effect-page-turn.is-active { animation: entry-page .62s ease both; transform-origin: left center; }
.project-entry-transition.effect-radial-blur.is-active { animation: entry-radial .62s ease both; }
.project-entry-transition.effect-grain-dissolve.is-active { animation: entry-grain .62s steps(6) both; }
.project-entry-transition.effect-blackout-pulse.is-active { animation: entry-blackout .62s ease both; }
.project-entry-transition.effect-cross-slide.is-active { animation: entry-cross .62s ease both; }
.project-entry-transition.is-revealing { animation-duration: .68s; animation-fill-mode: both; animation-name: entry-fade-through; }
.project-entry-transition.effect-center-iris.is-revealing { animation-name: entry-iris-out; }
.project-entry-transition.effect-horizon-split.is-revealing { animation-name: entry-horizon-out; }
.project-entry-transition.effect-vertical-gate.is-revealing { animation-name: entry-gate-out; }
.project-entry-transition.effect-diagonal-cut.is-revealing { animation-name: entry-diagonal-out; }
.project-entry-transition.effect-lens-flash.is-revealing { animation-name: entry-flash-out; }
.project-entry-transition.effect-zoom-tunnel.is-revealing { animation-name: entry-zoom-out; }
.project-entry-transition.effect-shutter-close.is-revealing { animation-name: entry-shutter-out; }
.project-entry-transition.effect-paper-tear.is-revealing { animation-name: entry-tear-out; }
.project-entry-transition.effect-mosaic-collapse.is-revealing { animation-name: entry-mosaic-out; }
.project-entry-transition.effect-curtain-fold.is-revealing { animation-name: entry-curtain-out; }
.project-entry-transition.effect-ripple-ring.is-revealing { animation-name: entry-ripple-out; }
.project-entry-transition.effect-page-turn.is-revealing { animation-name: entry-page-out; }
.project-entry-transition.effect-radial-blur.is-revealing { animation-name: entry-radial-out; }
.project-entry-transition.effect-cross-slide.is-revealing { animation-name: entry-cross-out; }
@keyframes entry-fade-through { from { opacity: 1; } to { opacity: 0; } }
@keyframes entry-iris { from { clip-path: circle(0 at 50% 50%); } to { clip-path: circle(150% at 50% 50%); } }
@keyframes entry-horizon { from { clip-path: inset(50% 0); opacity: 1; } to { clip-path: inset(0); opacity: 0; } }
@keyframes entry-gate { from { clip-path: inset(0 50%); opacity: 1; } to { clip-path: inset(0); opacity: 0; } }
@keyframes entry-diagonal { from { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); opacity: 1; } to { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); opacity: 0; } }
@keyframes entry-flash { 0% { filter: brightness(1); opacity: 1; } 38% { filter: brightness(3.4); opacity: 1; } 100% { filter: brightness(1); opacity: 0; } }
@keyframes entry-zoom { from { filter: blur(0); opacity: 1; transform: scale(1); } to { filter: blur(18px); opacity: 0; transform: scale(1.35); } }
@keyframes entry-shutter { from { clip-path: inset(0); opacity: 1; } 55% { clip-path: inset(44% 0); opacity: 1; } to { clip-path: inset(50% 0); opacity: 0; } }
@keyframes entry-burn { from { filter: sepia(0) saturate(1); opacity: 1; } 45% { filter: sepia(.7) saturate(3) brightness(1.7); opacity: 1; } to { filter: sepia(1) saturate(4); opacity: 0; } }
@keyframes entry-tear { from { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); opacity: 1; } to { clip-path: polygon(0 0, 100% 12%, 100% 100%, 0 88%); opacity: 0; } }
@keyframes entry-mosaic { from { clip-path: inset(0); opacity: 1; } 50% { clip-path: inset(23% 0); opacity: 1; } to { clip-path: inset(48% 45%); opacity: 0; } }
@keyframes entry-scan { from { filter: contrast(1.2); opacity: 1; transform: translateY(0); } to { filter: contrast(2); opacity: 0; transform: translateY(-8%); } }
@keyframes entry-curtain { from { clip-path: inset(0); opacity: 1; transform: scaleX(1); } to { clip-path: inset(0 50%); opacity: 0; transform: scaleX(.05); } }
@keyframes entry-prism { from { filter: hue-rotate(0); opacity: 1; transform: translateX(0); } to { filter: hue-rotate(55deg); opacity: 0; transform: translateX(4%); } }
@keyframes entry-ripple { from { clip-path: circle(150%); opacity: 1; } to { clip-path: circle(0); opacity: 0; } }
@keyframes entry-page { from { opacity: 1; transform: perspective(1000px) rotateY(0); } to { opacity: 0; transform: perspective(1000px) rotateY(-84deg); } }
@keyframes entry-radial { from { filter: blur(0); opacity: 1; transform: scale(1); } to { filter: blur(24px); opacity: 0; transform: scale(.74); } }
@keyframes entry-grain { from { filter: contrast(1.3) saturate(.75); opacity: 1; } to { filter: contrast(2) saturate(0); opacity: 0; } }
@keyframes entry-blackout { 0% { background-color: transparent; opacity: 1; } 45% { background-color: #000; opacity: 1; } 100% { background-color: #000; opacity: 0; } }
@keyframes entry-cross { from { opacity: 1; transform: translateX(0) scale(1); } to { opacity: 0; transform: translateX(-18%) scale(1.06); } }
@keyframes entry-iris-out { from { clip-path: circle(150% at 50% 50%); opacity: 1; } to { clip-path: circle(0 at 50% 50%); opacity: 0; } }
@keyframes entry-horizon-out { from { clip-path: inset(0); opacity: 1; } to { clip-path: inset(50% 0); opacity: 0; } }
@keyframes entry-gate-out { from { clip-path: inset(0); opacity: 1; } to { clip-path: inset(0 50%); opacity: 0; } }
@keyframes entry-diagonal-out { from { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); opacity: 1; } to { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); opacity: 0; } }
@keyframes entry-flash-out { from { filter: brightness(1.8); opacity: 1; } to { filter: brightness(1); opacity: 0; } }
@keyframes entry-zoom-out { from { filter: blur(0); opacity: 1; transform: scale(1); } to { filter: blur(12px); opacity: 0; transform: scale(1.16); } }
@keyframes entry-shutter-out { from { clip-path: inset(0); opacity: 1; } to { clip-path: inset(46% 0); opacity: 0; } }
@keyframes entry-tear-out { from { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); opacity: 1; } to { clip-path: polygon(0 0, 100% 10%, 100% 100%, 0 90%); opacity: 0; } }
@keyframes entry-mosaic-out { from { clip-path: inset(0); opacity: 1; } to { clip-path: inset(36% 36%); opacity: 0; } }
@keyframes entry-curtain-out { from { clip-path: inset(0); opacity: 1; transform: scaleX(1); } to { clip-path: inset(0 50%); opacity: 0; transform: scaleX(.1); } }
@keyframes entry-ripple-out { from { clip-path: circle(150%); opacity: 1; } to { clip-path: circle(0); opacity: 0; } }
@keyframes entry-page-out { from { opacity: 1; transform: perspective(1000px) rotateY(0); } to { opacity: 0; transform: perspective(1000px) rotateY(-70deg); } }
@keyframes entry-radial-out { from { filter: blur(0); opacity: 1; transform: scale(1); } to { filter: blur(18px); opacity: 0; transform: scale(.86); } }
@keyframes entry-cross-out { from { opacity: 1; transform: translateX(0) scale(1); } to { opacity: 0; transform: translateX(-14%) scale(1.04); } }
.project-entry-target .category-switcher { animation: archive-chrome-in .45s .14s both; }
.project-entry-target .album-card { animation: archive-card-in .62s cubic-bezier(.2,.8,.2,1) both; }
.project-entry-target .album-card:nth-child(2) { animation-delay: .06s; }
.project-entry-target .album-card:nth-child(3) { animation-delay: .12s; }
.project-entry-target .album-card:nth-child(4) { animation-delay: .18s; }
.project-entry-target .album-card:nth-child(5) { animation-delay: .24s; }
@keyframes archive-chrome-in { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes archive-card-in { from { opacity: 0; transform: translateY(22px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
.immersive-category-cover.is-active .immersive-category-copy > span { animation: immersive-copy-in .48s .28s cubic-bezier(.2,.8,.2,1) both; }
.immersive-category-cover.is-active .immersive-category-copy h2 { animation: immersive-title-in .72s .36s cubic-bezier(.2,.8,.2,1) both; }
.immersive-category-cover.is-active .immersive-category-copy p,
.immersive-category-cover.is-active .immersive-category-copy small { animation: immersive-copy-in .55s .52s cubic-bezier(.2,.8,.2,1) both; }
.immersive-category-cover.reveal-split-horizontal.is-active .immersive-category-copy h2 { animation-name: immersive-title-horizontal; }
.immersive-category-cover.reveal-split-vertical.is-active .immersive-category-copy h2 { animation-name: immersive-title-vertical; }
.immersive-category-cover.reveal-corner-iris.is-active .immersive-category-copy { animation: immersive-corner-copy .7s .3s cubic-bezier(.2,.8,.2,1) both; }
.immersive-category-cover.reveal-curtain-left.is-active .immersive-category-copy h2 { animation-name: immersive-title-left; }
.immersive-category-cover.reveal-curtain-right.is-active .immersive-category-copy h2 { animation-name: immersive-title-right; }
.immersive-category-cover.reveal-diagonal-wipe.is-active .immersive-category-copy { animation: immersive-diagonal-copy .72s .28s cubic-bezier(.2,.8,.2,1) both; }
.immersive-category-cover.reveal-shutter.is-active .immersive-category-copy h2 { animation-name: immersive-shutter-title; }
.immersive-category-cover.reveal-lens-zoom.is-active .immersive-category-copy { animation: immersive-lens-copy .72s .28s cubic-bezier(.2,.8,.2,1) both; }
.immersive-category-cover.reveal-mosaic-grid.is-active .immersive-category-copy h2 { animation-name: immersive-mosaic-title; }
.immersive-progress {
  background: rgba(255,255,255,.18);
  bottom: clamp(28px, 4vw, 46px);
  height: 1px;
  left: clamp(40px, 5vw, 78px);
  pointer-events: none;
  position: absolute;
  right: clamp(40px, 5vw, 78px);
  z-index: 6;
}
.immersive-progress i {
  background: #d5ff24;
  display: block;
  height: 100%;
  transform: scaleX(max(.08, var(--immersive-progress)));
  transform-origin: left center;
}
.immersive-progress::after {
  color: rgba(255,255,255,.72);
  content: var(--immersive-label, '01');
  font: 10px var(--mono);
  letter-spacing: .09em;
  position: absolute;
  right: 0;
  top: -22px;
}
.immersive-swipe-hint { bottom: 28px; font: 10px var(--mono); left: 50%; letter-spacing: .09em; margin: 0; position: absolute; text-transform: uppercase; transform: translateX(-50%); white-space: nowrap; z-index: 6; }
.immersive-arrow-hint { align-items: center; display: flex; height: 28px; justify-content: center; width: 28px; }
.immersive-arrow-hint i { animation: immersive-arrow-drift 1.8s cubic-bezier(.45,0,.55,1) infinite; border-bottom: 1px solid rgba(255,255,255,.92); border-right: 1px solid rgba(255,255,255,.92); display: block; height: 9px; transform: rotate(45deg) translate(-2px, -2px); width: 9px; }
@keyframes immersive-arrow-drift { 0%, 100% { opacity: .42; transform: rotate(45deg) translate(-4px, -4px); } 50% { opacity: 1; transform: rotate(45deg) translate(1px, 1px); } }

/* The hero copy remains a white image overlay in both themes.  Day mode only
   changes the surrounding canvas and secondary interface treatment. */
:root[data-theme='light'] .home-hero.is-scroll-cinema {
  --cinema-surface: var(--ink);
  --cinema-overlay:
    radial-gradient(circle at 50% 58%, transparent 0 34%, rgba(0,0,0,.08) 54%, rgba(0,0,0,.46) 100%),
    linear-gradient(180deg, transparent 0 56%, rgba(0,0,0,.56));
}
:root[data-theme='light'] .home-hero.is-scroll-cinema + .category-showcase {
  background: var(--ink);
  color: var(--paper);
}
:root[data-theme='light'] .immersive-home { background: var(--ink); }
:root[data-theme='light'] .immersive-home::before {
  background:
    linear-gradient(90deg, rgba(18,19,21,.15) 0 1px, transparent 1px 18vw),
    linear-gradient(180deg, rgba(18,19,21,.1) 0 1px, transparent 1px 18vh);
  opacity: .22;
}
:root[data-theme='light'] .immersive-home::after {
  background: linear-gradient(180deg, transparent 0 44%, rgba(18,19,21,.18) 50%, transparent 56%);
}
:root[data-theme='light'] .immersive-slide::after {
  background:
    linear-gradient(180deg, rgba(0,0,0,.1), rgba(0,0,0,.04) 32%, rgba(0,0,0,.62)),
    linear-gradient(90deg, rgba(0,0,0,.32), transparent 28%, transparent 66%, rgba(0,0,0,.24));
}
:root[data-theme='light'] .immersive-slide .hero-media { background: var(--card); }
:root[data-theme='light'] .immersive-slide .hero-media img { filter: saturate(.98) contrast(1.03) brightness(1.02); }
:root[data-theme='light'] .immersive-progress { background: rgba(18,19,21,.28); }
:root[data-theme='light'] .immersive-progress::after { color: rgba(18,19,21,.78); }
:root[data-theme='light'] .immersive-swipe-hint {
  background: rgba(244,241,235,.8);
  color: #121315;
  padding: 4px 7px;
}
:root[data-theme='light'] .immersive-arrow-hint { background: transparent; padding: 0; }
:root[data-theme='light'] .immersive-category-copy > span,
:root[data-theme='light'] .immersive-category-copy p,
:root[data-theme='light'] .immersive-category-copy small {
  color: rgba(18,19,21,.88);
  text-shadow: 0 1px 14px rgba(244,241,235,.85);
}
:root[data-theme='light'] .immersive-category-copy small { border-bottom-color: rgba(18,19,21,.6); }
@keyframes immersive-title-in { from { filter: blur(9px); letter-spacing: .08em; opacity: 0; transform: translate3d(0, 38px, 0) scale(.97); } to { filter: blur(0); letter-spacing: 0; opacity: 1; transform: translate3d(0, 0, 0) scale(1); } }
@keyframes immersive-copy-in { from { opacity: 0; transform: translate3d(0, 18px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes immersive-scan { 0% { opacity: 0; transform: translateY(-58%); } 24% { opacity: .72; } 100% { opacity: 0; transform: translateY(58%); } }
@keyframes immersive-shutter-open { 0% { clip-path: polygon(0 8%, 100% 8%, 100% 8%, 0 8%, 0 27%, 100% 27%, 100% 27%, 0 27%, 0 46%, 100% 46%, 100% 46%, 0 46%, 0 65%, 100% 65%, 100% 65%, 0 65%, 0 84%, 100% 84%, 100% 84%, 0 84%); } 100% { clip-path: inset(0); } }
@keyframes immersive-mosaic-open { 0% { clip-path: inset(45%); } 48% { clip-path: inset(23% 0 23% 0); } 100% { clip-path: inset(0); } }
@keyframes immersive-title-horizontal { from { filter: blur(8px); letter-spacing: .08em; opacity: 0; transform: scaleX(.45); } to { filter: blur(0); letter-spacing: 0; opacity: 1; transform: scaleX(1); } }
@keyframes immersive-title-vertical { from { filter: blur(8px); opacity: 0; transform: scaleY(.3); } to { filter: blur(0); opacity: 1; transform: scaleY(1); } }
@keyframes immersive-corner-copy { from { opacity: 0; transform: translate3d(-34px, -34px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes immersive-title-left { from { filter: blur(8px); opacity: 0; transform: translateX(-80px); } to { filter: blur(0); opacity: 1; transform: translateX(0); } }
@keyframes immersive-title-right { from { filter: blur(8px); opacity: 0; transform: translateX(80px); } to { filter: blur(0); opacity: 1; transform: translateX(0); } }

@media (prefers-reduced-motion: reduce) {
  .immersive-slide,
  .immersive-category-cover,
  .immersive-category-cover.is-active,
  .immersive-category-cover.is-before,
  .immersive-category-cover.is-after { animation: none !important; transition: none !important; }
}
@keyframes immersive-diagonal-copy { from { opacity: 0; transform: translate3d(-28px, 28px, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes immersive-shutter-title { from { filter: blur(12px); opacity: 0; transform: translateY(24px); } 55% { opacity: .4; } to { filter: blur(0); opacity: 1; transform: translateY(0); } }
@keyframes immersive-lens-copy { from { filter: blur(14px); opacity: 0; transform: scale(.82); } to { filter: blur(0); opacity: 1; transform: scale(1); } }
@keyframes immersive-mosaic-title { from { filter: blur(10px); opacity: 0; transform: scale(.7) rotate(-1deg); } to { filter: blur(0); opacity: 1; transform: scale(1) rotate(0); } }

.home-domino-overview,
.home-photographer-contact {
  background: var(--paper);
  color: var(--ink);
  position: relative;
  transition: background-color .45s ease, color .45s ease;
}

.home-domino-overview {
  margin-top: -100svh;
  min-height: 100svh;
  z-index: 2;
}

.home-domino-overview.is-awaiting-handoff { visibility: hidden; }
.home-domino-overview.is-awaiting-handoff.is-handoff-active { visibility: visible; }

.home-domino-collapse {
  display: none;
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 6;
}

.home-domino-overview.is-domino-motion .home-domino-collapse { display: block; }

.domino-handoff-copy {
  bottom: clamp(112px, 15vw, 220px);
  color: #fff;
  display: none;
  left: clamp(40px, 5vw, 78px);
  max-width: 760px;
  position: absolute;
  right: clamp(40px, 5vw, 78px);
  text-shadow: 0 2px 2px rgba(0,0,0,.72), 0 10px 28px rgba(0,0,0,.56), 0 22px 44px rgba(0,0,0,.22);
  z-index: 7;
}

.home-domino-overview.is-domino-motion .domino-handoff-copy { display: block; }

.domino-handoff-copy::before {
  background: rgba(213,255,36,.88);
  content: '';
  height: 2px;
  left: 0;
  position: absolute;
  top: -22px;
  width: min(42vw, 340px);
}

.domino-handoff-copy > span,
.domino-handoff-copy p,
.domino-handoff-copy small {
  font: 11px var(--mono);
  letter-spacing: .09em;
  margin: 0;
  text-transform: uppercase;
}

.domino-handoff-copy h2 {
  color: #fff;
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: clamp(78px, 12vw, 204px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: .92;
  margin: 16px 0 14px;
  text-transform: uppercase;
}

.domino-handoff-copy p {
  font-family: 'PingFang SC', 'Microsoft YaHei', sans-serif;
  font-size: clamp(16px, 1.5vw, 22px);
  font-weight: 500;
  letter-spacing: .14em;
  line-height: 1.25;
  text-transform: none;
}

.domino-handoff-copy small {
  border-bottom: 1px solid rgba(255,255,255,.7);
  display: inline-block;
  margin-top: 34px;
  padding-bottom: 7px;
}

.domino-handoff-word,
.domino-handoff-char { display: inline-block; }
.domino-handoff-word { white-space: nowrap; }

.domino-collapse-card {
  background: #050607;
  inset: 0;
  overflow: hidden;
  position: absolute;
  transform-origin: 50% 50%;
  will-change: opacity, transform;
}

.domino-collapse-card img {
  display: block;
  height: 100%;
  object-fit: cover;
  opacity: 1;
  width: 100%;
}

.home-domino-stage {
  height: 100svh;
  min-height: 680px;
  overflow: hidden;
  padding: clamp(86px, 9vh, 118px) clamp(24px, 5vw, 78px) clamp(28px, 4vh, 48px);
  position: relative;
}

.home-domino-heading {
  align-items: end;
  display: grid;
  gap: 10px clamp(22px, 3vw, 46px);
  grid-template-columns: minmax(120px, 1.2fr) minmax(320px, 4fr) minmax(90px, .8fr);
  position: relative;
  z-index: 8;
}

.home-domino-heading span,
.home-domino-heading p,
.home-domino-complete {
  color: var(--muted);
  font: 500 10px/1.4 var(--mono);
  margin: 0;
  text-transform: uppercase;
}

.home-domino-heading h2 {
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: clamp(46px, 6.4vw, 106px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: .84;
  margin: 0;
}

.home-domino-heading p { justify-self: end; }

.home-domino-rule {
  background: var(--line);
  height: 1px;
  margin-top: clamp(20px, 3vh, 34px);
  position: relative;
  z-index: 8;
}

.home-domino-rule i { background: #b8ed18; display: block; height: 1px; width: 22%; }

.home-domino-grid {
  align-items: end;
  bottom: clamp(76px, 9vh, 112px);
  display: grid;
  gap: clamp(12px, 1.5vw, 24px);
  grid-template-columns: repeat(4, minmax(0, 1fr));
  left: clamp(24px, 5vw, 78px);
  position: absolute;
  right: clamp(24px, 5vw, 78px);
  z-index: 3;
}

.domino-category-card {
  color: var(--ink);
  display: grid;
  gap: 11px;
  min-width: 0;
  transform-origin: 50% 100%;
  will-change: filter, opacity, transform;
}

.domino-category-card:nth-child(2n) { margin-bottom: clamp(16px, 3.8vh, 42px); }

.domino-card-media {
  aspect-ratio: 4 / 5;
  background: var(--card);
  overflow: hidden;
  position: relative;
}

.domino-card-media::after {
  background: linear-gradient(180deg, transparent 55%, rgba(0,0,0,.5));
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.domino-card-media img {
  display: block;
  height: 100%;
  object-fit: cover;
  opacity: 1;
  width: 100%;
  will-change: filter, transform;
}

.domino-card-copy {
  align-items: start;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 12px;
  grid-template-columns: auto minmax(0, 1fr);
  padding-top: 9px;
}

.domino-card-copy > span,
.domino-card-copy small {
  color: var(--muted);
  font: 500 9px/1.35 var(--mono);
}

.domino-card-copy div { display: grid; gap: 4px; }
.domino-card-copy strong {
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: clamp(16px, 1.55vw, 25px);
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1;
  overflow-wrap: anywhere;
  text-transform: uppercase;
}
.domino-card-copy small { font-family: inherit; }
.domino-category-card:hover .domino-card-media img { transform: scale(1.035); }

.home-domino-complete {
  bottom: clamp(28px, 3.5vh, 44px);
  left: 50%;
  opacity: 0;
  position: absolute;
  transform: translate(-50%, 12px);
  white-space: nowrap;
  z-index: 8;
}

.home-photographer-contact {
  display: grid;
  gap: clamp(34px, 6vw, 96px);
  grid-template-columns: repeat(12, minmax(0, 1fr));
  min-height: 100svh;
  padding: clamp(106px, 13vh, 156px) clamp(24px, 7vw, 108px) clamp(64px, 9vh, 112px);
}

.home-photographer-portrait {
  align-self: stretch;
  background: var(--card);
  grid-column: 1 / span 5;
  min-height: 62svh;
  overflow: hidden;
}

.home-photographer-portrait > img,
.home-photographer-portrait .placeholder-image {
  display: block;
  height: 100%;
  object-fit: cover;
  opacity: 1;
  width: 100%;
}

.home-photographer-copy {
  align-content: end;
  display: grid;
  grid-column: 7 / -1;
}

.home-photographer-copy > span {
  color: var(--muted);
  font: 500 10px/1.4 var(--mono);
  margin-bottom: clamp(24px, 4vh, 42px);
}

.home-photographer-copy h2 {
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: clamp(76px, 11vw, 184px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: .84;
  margin: 0 0 clamp(28px, 4vh, 48px);
  text-transform: uppercase;
}

.photographer-title-word,
.photographer-title-char { display: inline-block; }
.photographer-title-word { white-space: nowrap; }

.home-photographer-copy > p {
  color: var(--muted);
  font-size: clamp(14px, 1.2vw, 18px);
  font-weight: 300;
  line-height: 1.9;
  margin: 0;
  max-width: 640px;
}

.home-photographer-links {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 16px;
  grid-template-columns: 1fr;
  margin-top: clamp(32px, 5vh, 58px);
  padding-top: 18px;
}

.home-photographer-links a,
.home-photographer-links p {
  color: var(--ink);
  display: grid;
  font-family: var(--contact);
  font-size: clamp(16px, 1.2vw, 20px);
  font-weight: 500;
  grid-template-columns: minmax(190px, 1.2fr) minmax(0, 1.4fr);
  letter-spacing: .065em;
  line-height: 1.35;
  margin: 0;
  overflow-wrap: anywhere;
}

.home-photographer-links small {
  color: var(--muted);
  display: block;
  font-family: var(--contact);
  font-size: inherit;
  font-weight: 400;
  letter-spacing: .08em;
  line-height: inherit;
  margin: 0;
  text-transform: none;
}

.home-photographer-more {
  border-bottom: 1px solid #b8ed18;
  font: 500 11px/1 var(--mono);
  justify-self: start;
  margin-top: clamp(34px, 5vh, 58px);
  padding-bottom: 7px;
}

@media (prefers-reduced-motion: reduce) {
  .home-domino-complete { opacity: 1; transform: translateX(-50%); }
}

.hero-topline {
  display: flex;
  font: 400 clamp(12px, 1.3vw, 19px)/1 var(--mono);
  justify-content: space-between;
  left: clamp(40px, 5vw, 78px);
  letter-spacing: .08em;
  position: absolute;
  right: clamp(40px, 5vw, 78px);
  text-transform: uppercase;
  top: clamp(104px, 10vw, 150px);
  z-index: 1;
}

:root[data-theme='dark'] .hero-media::after { background: linear-gradient(180deg, rgba(0, 0, 0, .04), rgba(0, 0, 0, .26) 55%, rgba(15, 17, 20, .92) 100%); }
:root[data-theme='dark'] .hero-copy h1,
:root[data-theme='dark'] .hero-statement,
:root[data-theme='dark'] .hero-topline { color: #f5f5f1; }

.category-showcase {
  display: grid;
}

.home-contact-cta {
  background: var(--paper);
  padding: clamp(48px, 7vw, 96px) clamp(24px, 5vw, 78px);
}

.home-contact-details {
  align-items: end;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 20px 34px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  margin-top: 0;
  padding-top: 18px;
}

.home-contact-details a,
.home-contact-details p { color: var(--ink); font-size: clamp(14px, 1.55vw, 20px); line-height: 1.45; margin: 0; overflow-wrap: anywhere; }
.home-contact-details small { color: var(--muted); display: block; font-size: 11px; margin-bottom: 9px; }
.site-copyright { color: var(--muted); display:inline-block; font:10px var(--mono); margin-top:34px; opacity:.72; text-decoration:none; }
.site-copyright:hover,.site-copyright:focus-visible { color:var(--ink); opacity:1; }
.home-contact-cta{position:relative}.site-settings-entry { align-items:center; background:transparent; border:1px solid var(--line); border-radius:50%; bottom:18px; color:var(--muted); display:flex; height:30px; justify-content:center; opacity:.55; position:absolute; right:18px; transition:opacity .18s ease,background-color .18s ease,transform .18s ease; width:30px; z-index:3; }.site-settings-entry svg{height:14px;width:14px}.site-settings-entry:hover,.site-settings-entry:focus-visible{background:var(--card);color:var(--ink);opacity:1;transform:scale(1.06)}

.image-cover-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  max-width: none;
}

.image-cover-tile { aspect-ratio: 4 / 3; min-height: 0; overflow: hidden; }
.image-cover-tile.is-fallback { opacity: .72; }
.image-cover-tile > button { background: transparent; border: 0; display: block; height: 100%; padding: 0; position: relative; width: 100%; }
.image-cover-tile > button > img { display: block; height: 100%; object-fit: cover; width: 100%; }
.image-cover-dropzone { min-height: 0; }
.image-cover-library { min-height: 0; }
.image-cover-library.is-category-cover { border: 1px solid var(--line); padding: 0; }
.image-cover-inspector { align-self: start; }
.photographer-preview { aspect-ratio: 4 / 5 !important; max-height: 58vh; position: relative; }
.photographer-preview img { height: 100%; object-fit: cover; width: 100%; }
.photographer-preview-fallback { background: rgba(15, 15, 14, .84); bottom: 8px; color: #fff; font-size: 9px; left: 8px; padding: 5px 7px; position: absolute; }
.category-cover-picker { border-top: 1px solid var(--line); margin-top: 18px; padding-top: 14px; }
.category-cover-picker header { align-items: center; color: var(--muted); display: flex; font-size: 11px; justify-content: space-between; margin-bottom: 10px; }
.category-cover-picker > div { display: grid; gap: 6px; grid-template-columns: repeat(3, minmax(0, 1fr)); max-height: 330px; overflow-y: auto; }
.cover-picker-item { background: var(--card); min-width: 0; position: relative; }
.cover-picker-item > button:first-child { background: transparent; border: 1px solid transparent; display: block; padding: 0; width: 100%; }
.cover-picker-item > button:first-child.is-selected { border-color: var(--ink); }
.cover-picker-item > button:last-child { background: rgba(20, 20, 18, .9); border: 0; color: #fff; height: 20px; position: absolute; right: 3px; top: 3px; width: 20px; }
.cover-picker-item img { aspect-ratio: 1; display: block; height: 100%; object-fit: cover; width: 100%; }
.cover-picker-item small { color: var(--muted); display: block; font-size: 8px; overflow: hidden; padding: 4px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.category-cover-picker p { color: var(--muted); font-size: 12px; grid-column: 1 / -1; line-height: 1.6; margin: 0; }
.home-effect-form { border-top: 1px solid var(--line); display: grid; gap: 8px; margin-top: 18px; padding-top: 15px; }
.home-effect-form > p { margin: 0 0 4px; }
.home-effect-form label { align-items: start; border: 1px solid var(--line); display: grid; gap: 9px; grid-template-columns: auto minmax(0, 1fr); padding: 10px; }
.home-effect-form input { accent-color: var(--ink); margin: 4px 0 0; }
.home-effect-form strong { display: block; font-size: 12px; font-weight: 600; }
.home-effect-form small { color: var(--muted); display: block; font-size: 10px; line-height: 1.5; margin-top: 3px; }
.category-reveal-form { border-top: 1px solid var(--line); display: grid; gap: 14px; margin-top: 18px; padding-top: 15px; }
.category-reveal-form header { align-items: baseline; display: flex; justify-content: space-between; }
.category-reveal-form header strong { font-size: 13px; font-weight: 600; }
.category-setting-group { display: grid; gap: 6px; }
.category-setting-group label { color: var(--muted); font: 10px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.category-setting-group select { appearance: auto; background: var(--soft); border: 1px solid var(--line); border-radius: 0; color: var(--ink); font: 12px var(--body); min-height: 36px; padding: 0 8px; width: 100%; }
.category-setting-group small { color: var(--muted); font-size: 10px; line-height: 1.45; }
.inspector-secondary-action { background: transparent; border: 1px solid var(--line); color: var(--ink); margin-top: 10px; min-height: 38px; width: 100%; }
.category-inspector-actions { display: grid; gap: 10px; margin-top: 22px; }
.category-inspector-actions .inspector-secondary-action { margin-top: 0; }

.category-project-summary { border-top: 1px solid var(--line); margin-top: 24px; padding-top: 18px; }
.category-project-summary header { align-items: center; display: flex; gap: 12px; justify-content: space-between; }
.category-project-summary header p { margin: 0; }
.category-project-summary header button,
.category-project-summary > button {
  background: transparent;
  border: 1px solid var(--line);
  color: var(--ink);
  font-size: 11px;
  min-height: 32px;
  padding: 0 10px;
}
.category-project-summary > div { display: grid; gap: 1px; margin: 12px 0; }
.category-project-summary > div > button { background: var(--card); border: 0; color: var(--ink); display: grid; gap: 3px; padding: 10px; text-align: left; }
.category-project-summary span { color: var(--muted); font-size: 10px; }
.category-project-summary strong { font-family: var(--heading); font-size: 16px; font-weight: 600; }

.category-inline-project-editor {
  border-top: 1px solid var(--ink);
  display: grid;
  gap: 20px;
  margin-top: 54px;
  max-width: 760px;
  padding-top: 18px;
}
.category-inline-project-editor > header,
.inline-project-assets > header { align-items: center; display: flex; justify-content: space-between; }
.category-inline-project-editor > header p { margin: 0; }
.category-inline-project-editor > header button,
.inline-project-assets > header button { background: transparent; border: 1px solid var(--line); color: var(--ink); font-size: 11px; min-height: 32px; padding: 0 10px; }
.inline-project-assets-actions { display: flex; gap: 7px; }
.category-inline-project-editor form { display: grid; gap: 14px; }
.active-category-form { display: grid; gap: 12px; margin-top: 18px; }
.active-category-form .field { margin: 0; }
.admin-action.has-unsaved-changes,
#category-canvas-save.has-unsaved-changes { box-shadow: inset 0 -3px 0 #b8ed18; }
.project-manager-toolbar { align-items: center; border-bottom: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 0; }
.project-manager-toolbar > label { flex: 1 1 220px; }
.project-manager-toolbar input { background: var(--paper); border: 1px solid var(--line); color: var(--ink); min-height: 36px; padding: 0 10px; width: 100%; }
.project-manager-toolbar button,
.project-filter-switch button,
.project-batch-toolbar button,
.project-batch-toolbar select { background: var(--paper); border: 1px solid var(--line); color: var(--ink); min-height: 34px; padding: 0 10px; }
.project-filter-switch { display: flex; }
.project-filter-switch button + button { border-left: 0; }
.project-filter-switch button.active { background: var(--ink); color: var(--paper); }
.project-batch-toolbar { align-items: center; background: var(--card); border-bottom: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 8px; padding: 10px; width: 100%; }
.project-batch-toolbar strong { font: 10px var(--mono); margin-right: auto; }
.project-batch-toolbar .is-danger { border-color: #a8534b; color: #a8534b; }
.project-admin-card-wrap { min-width: 0; position: relative; }
.project-admin-card-wrap.is-selected { outline: 2px solid #b8ed18; outline-offset: 2px; }
.project-admin-card-wrap .project-admin-card { height: 100%; width: 100%; }
.project-admin-check { align-items: center; background: var(--paper); border: 1px solid var(--line); display: flex; height: 26px; justify-content: center; left: 6px; position: absolute; top: 6px; width: 26px; z-index: 3; }
.project-admin-check input { accent-color: #799d08; margin: 0; }
.project-order-actions { bottom: 6px; display: flex; gap: 3px; position: absolute; right: 6px; z-index: 3; }
.project-order-actions button { background: rgba(20, 20, 18, .88); border: 0; color: #fff; height: 27px; min-width: 27px; padding: 0; }
.project-order-actions button:not(.project-sort-handle) { display: none; }
.project-sort-handle { cursor: grab; }
.collection-tab-item.is-sorting { opacity: .45; }
.inline-project-assets { border-top: 1px solid var(--line); padding-top: 16px; }
.inline-project-batch-toolbar { align-items: center; background: var(--card); border: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; padding: 8px; }
.inline-project-batch-toolbar span { font: 10px var(--mono); margin-right: auto; }
.inline-project-batch-toolbar button { background: var(--paper); border: 1px solid var(--line); color: var(--ink); font-size: 10px; min-height: 30px; padding: 0 9px; }
.inline-project-batch-toolbar button:first-of-type { border-color: #a8534b; color: #a8534b; }
.inline-project-dropzone { align-items: center; background: var(--card); border: 1px dashed var(--line); color: var(--ink); display: grid; gap: 3px; margin-top: 12px; min-height: 82px; padding: 10px; text-align: center; width: 100%; }
.inline-project-dropzone span { font-size: 20px; line-height: 1; }
.inline-project-dropzone strong { font-size: 12px; font-weight: 500; }
.inline-project-dropzone small { color: var(--muted); font-size: 9px; }
.inline-project-dropzone.is-drag-over { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.inline-upload-queue { border: 1px solid var(--line); margin-top: 10px; }
.inline-upload-queue > header { align-items: center; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; padding: 8px; }
.inline-upload-queue > header span { font: 10px var(--mono); }
.inline-upload-queue > header button { background: transparent; border: 0; color: var(--muted); font-size: 9px; }
.inline-upload-queue > article { align-items: center; display: flex; gap: 6px; padding: 8px; }
.inline-upload-queue > article + article { border-top: 1px solid var(--line); }
.inline-upload-queue > article > div { min-width: 0; flex: 1; }
.inline-upload-queue strong,
.inline-upload-queue small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inline-upload-queue strong { font-size: 10px; }
.inline-upload-queue small { color: var(--muted); font-size: 9px; margin-top: 2px; }
.inline-upload-queue article.is-uploading small { color: #799d08; }
.inline-upload-queue article.is-failed small { color: #a8534b; }
.inline-upload-queue article button { background: var(--paper); border: 1px solid var(--line); color: var(--ink); min-height: 26px; padding: 0 7px; }
#inline-project-asset-list { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 12px; }
.inline-project-assets article { aspect-ratio: 1; cursor: grab; overflow: hidden; position: relative; }
.inline-project-assets article.is-selected { outline: 2px solid #b8ed18; outline-offset: -2px; }
.inline-project-assets article.is-dragging { cursor: grabbing; opacity: .45; }
.inline-project-assets img { display: block; height: 100%; object-fit: cover; width: 100%; }
.inline-project-assets article button { background: var(--paper); border: 0; color: var(--ink); height: 22px; position: absolute; right: 4px; top: 4px; width: 22px; }
.inline-project-batch-check { align-items: center; background: var(--paper); border: 1px solid var(--line); cursor: pointer; display: flex; height: 24px; justify-content: center; left: 4px; position: absolute; top: 4px; width: 24px; z-index: 2; }
.inline-project-batch-check input { accent-color: #799d08; height: 14px; margin: 0; width: 14px; }
.inline-project-assets article i { background: rgba(20, 20, 18, .8); bottom: 4px; color: #fff; font-size: 12px; font-style: normal; height: 18px; line-height: 16px; position: absolute; right: 4px; text-align: center; width: 18px; }
.inline-project-assets p { color: var(--muted); font-size: 12px; margin: 0; }
.inline-project-delete { background: transparent; border: 1px solid #a8534b; color: #a8534b; font-size: 11px; justify-self: start; min-height: 34px; padding: 0 12px; }
.inline-project-delete:hover { background: #a8534b; color: #fff; }
.category-magazine-editor { border-top: 1px solid var(--line); display: grid; gap: 10px; margin-top: 18px; padding-top: 16px; }
.category-magazine-editor p { color: var(--muted); font-size: 12px; line-height: 1.6; margin: 0; }
.category-magazine-editor label { color: var(--ink); display: grid; font-size: 12px; gap: 6px; }
.category-magazine-editor select { background: var(--paper); border: 1px solid var(--line); color: var(--ink); min-height: 34px; padding: 0 8px; }
.canvas-editor-controls { align-items: center; display: flex; gap: 12px; justify-content: space-between; margin: 0 0 12px; }
.canvas-mode-switch { display: flex; gap: 8px; }
.canvas-mode-switch button { background: transparent; border: 1px solid var(--line); color: var(--muted); font-size: 11px; min-height: 32px; padding: 0 12px; }
.canvas-mode-switch button.active { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.canvas-editor-actions { align-items: center; display: flex; gap: 8px; }
#category-canvas-magazine { background: var(--paper); border: 1px solid var(--ink); color: var(--ink); font-size: 11px; min-height: 32px; padding: 0 12px; }
#category-canvas-magazine:hover { background: var(--ink); color: var(--paper); }
.canvas-zoom-controls { align-items: center; display: flex; gap: 6px; }
.canvas-zoom-controls button { background: var(--paper); border: 1px solid var(--line); color: var(--ink); font-size: 18px; height: 32px; line-height: 1; width: 32px; }
.canvas-zoom-controls output { color: var(--muted); font: 11px var(--mono); min-width: 42px; text-align: center; }
.category-project-canvas-viewport { border: 1px solid var(--line); max-height: 72svh; overflow: auto; overscroll-behavior: contain; padding-bottom: 18px; }
.category-project-canvas { background: var(--card); min-height: 1480px; overflow: hidden; position: relative; transform: scale(var(--category-canvas-scale, 1)); transform-origin: top left; width: calc(100% / var(--category-canvas-scale, 1)); }
.category-project-canvas.is-mobile-canvas { margin-left: auto; margin-right: auto; max-width: 440px; min-height: 1760px; }
.category-canvas-project { cursor: grab; left: var(--canvas-x); position: absolute; top: var(--canvas-y); touch-action: none; user-select: none; width: var(--canvas-w, 24%); }
.category-canvas-project.is-dragging { cursor: grabbing; opacity: .76; z-index: 2; }
.category-canvas-project img { display: block; height: auto; object-fit: contain; pointer-events: none; user-select: none; width: 100%; }
.category-canvas-project > i { background: var(--paper); border: 1px solid var(--ink); bottom: 22px; cursor: nwse-resize; height: 26px; position: absolute; right: 0; touch-action: none; width: 26px; z-index: 2; }
.category-canvas-project small { color: var(--muted); display: block; font-size: 10px; padding-top: 6px; }
.category-canvas-actions { display: flex; gap: 10px; margin-top: 16px; }
.category-canvas-actions button { background: var(--ink); border: 0; color: var(--paper); min-height: 38px; padding: 0 14px; }
.category-canvas-actions button + button { background: transparent; border: 1px solid var(--line); color: var(--ink); }

.project-layout-modal-open { overflow: hidden; }
.project-layout-modal { align-items: center; background: rgba(15, 15, 14, .58); display: flex; inset: 0; justify-content: center; padding: 28px; position: fixed; z-index: 50; }
.project-layout-modal-dialog { background: var(--paper); box-shadow: 0 22px 72px rgba(0, 0, 0, .25); max-height: min(880px, calc(100vh - 56px)); overflow: auto; padding: 24px; width: min(1040px, 100%); }
.project-layout-modal-header { align-items: start; border-bottom: 1px solid var(--line); display: flex; gap: 18px; justify-content: space-between; padding-bottom: 18px; }
.project-layout-modal-header p { margin: 0 0 5px; }
.project-layout-modal-header h2 { color: var(--ink); font-size: 24px; font-weight: 500; letter-spacing: 0; margin: 0; }
.project-layout-modal-header button { background: transparent; border: 1px solid var(--line); color: var(--ink); font-size: 11px; min-height: 32px; padding: 0 10px; }
.project-layout-modal .project-layout-editor { margin-top: 20px; padding-top: 0; }

@media (max-width: 700px) {
  .image-cover-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .image-cover-tile { aspect-ratio: 4 / 3; }
  #inline-project-asset-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-manager-toolbar { align-items: stretch; }
  .project-manager-toolbar > label { flex-basis: 100%; }
  .project-batch-toolbar { align-items: stretch; flex-direction: column; }
  .project-batch-toolbar strong { margin: 0; }
  .project-order-actions button:not(.project-sort-handle) { display: block; }
  .project-sort-handle { display: none; }
  .canvas-editor-controls { align-items: stretch; flex-direction: column; }
  .canvas-editor-actions { justify-content: space-between; width: 100%; }
  .category-project-canvas { min-height: 1320px; }
  .category-project-canvas.is-mobile-canvas { min-height: 1680px; }
  .category-canvas-project > i { bottom: 21px; }
  .project-layout-modal { align-items: stretch; padding: 12px; }
  .project-layout-modal-dialog { max-height: none; padding: 18px; }
  .project-layout-editor > header { align-items: start; gap: 12px; }
  .project-layout-actions { align-items: stretch; flex-direction: column; }
  .project-layout-modal-header h2 { font-size: 20px; }
}

.category-panel {
  align-items: end;
  clip-path: none;
  color: #fff;
  display: grid;
  min-height: 100svh;
  opacity: 0;
  overflow: hidden;
  padding: clamp(72px, 10vw, 130px) clamp(24px, 5vw, 78px);
  position: relative;
  transform: translate3d(0, 28px, 0);
  transition: opacity .45s ease, transform .72s cubic-bezier(.16, 1, .3, 1);
  will-change: opacity, transform;
}

.category-panel.is-revealed {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.category-panel::after {
  background: linear-gradient(0deg, rgba(0, 0, 0, .64) 0%, rgba(0, 0, 0, .28) 34%, transparent 68%);
  content: '';
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 0;
}

.category-slides,
.category-slide {
  inset: 0;
  position: absolute;
}

.category-slide {
  opacity: 0;
}

.category-slide:first-child { opacity: 1; }

.category-slide img {
  display: block;
  filter: brightness(.72);
  height: 100%;
  object-fit: contain;
  opacity: 0;
  transform: scale(1.11);
  transition: opacity .7s ease, transform 1.35s cubic-bezier(.16, 1, .3, 1);
  width: 100%;
}

.category-slide img.is-loaded { opacity: 1; }
.category-panel.is-revealed .category-slide img { transform: scale(1); }

.category-panel:hover .category-slide img { transform: scale(1.025); }

.category-panel-copy {
  display: grid;
  gap: 7px;
  justify-items: start;
  left: var(--category-desktop-title-x, 7%);
  max-width: min(76vw, 620px);
  position: absolute;
  text-align: left;
  top: var(--category-desktop-title-y, 78%);
  transform: translateY(-50%);
  z-index: 1;
}

.category-panel-copy > * {
  opacity: 0;
  transform: translate3d(0, 18px, 0);
  transition: opacity .48s ease, transform .66s cubic-bezier(.16, 1, .3, 1);
}

.category-panel.is-revealed .category-panel-copy > * { opacity: 1; transform: translate3d(0, 0, 0); }
.category-panel.is-revealed .category-panel-copy span { transition-delay: .26s; }
.category-panel.is-revealed .category-panel-copy h2 { transition-delay: .36s; }
.category-panel.is-revealed .category-panel-copy p { transition-delay: .48s; }

.category-panel-copy span,
.category-panel-copy p {
  color: rgba(255, 255, 255, .72);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .12em;
  margin: 0;
  text-shadow: 0 1px 12px rgba(0, 0, 0, .5);
}

.category-panel-copy span {
  align-items: center;
  display: flex;
  gap: 10px;
}

.category-panel-copy span::after {
  background: currentColor;
  content: '';
  height: 1px;
  opacity: .72;
  width: 34px;
}

.category-panel-copy h2 {
  color: #fff;
  font-family: var(--heading);
  font-size: clamp(44px, 6vw, 86px);
  font-weight: 600;
  letter-spacing: .04em;
  line-height: .94;
  margin: 0;
  text-shadow: 0 2px 18px rgba(0, 0, 0, .54);
}

.category-panel-copy p { text-transform: uppercase; }

:root[data-theme='light'] .category-panel { background: var(--card); color: #1A1A1A; }
:root[data-theme='light'] .category-slide img { filter: brightness(.94); }
:root[data-theme='light'] .category-panel-copy span,
:root[data-theme='light'] .category-panel-copy p { color: rgba(255, 255, 255, .78); }
:root[data-theme='light'] .category-panel-copy h2 { color: #fff; }

@media (prefers-reduced-motion: reduce) {
  .category-panel,
  .category-panel-copy > * { clip-path: none; opacity: 1; transform: none; transition: none; }
}

.portfolio-page,
.info-page {
  padding: 116px clamp(22px, 5vw, 78px) 90px;
}

.category-switcher {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 24px;
  margin-bottom: clamp(54px, 7vw, 92px);
}

.category-switcher a {
  color: var(--muted);
  font-size: 14px;
  padding-bottom: 5px;
}

.category-switcher a.active,
.category-switcher a:hover {
  color: var(--ink);
  box-shadow: inset 0 -1px var(--accent);
}

.category-panel[data-entry-preset='number-lead'] .category-panel-copy > span,
.category-panel[data-entry-preset='number-lead'] .category-panel-copy::before { transition-delay: .06s; }
.category-panel[data-entry-preset='number-lead'] .category-panel-copy h2 { transition-delay: .15s; }
.category-panel[data-entry-preset='tracking-focus'] .category-panel-copy h2 { letter-spacing: .16em; transition: letter-spacing .7s ease, opacity .5s ease, transform .7s ease; }
.category-panel.is-revealed[data-entry-preset='tracking-focus'] .category-panel-copy h2 { letter-spacing: normal; }
.category-panel[data-entry-preset='horizontal-sweep'] { transform: translate3d(38px, 0, 0) scale(.98); }
.category-panel.is-revealed[data-entry-preset='horizontal-sweep'] { transform: translate3d(0, 0, 0) scale(1); }
.category-panel[data-entry-preset='static-fade'] { transform: none; transition: opacity .45s ease; }

.category-shared-media {
  background: #050607;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .28);
  will-change: left, top, width, height;
}

.category-shared-media img { will-change: opacity, transform; }

.category-shared-title {
  letter-spacing: 0;
  margin: 0;
  overflow: visible;
  will-change: color, opacity, transform;
}

.category-archive { overflow: visible; touch-action: pan-y; }
.category-archive.is-shared-entering { pointer-events: none; }

.category-archive .category-switcher {
  border-bottom: 1px solid var(--line);
  margin-bottom: 0;
  padding-bottom: 16px;
}

.category-masthead {
  border-bottom: 1px solid var(--line);
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  margin-top: clamp(28px, 4vw, 58px);
  padding-bottom: clamp(32px, 5vw, 72px);
  position: relative;
}

.category-masthead-issue {
  align-content: space-between;
  display: grid;
  grid-column: 1 / span 2;
  padding: 8px 24px 8px 0;
}

.category-masthead-issue span,
.category-masthead-issue small,
.category-masthead-note span {
  color: var(--muted);
  font: 500 10px/1.4 var(--mono);
  text-transform: uppercase;
}

.category-masthead-title {
  align-self: end;
  grid-column: 1 / span 10;
  min-width: 0;
}

.category-masthead-title p {
  color: var(--muted);
  font-size: clamp(14px, 1.25vw, 18px);
  margin: 0 0 clamp(12px, 1.6vw, 22px);
}

.category-masthead-title h1 {
  color: var(--ink);
  font-family: 'Oswald', 'Arial Narrow', sans-serif;
  font-size: clamp(56px, 7.8vw, 128px);
  font-weight: 700;
  letter-spacing: 0;
  line-height: .88;
  margin: 0;
  overflow-wrap: normal;
  text-transform: uppercase;
}

.category-title-word,
.category-title-char { display: inline-block; }
.category-title-word { white-space: nowrap; }

.category-masthead-note {
  align-content: end;
  border-left: 1px solid var(--line);
  display: grid;
  gap: 18px;
  grid-column: 11 / span 2;
  padding: 8px 0 8px clamp(18px, 2.3vw, 34px);
}

.category-masthead-note p {
  color: var(--ink);
  font: 500 clamp(12px, 1vw, 14px)/1.5 var(--mono);
  margin: 0;
  text-transform: uppercase;
}

.page-heading {
  display: grid;
  gap: 14px;
  max-width: 760px;
}

.page-heading h1,
.about-copy h1 {
  color: var(--ink);
  font-family: var(--heading);
  font-size: clamp(42px, 7vw, 92px);
  font-weight: 600;
  letter-spacing: .5px;
  line-height: 1.03;
  margin: 0;
}

.page-heading p:last-child,
.about-copy p {
  color: var(--muted);
  font-size: clamp(15px, 1.4vw, 18px);
  font-weight: 300;
  line-height: 1.9;
  margin: 0;
}

.album-grid {
  align-items: start;
  display: grid;
  gap: clamp(68px, 10vw, 156px) clamp(26px, 4vw, 68px);
  grid-template-columns: repeat(12, minmax(0, 1fr));
  margin-top: clamp(68px, 9vw, 132px);
}

.album-card {
  color: var(--ink);
  display: block;
  grid-column: span 6;
  position: relative;
  transition: opacity .35s ease, transform .35s ease;
}

.category-archive .album-card::before {
  color: var(--muted);
  content: attr(data-project-index);
  display: block;
  font: 500 10px/1 var(--mono);
  margin-bottom: 10px;
}

.album-card:nth-child(4n + 1) { grid-column: 1 / span 7; }
.album-card:nth-child(4n + 2) { grid-column: 9 / span 4; margin-top: clamp(70px, 11vw, 176px); }
.album-card:nth-child(4n + 3) { grid-column: 1 / span 5; }
.album-card:nth-child(4n + 4) { grid-column: 7 / span 6; margin-top: clamp(34px, 5vw, 82px); }
.album-card.album-layout-wide { grid-column: 1 / span 8; margin-top: 0; }
.album-card.album-layout-portrait { grid-column: 9 / span 4; margin-top: clamp(72px, 10vw, 156px); }
.album-card.album-layout-left { grid-column: 1 / span 5; margin-top: clamp(34px, 5vw, 82px); }
.album-card.album-layout-right { grid-column: 7 / span 6; margin-top: clamp(56px, 8vw, 128px); }
.album-card:hover { opacity: .88; transform: translateY(-5px); }

.album-grid.is-canvas-layout {
  display: block;
  min-height: clamp(1200px, 140svh, 1900px);
  position: relative;
}
.album-grid.is-canvas-layout .album-card {
  left: var(--listing-x);
  margin: 0;
  position: absolute;
  top: var(--listing-y);
  width: var(--listing-size);
}
.album-grid.is-canvas-layout.has-auto-project-grid {
  display: grid;
  min-height: 0;
  position: static;
}
.album-grid.is-canvas-layout.has-auto-project-grid .album-card {
  left: auto;
  position: relative;
  top: auto;
  width: auto;
}
.album-grid.is-canvas-layout.has-auto-project-grid .album-card:nth-child(4n + 1) { grid-column: 1 / span 7; }
.album-grid.is-canvas-layout.has-auto-project-grid .album-card:nth-child(4n + 2) { grid-column: 9 / span 4; margin-top: clamp(70px, 11vw, 176px); }
.album-grid.is-canvas-layout.has-auto-project-grid .album-card:nth-child(4n + 3) { grid-column: 1 / span 5; }
.album-grid.is-canvas-layout.has-auto-project-grid .album-card:nth-child(4n + 4) { grid-column: 7 / span 6; margin-top: clamp(34px, 5vw, 82px); }

.album-cover {
  aspect-ratio: var(--album-cover-ratio, 4 / 3);
  background: var(--card);
  overflow: hidden;
}

.album-cover-mosaic {
  display: grid;
  gap: 2px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
}

.album-cover-cell { background: var(--line); min-height: 0; overflow: hidden; }
.album-cover-cell:only-child { grid-column: 1 / -1; grid-row: 1 / -1; }
.album-cover-cell:first-child:nth-last-child(2) { grid-row: 1 / -1; }
.album-cover-cell:first-child:nth-last-child(3) { grid-row: 1 / -1; }

.album-cover-cell img {
  display: block;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .7s ease, transform .7s ease;
  width: 100%;
}

.album-cover > img {
  display: block;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity .7s ease, transform .7s ease;
  width: 100%;
}

.album-cover img.is-loaded { opacity: 1; }

.album-card:hover .album-cover-cell img { transform: scale(1.035); }
.album-card:hover .album-cover > img { transform: scale(1.025); }

.album-meta {
  align-items: baseline;
  border-top: 1px solid var(--line);
  display: grid;
  gap: 5px 12px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding-top: 12px;
}

.album-meta span,
.album-meta small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 300;
}

.album-meta strong {
  color: var(--ink);
  font-family: var(--heading);
  font-size: clamp(18px, 2vw, 28px);
  font-weight: 600;
  grid-column: 1;
}

.album-meta span { grid-column: 1; }
.album-meta small { grid-column: 2; grid-row: 1 / span 2; }

.album-meta em {
  color: var(--muted);
  font-size: 11px;
  font-style: normal;
  grid-column: 1;
  margin-top: 8px;
  opacity: 0;
  transition: opacity .25s ease;
}

.album-card:hover .album-meta em { opacity: 1; }

.gallery-page {
  background: var(--paper);
  color: var(--ink);
  display: grid;
  grid-template-rows: 72px 1fr;
  height: 100svh;
}

.gallery-topbar,
.gallery-actions {
  align-items: center;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  padding: 0 clamp(18px, 4vw, 58px);
}

.gallery-topbar span,
.gallery-topbar p,
.gallery-topbar a,
.gallery-topbar button,
.gallery-actions a,
.gallery-actions button,
.gallery-caption,
.gallery-stage figcaption {
  color: var(--muted);
  font-size: 12px;
  font-weight: 300;
  margin: 0;
}

.gallery-topbar strong {
  color: var(--ink);
  display: block;
  font-family: var(--heading);
  font-size: 15px;
  font-weight: 600;
  margin-top: 3px;
}

.gallery-topbar p { justify-self: center; }
.gallery-top-actions { align-items: center; display: flex; gap: 18px; grid-column: 3; justify-self: end; }
.gallery-topbar a,
.gallery-topbar button,
.gallery-actions button { background: transparent; border: 0; cursor: pointer; padding: 0; }
.gallery-copy-zh { display: none; }
@media (hover: hover) and (pointer: fine) {
  .gallery-topbar a:hover .gallery-copy-en,
  .gallery-topbar button:hover .gallery-copy-en,
  .gallery-actions a:hover .gallery-copy-en,
  .gallery-actions button:hover .gallery-copy-en { display: none; }
  .gallery-topbar a:hover .gallery-copy-zh,
  .gallery-topbar button:hover .gallery-copy-zh,
  .gallery-actions a:hover .gallery-copy-zh,
  .gallery-actions button:hover .gallery-copy-zh { display: inline; }
}
.gallery-stage {
  align-items: center;
  cursor: grab;
  display: grid;
  min-height: 0;
  padding: 20px clamp(18px, 7vw, 110px);
  touch-action: pan-y;
}

.gallery-stage:active { cursor: grabbing; }
.gallery-stage figure {
  display: grid;
  gap: 14px;
  justify-items: center;
  margin: 0;
  min-height: 0;
}

.gallery-image-shell {
  align-items: center;
  display: flex;
  justify-content: center;
  max-height: calc(100svh - 190px);
  position: relative;
  width: 100%;
}

.gallery-image {
  display: block;
  max-height: calc(100svh - 190px);
  max-width: 100%;
  object-fit: contain;
  opacity: 0;
  user-select: none;
}

.gallery-image-shell.is-entering .gallery-image {
  animation: galleryImageIn .42s ease both;
}

.gallery-image-shell.from-left.is-entering .gallery-image {
  animation-name: galleryImageInLeft;
}

.image-watermark {
  bottom: 16px;
  color: rgba(255, 255, 255, .28);
  font-size: 11px;
  letter-spacing: .5px;
  position: absolute;
  right: 18px;
  text-shadow: 0 1px 5px rgba(0, 0, 0, .32);
}

.gallery-actions > :first-child { justify-self: start; }
.gallery-actions > :last-child { justify-self: end; }
.gallery-actions a:hover,
.gallery-topbar a:hover,
.gallery-topbar button:hover,
.gallery-actions button:hover { color: var(--ink); }

.gallery-overview {
  background: var(--paper);
  color: var(--ink);
  display: grid;
  grid-template-rows: 72px auto;
  inset: 0;
  opacity: 0;
  overflow-y: auto;
  padding: 0 clamp(18px, 4vw, 58px) clamp(18px, 4vw, 54px);
  position: fixed;
  transform: translateY(16px);
  transition: opacity .42s ease, transform .42s ease;
  z-index: 100;
}

.gallery-overview.is-visible { opacity: 1; transform: translateY(0); }
.gallery-overview-head { align-items: center; display: grid; grid-template-columns: 1fr auto 1fr; }
.gallery-overview-head span,
.gallery-overview-head p,
.gallery-overview-head button { color: var(--muted); font-size: 12px; font-weight: 300; margin: 0; }
.gallery-overview-head strong { color: var(--ink); display: block; font-family: var(--heading); font-size: 15px; font-weight: 600; margin-top: 3px; }
.gallery-overview-head p { justify-self: center; }
.gallery-overview-head button { background: transparent; border: 0; cursor: pointer; justify-self: end; padding: 0; }
.gallery-overview-head a { color: var(--muted); font-size: 12px; font-weight: 300; justify-self: end; }
.gallery-overview-canvas { aspect-ratio: var(--project-desktop-canvas-ratio, 3 / 4); background: var(--soft); min-height: 0; overflow: hidden; position: relative; }
.theme-direct-canvas { margin: 0 auto 72px; max-width: 1440px; width: min(100%, 1440px); }
.category-intro { color: var(--muted); font: 13px/1.7 var(--mono); margin: 0 auto 36px; max-width: 680px; padding: 0 24px; }
.category-magazine-flow { display: grid; gap: clamp(20px, 3vw, 48px); grid-template-columns: repeat(12, minmax(0, 1fr)); padding: 0 clamp(18px, 4vw, 64px); }
.magazine-block { align-items: start; display: grid; gap: clamp(10px, 1.6vw, 26px); grid-column: 1 / -1; }
.magazine-photo { background: var(--soft); border: 0; cursor: zoom-in; display: block; min-width: 0; padding: 0; position: relative; width: 100%; }
.magazine-photo img { display: block; height: auto; object-fit: contain; width: 100%; }
[data-protected-image] { -webkit-touch-callout: none; -webkit-user-drag: none; user-select: none; }
.magazine-photo span { background: rgba(15,15,14,.76); bottom: 8px; color: #fff; font: 10px var(--mono); left: 8px; padding: 4px 5px; position: absolute; }
.template-auto { grid-column: span 6; }.template-auto .magazine-photo.is-portrait { margin-left: auto; max-width: 76%; }
.template-single-space { grid-column: span 5; }.template-single-space .magazine-photo { margin: 0 auto; max-width: 82%; }
.template-wide { grid-column: 1 / -1; }.template-wide .magazine-photo { max-width: 1260px; }
.template-big-small { grid-template-columns: minmax(0, 1.65fr) minmax(0,.85fr); }.template-big-small .magazine-photo:last-child { align-self: end; }
.template-portrait-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 850px; }.template-triptych { grid-template-columns: repeat(3, minmax(0,1fr)); }
.template-note-page { align-items: center; grid-template-columns: minmax(0,1.5fr) minmax(180px,.55fr); margin-left: auto; max-width: 1100px; }.template-note-page aside { border-top: 1px solid var(--line); min-height: 160px; padding-top: 12px; }.template-note-page aside span,.template-note-page aside small { color: var(--muted); display:block; font:10px var(--mono); }.template-note-page aside p { font-family:var(--heading); font-size:clamp(20px,2.4vw,34px); line-height:1.05; margin:16px 0 28px; }
.template-landscape-pair { grid-template-columns:repeat(2,minmax(0,1fr)); margin-left:auto; max-width:1240px; }
.template-portrait-story { grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); grid-template-rows:auto auto; max-width:1080px; }.template-portrait-story .magazine-photo:first-child { align-self:center; grid-row:1 / span 2; }.template-portrait-story .magazine-photo:not(:first-child) { justify-self:end; max-width:84%; }
.template-portrait-landscape-mix { grid-template-columns:minmax(0,.72fr) minmax(0,.72fr) minmax(0,1.35fr); max-width:1240px; }.template-portrait-landscape-mix .magazine-photo:last-child { align-self:center; }
.template-contact-sheet { grid-template-columns:repeat(4,minmax(0,1fr)); max-width:1320px; }
.template-wide-detail { grid-template-columns:repeat(12,minmax(0,1fr)); max-width:1280px; }.template-wide-detail .magazine-photo:first-child { grid-column:1 / -1; }.template-wide-detail .magazine-photo:last-child { grid-column:8 / -1; }
.template-staggered { grid-template-columns:repeat(3,minmax(0,1fr)); max-width:1180px; }.template-staggered .magazine-photo:nth-child(2) { margin-top:clamp(28px,5vw,96px); }.template-staggered .magazine-photo:nth-child(3) { margin-top:clamp(12px,2vw,38px); }
.template-editorial-duo,
.template-hero-stack,
.template-spec-board,
.template-look-compare,
.template-product-orbit { background:var(--paper); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 8%,transparent); overflow:hidden; padding:clamp(18px,3.4vw,54px); position:relative; }
.template-editorial-duo { align-items:stretch; grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr); }
.template-editorial-duo .magazine-photo:first-child { align-self:center; background:var(--paper); box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 10%,transparent); padding:clamp(12px,2vw,30px); }
.template-hero-stack { grid-template-columns:minmax(0,1.28fr) minmax(0,.72fr); grid-template-rows:auto auto; }
.template-hero-stack .magazine-photo:first-child { align-self:center; grid-row:1 / span 2; }
.template-hero-stack .magazine-photo:not(:first-child) { justify-self:end; width:88%; }
.template-spec-board { align-items:start; grid-template-columns:repeat(12,minmax(0,1fr)); }
.template-spec-board .magazine-photo:first-child { grid-column:1 / span 7; grid-row:1 / span 2; }
.template-spec-board .magazine-photo:nth-child(2) { grid-column:8 / span 2; }
.template-spec-board .magazine-photo:nth-child(3) { grid-column:10 / -1; }
.template-spec-board .magazine-photo:nth-child(4) { align-self:end; grid-column:8 / -1; }
.template-look-compare { gap:clamp(10px,1.4vw,22px); padding-left:clamp(84px,13vw,190px); }
.template-look-compare .magazine-photo { margin-left:auto; max-width:78%; }
.template-product-orbit { grid-template-columns:repeat(12,minmax(0,1fr)); grid-template-rows:auto auto; }
.template-product-orbit .magazine-photo:first-child { grid-column:1 / span 7; }
.template-product-orbit .magazine-photo:nth-child(2) { align-self:start; grid-column:1 / span 4; grid-row:2; margin-top:clamp(12px,2.4vw,36px); }
.template-product-orbit .magazine-photo:nth-child(3) { align-self:end; grid-column:8 / -1; grid-row:2; margin-top:clamp(42px,8vw,120px); }
.magazine-captions { font:500 clamp(12px,1.05vw,16px)/1.35 var(--mono); inset:0; letter-spacing:.015em; pointer-events:none; position:absolute; z-index:2; }
.magazine-captions span { color:var(--ink); display:flex; gap:7px; max-width:24ch; position:absolute; text-wrap:balance; }
.magazine-captions i { color:var(--muted); font-size:.76em; font-style:normal; letter-spacing:.08em; }
.template-editorial-duo .caption-1 { left:clamp(24px,4vw,64px); top:clamp(8px,1.5vw,22px); }
.template-editorial-duo .caption-2 { bottom:clamp(8px,1.5vw,22px); right:clamp(24px,4vw,64px); }
.template-hero-stack .caption-1,.template-spec-board .caption-1 { left:clamp(8px,1.2vw,18px); top:clamp(8px,1.2vw,18px); }
.template-hero-stack .caption-2 { right:clamp(8px,1.2vw,18px); top:clamp(8px,1.2vw,18px); }
.template-hero-stack .caption-3 { bottom:clamp(8px,1.2vw,18px); right:clamp(8px,1.2vw,18px); }
.template-spec-board .caption-2 { right:22%; top:clamp(8px,1.2vw,18px); }
.template-spec-board .caption-3 { right:clamp(8px,1.2vw,18px); top:clamp(8px,1.2vw,18px); }
.template-spec-board .caption-4 { bottom:clamp(8px,1.2vw,18px); right:clamp(8px,1.2vw,18px); }
.template-look-compare .magazine-captions span { left:clamp(20px,4vw,60px); max-width:16ch; writing-mode:vertical-rl; }
.template-look-compare .caption-1 { top:18%; }
.template-look-compare .caption-2 { bottom:18%; }
.template-product-orbit .caption-1 { left:clamp(8px,1.2vw,18px); top:clamp(8px,1.2vw,18px); }
.template-product-orbit .caption-2 { bottom:clamp(8px,1.2vw,18px); left:32%; }
.template-product-orbit .caption-3 { bottom:clamp(8px,1.2vw,18px); right:clamp(8px,1.2vw,18px); }
.category-meta-form { display:grid; gap:10px; grid-template-columns: repeat(2,minmax(0,1fr)); margin:0 0 22px; }.category-meta-form label { color:var(--muted); display:grid; font-size:10px; gap:5px; }.category-meta-form input,.category-meta-form textarea,.theme-template select,.theme-note { background:var(--paper); border:1px solid var(--line); color:var(--ink); min-height:34px; padding:7px; }.category-meta-form .wide { grid-column:1/-1; }.category-meta-form textarea { min-height:72px; resize:vertical; }.category-meta-form .publish { align-items:center; display:flex; gap:7px; }.category-meta-form button { background:var(--ink); border:0; color:var(--paper); min-height:34px; }.theme-order { display:flex; gap:5px; margin:10px 10px 0; }.theme-order button { background:var(--paper); border:1px solid var(--line); height:28px; width:30px; }.theme-template { display:grid; gap:5px; margin:10px; }.theme-template span { color:var(--muted); font:9px var(--mono); }.theme-note { display:block; margin:0 10px 10px; min-height:60px; width:calc(100% - 20px); }
.category-overview-grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr));padding-top:24px}.category-overview-card{background:var(--card);border:1px solid var(--line);display:grid;gap:12px;min-width:0;padding:10px}.category-overview-card.is-home{border-color:var(--ink)}.category-overview-cover{aspect-ratio:4/3;background:var(--soft);display:grid;place-items:center;overflow:hidden}.category-overview-cover img{height:100%;object-fit:cover;width:100%}.category-overview-card h3{font-size:20px;margin:2px 0}.category-overview-card p,.category-overview-card span{color:var(--muted);font-size:11px;margin:0}.category-overview-card footer{display:flex;gap:7px}.category-overview-card button{background:var(--paper);border:1px solid var(--line);color:var(--ink);font-size:11px;min-height:32px;padding:0 10px}.category-overview-card footer button:first-child{background:var(--ink);color:var(--paper)}.category-breadcrumb{align-items:center;border-bottom:1px solid var(--line);display:flex;gap:8px;min-height:52px;padding:0 2px}.category-breadcrumb button{background:transparent;border:0;color:var(--muted);font-size:11px;padding:0}.category-breadcrumb button:last-child{border-left:1px solid var(--line);color:var(--ink);margin-left:auto;padding-left:14px}.category-workbench-tabs{border-bottom:1px solid var(--line);display:flex;gap:4px;padding:12px 0 0}.category-workbench-tabs button{background:transparent;border:0;border-bottom:2px solid transparent;color:var(--muted);font-size:12px;min-height:38px;padding:0 14px}.category-workbench-tabs button.active{border-bottom-color:var(--ink);color:var(--ink)}.category-workbench-view{padding-top:22px}.category-section-head{align-items:end;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;padding-bottom:18px}.category-section-head h2,.category-cover-desk h2{font-size:28px;margin:3px 0 0}.theme-layout-desk{display:grid;gap:18px;grid-template-columns:230px minmax(0,1fr);padding-top:18px}.theme-photo-list{border-right:1px solid var(--line);display:grid;gap:6px;max-height:64svh;overflow:auto;padding-right:12px}.theme-photo-list button{align-items:center;background:transparent;border:1px solid transparent;color:var(--ink);display:grid;gap:8px;grid-template-columns:44px 24px minmax(0,1fr);padding:5px;text-align:left}.theme-photo-list button.active{background:var(--card);border-color:var(--ink)}.theme-photo-list img{aspect-ratio:1;height:44px;object-fit:cover;width:44px}.theme-photo-list span,.theme-photo-list small{font:10px var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.theme-layout-preview{display:grid;gap:18px;grid-template-columns:minmax(0,1fr) 250px}.theme-preview-device{align-items:center;background:var(--card);display:flex;justify-content:center;min-height:440px;padding:28px}.theme-preview-device img{display:block;max-height:56svh;max-width:100%;object-fit:contain}.theme-layout-controls{border-left:1px solid var(--line);display:grid;align-content:start;gap:12px;padding-left:16px}.theme-layout-controls label{display:grid;font-size:11px;gap:5px}.theme-layout-controls select,.theme-layout-controls textarea{background:var(--paper);border:1px solid var(--line);min-height:34px;padding:7px}.theme-layout-controls textarea{min-height:78px;resize:vertical}.theme-layout-controls button{background:var(--paper);border:1px solid var(--line);min-height:32px;padding:0 9px}.theme-layout-controls small{color:var(--muted);font-size:10px;line-height:1.55}.category-info-form{display:grid;gap:16px;max-width:700px}.category-info-form>div{display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.category-info-form label{color:var(--muted);display:grid;font-size:10px;gap:5px}.category-info-form input,.category-info-form textarea{background:var(--paper);border:1px solid var(--line);color:var(--ink);min-height:36px;padding:7px}.category-info-form textarea{min-height:78px;resize:vertical}.category-info-form footer{align-items:center;border-top:1px solid var(--line);display:flex;justify-content:space-between;padding-top:14px}.category-info-form footer label{align-items:center;display:flex;gap:7px}.category-info-form footer button{background:var(--ink);border:0;color:var(--paper);min-height:36px;padding:0 16px}.category-cover-desk>div{display:grid;gap:10px;grid-template-columns:repeat(4,minmax(0,1fr))}.category-cover-desk>div button{background:var(--card);border:1px solid transparent;padding:0;position:relative}.category-cover-desk>div button.active{border-color:var(--ink)}.category-cover-desk img{aspect-ratio:4/3;display:block;height:auto;object-fit:cover;width:100%}.category-cover-desk span{background:rgba(15,15,14,.75);bottom:0;color:#fff;font-size:10px;left:0;padding:6px;position:absolute}.category-cover-desk footer{align-items:center;border-top:1px solid var(--line);display:flex;justify-content:space-between;margin-top:18px;padding-top:14px}.category-cover-desk footer a{border:1px solid var(--line);color:var(--ink);font-size:11px;padding:9px 12px}
.theme-photo-list small{display:grid;gap:2px}.theme-photo-list small b{color:var(--muted);font-weight:400}.theme-template-hint{color:var(--muted);font-size:10px;line-height:1.55;margin:0}.theme-preview-pair{align-items:start;display:grid;gap:14px;grid-template-columns:minmax(0,1fr) 190px}.theme-preview-pair>article{background:var(--card);border:1px solid var(--line);min-width:0;padding:8px}.theme-preview-pair header{border-bottom:1px solid var(--line);color:var(--muted);font:9px var(--mono);padding:3px 2px 7px}.theme-magazine-preview{background:var(--paper);display:grid;gap:6px;grid-template-columns:repeat(12,minmax(0,1fr));max-height:62svh;overflow:auto;padding:10px}.theme-magazine-preview .magazine-block{gap:5px}.theme-magazine-preview .magazine-photo{cursor:default}.theme-magazine-preview .magazine-photo span{display:none}.theme-magazine-preview .template-note-page aside{min-height:50px;padding-top:5px}.theme-magazine-preview .template-note-page aside p{font-size:12px;margin:6px 0}.theme-magazine-preview.is-mobile{display:block;max-height:62svh;padding:8px}.theme-magazine-preview.is-mobile .magazine-block{margin-bottom:8px}.theme-magazine-preview.is-mobile .template-auto,.theme-magazine-preview.is-mobile .template-single-space{margin-left:0;width:100%}.theme-magazine-preview.is-mobile .template-auto .magazine-photo.is-portrait,.theme-magazine-preview.is-mobile .template-single-space .magazine-photo{margin-left:auto;max-width:80%}.theme-magazine-preview.is-mobile .template-big-small,.theme-magazine-preview.is-mobile .template-portrait-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-triptych{display:grid;gap:3px;grid-template-columns:repeat(3,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-note-page{display:grid;grid-template-columns:1fr}.theme-magazine-preview.is-mobile .template-note-page aside{margin-left:15%;width:85%}.theme-magazine-preview.is-mobile .template-landscape-pair,.theme-magazine-preview.is-mobile .template-portrait-story,.theme-magazine-preview.is-mobile .template-portrait-landscape-mix,.theme-magazine-preview.is-mobile .template-contact-sheet,.theme-magazine-preview.is-mobile .template-wide-detail,.theme-magazine-preview.is-mobile .template-staggered{display:grid;grid-template-columns:1fr}.theme-magazine-preview.is-mobile .template-portrait-story .magazine-photo:first-child,.theme-magazine-preview.is-mobile .template-wide-detail .magazine-photo:first-child,.theme-magazine-preview.is-mobile .template-wide-detail .magazine-photo:last-child{grid-column:auto;grid-row:auto}.theme-magazine-preview.is-mobile .template-portrait-story .magazine-photo:not(:first-child),.theme-magazine-preview.is-mobile .template-wide-detail .magazine-photo:last-child{justify-self:auto;max-width:82%}.theme-magazine-preview.is-mobile .template-staggered .magazine-photo:nth-child(n){margin-top:0}
.category-cover-desk>header>p:last-child{color:var(--muted);font-size:11px;line-height:1.55;max-width:620px}.category-cover-desk>.category-cover-slots{display:grid;gap:14px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px}.category-cover-slot{background:var(--card);border:1px solid var(--line);display:grid;gap:10px;padding:11px}.category-cover-slot header{display:grid;gap:5px}.category-cover-slot header>div{align-items:baseline;display:flex;justify-content:space-between}.category-cover-slot header span,.category-cover-slot header small,.category-cover-slot p{color:var(--muted);font-size:10px;line-height:1.45;margin:0}.category-cover-slot header strong{font-size:11px;font-weight:600}.category-cover-slot-preview{align-items:center;aspect-ratio:16/9;background:var(--soft);display:flex;justify-content:center;overflow:hidden}.category-cover-slot:nth-child(2) .category-cover-slot-preview{aspect-ratio:9/12}.category-cover-slot-preview img{aspect-ratio:auto!important;height:100%;object-fit:contain!important;width:100%}.category-cover-slot-preview>span{background:transparent;color:var(--muted);position:static}.category-cover-slot>label{color:var(--muted);display:grid;font-size:10px;gap:5px}.category-cover-slot select{background:var(--paper);border:1px solid var(--line);color:var(--ink);min-height:34px;padding:0 8px}.category-cover-upload span{align-items:center;border:1px solid var(--line);color:var(--ink);display:flex;justify-content:center;min-height:34px;padding:0 8px}.category-cover-upload:hover span,.category-cover-upload:focus-within span{border-color:var(--ink)}

/* Mobile preview mirrors the public category flow: preserve each template's hierarchy without crop or overlap. */
.theme-magazine-preview.is-mobile .template-landscape-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-portrait-story{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);grid-template-rows:auto auto}.theme-magazine-preview.is-mobile .template-portrait-story .magazine-photo:first-child{align-self:center;grid-row:1 / span 2}.theme-magazine-preview.is-mobile .template-portrait-story .magazine-photo:not(:first-child){justify-self:end;max-width:88%}.theme-magazine-preview.is-mobile .template-portrait-landscape-mix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-portrait-landscape-mix .magazine-photo:last-child{align-self:auto;grid-column:1 / -1}.theme-magazine-preview.is-mobile .template-contact-sheet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-wide-detail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-wide-detail .magazine-photo:first-child{grid-column:1 / -1;grid-row:auto}.theme-magazine-preview.is-mobile .template-wide-detail .magazine-photo:last-child{grid-column:2;grid-row:auto;justify-self:end;max-width:86%}.theme-magazine-preview.is-mobile .template-staggered{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-staggered .magazine-photo:nth-child(2){margin-top:14px}.theme-magazine-preview.is-mobile .template-staggered .magazine-photo:nth-child(3){grid-column:1 / -1;justify-self:center;margin-top:8px;max-width:74%}
.theme-magazine-preview.is-mobile .template-editorial-duo,.theme-magazine-preview.is-mobile .template-hero-stack,.theme-magazine-preview.is-mobile .template-spec-board,.theme-magazine-preview.is-mobile .template-look-compare,.theme-magazine-preview.is-mobile .template-product-orbit{display:grid;gap:3px;padding:7px}.theme-magazine-preview.is-mobile .template-editorial-duo{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}.theme-magazine-preview.is-mobile .template-editorial-duo .magazine-photo:first-child{padding:4px}.theme-magazine-preview.is-mobile .template-hero-stack{grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);grid-template-rows:auto auto}.theme-magazine-preview.is-mobile .template-hero-stack .magazine-photo:first-child{grid-row:1 / span 2}.theme-magazine-preview.is-mobile .template-hero-stack .magazine-photo:not(:first-child){width:92%}.theme-magazine-preview.is-mobile .template-spec-board{grid-template-columns:repeat(3,minmax(0,1fr))}.theme-magazine-preview.is-mobile .template-spec-board .magazine-photo:first-child{grid-column:1 / -1;grid-row:auto}.theme-magazine-preview.is-mobile .template-spec-board .magazine-photo:nth-child(n+2){grid-column:auto}.theme-magazine-preview.is-mobile .template-look-compare{grid-template-columns:1fr;padding-left:28px}.theme-magazine-preview.is-mobile .template-look-compare .magazine-photo{max-width:88%}.theme-magazine-preview.is-mobile .template-product-orbit{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto}.theme-magazine-preview.is-mobile .template-product-orbit .magazine-photo:first-child{grid-column:1 / -1}.theme-magazine-preview.is-mobile .template-product-orbit .magazine-photo:nth-child(2),.theme-magazine-preview.is-mobile .template-product-orbit .magazine-photo:nth-child(3){grid-column:auto;grid-row:2;margin-top:5px}.theme-magazine-preview .magazine-captions{font-size:6px;line-height:1.3}.theme-magazine-preview .magazine-captions span{gap:2px}.theme-magazine-preview.is-mobile .template-look-compare .magazine-captions span{left:7px}
.theme-magazine-preview .magazine-block.has-preview-selected{box-shadow:inset 0 0 0 1px var(--ink);padding:4px}.theme-magazine-preview .magazine-photo.is-preview-selected{box-shadow:inset 0 0 0 2px var(--ink);filter:brightness(.94)}.theme-magazine-preview .magazine-photo.is-preview-selected::after{border:1px solid var(--paper);content:'';inset:4px;pointer-events:none;position:absolute}
/* Cover motion stays preset-based: no free positioning or layout changes. */
.category-cover-motion{border-top:1px solid var(--line);display:grid;gap:10px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px;padding-top:14px}.category-cover-motion label{color:var(--muted);display:grid;font-size:10px;gap:5px}.category-cover-motion select{background:var(--paper);border:1px solid var(--line);color:var(--ink);min-height:34px;padding:0 8px}.category-cover-motion button{background:var(--ink);border:0;color:var(--paper);justify-self:start;min-height:34px;padding:0 12px}.category-cover-motion small{align-self:center;color:var(--muted);font-size:10px;line-height:1.45}
.category-upload-button{align-items:center;background:var(--ink);border:0;color:var(--paper)!important;cursor:pointer;display:inline-flex;font:11px var(--mono);gap:7px;justify-content:center;letter-spacing:.04em;min-height:36px;padding:0 13px}.category-upload-button:hover,.category-upload-button:focus-visible{background:var(--accent);color:#1a1a1a!important;outline:0}.category-upload-button span{font-size:17px;line-height:1}.theme-photo-actions{border-top:1px solid var(--line);display:grid;gap:10px;margin-top:8px;padding-top:13px}.theme-photo-actions>header{display:grid;gap:3px}.theme-photo-actions>header span{color:var(--ink);font:10px var(--mono);letter-spacing:.06em}.theme-photo-actions>header small{color:var(--muted);font-size:10px;line-height:1.35}.theme-order-actions{display:grid!important;gap:6px!important;grid-template-columns:repeat(2,minmax(0,1fr))}.theme-order-actions button{align-items:center;display:flex!important;gap:5px;justify-content:center;min-width:0}.theme-order-actions b{font-size:15px;font-weight:400;line-height:1}.theme-delete-action{align-items:center;border-color:#a8534b!important;color:#a8534b!important;display:flex!important;justify-content:space-between;padding:7px 9px!important;text-align:left}.theme-delete-action span{font-size:11px}.theme-delete-action small{color:currentColor;font-size:9px;line-height:1.3;text-align:right}.theme-delete-action:hover,.theme-delete-action:focus-visible{background:#a8534b!important;color:#fff!important;outline:0}
.category-identity-bar{align-items:end;border-bottom:1px solid var(--line);display:grid;gap:10px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;padding:14px 0}.category-identity-bar label{color:var(--muted);display:grid;font:10px var(--mono);gap:5px}.category-identity-bar input{background:var(--paper);border:1px solid var(--line);color:var(--ink);height:34px;padding:0 9px}.category-identity-bar button{background:var(--ink);border:0;color:var(--paper);font-size:11px;height:34px;padding:0 15px}.dual-cover-modal{align-items:center;background:rgba(18,18,16,.58);display:flex;inset:0;justify-content:center;padding:28px;position:fixed;z-index:1000}.dual-cover-dialog{background:var(--paper);border:1px solid var(--line);box-shadow:0 26px 90px rgba(0,0,0,.26);max-height:min(860px,calc(100svh - 56px));max-width:1060px;overflow:auto;padding:24px;width:100%}.dual-cover-dialog>header{align-items:start;border-bottom:1px solid var(--line);display:flex;gap:24px;justify-content:space-between;padding-bottom:18px}.dual-cover-dialog h2{font-size:25px;margin:4px 0}.dual-cover-dialog header p{color:var(--muted);font-size:11px;line-height:1.6;margin:4px 0 0;max-width:620px}.dual-cover-close{background:transparent;border:0;color:var(--ink);font-size:26px;line-height:1;padding:0}.dual-cover-slots{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr));padding:18px 0}.dual-cover-slot{border:1px solid var(--line);cursor:pointer;padding:12px}.dual-cover-slot.is-target{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.dual-cover-slot header{display:block}.dual-cover-slot header>div{align-items:center;display:flex;justify-content:space-between}.dual-cover-slot header span{font:12px var(--mono)}.dual-cover-slot header strong{color:var(--muted);font-size:10px}.dual-cover-slot header small,.dual-cover-slot>p{color:var(--muted);display:block;font-size:10px;line-height:1.5;margin:7px 0 0}.dual-cover-preview{align-items:center;background:var(--soft);display:flex;justify-content:center;margin-top:10px;min-height:178px;overflow:hidden}.dual-cover-preview img{display:block;max-height:280px;max-width:100%;object-fit:contain}.dual-cover-preview span{color:var(--muted);font-size:11px}.dual-cover-actions{display:flex;gap:8px;margin-top:10px}.dual-cover-actions button,.dual-cover-actions .category-cover-upload{align-items:center;background:var(--paper);border:1px solid var(--line);color:var(--ink);display:flex;font-size:11px;justify-content:center;min-height:34px;padding:0 10px}.dual-cover-actions .category-cover-upload{cursor:pointer}.dual-cover-library{border-top:1px solid var(--line);padding-top:16px}.dual-cover-library>header{display:flex;justify-content:space-between}.dual-cover-library header strong{font:12px var(--mono)}.dual-cover-library header small{color:var(--muted);font-size:10px}.dual-cover-library>div{display:grid;gap:8px;grid-template-columns:repeat(6,minmax(0,1fr));margin-top:12px}.dual-cover-library button{background:var(--card);border:1px solid var(--line);color:var(--ink);padding:0;text-align:left}.dual-cover-library button:hover,.dual-cover-library button:focus-visible{border-color:var(--ink)}.dual-cover-library img{aspect-ratio:1.2;display:block;object-fit:cover;width:100%}.dual-cover-library span{display:block;font-size:10px;overflow:hidden;padding:6px;text-overflow:ellipsis;white-space:nowrap}.dual-cover-library>p{color:var(--muted);font-size:10px;margin:10px 0 0}.hero-media picture,.home-photographer-portrait picture{display:block;height:100%;width:100%}.hero-media picture img,.home-photographer-portrait picture img{display:block;height:100%;object-fit:cover;width:100%}
.site-settings-inspector>header{border-bottom:1px solid var(--line);padding-bottom:14px}.site-settings-inspector h3{font-size:18px;margin:5px 0}.site-settings-inspector>header>p:last-child{color:var(--muted);font-size:11px;line-height:1.55;margin:0}.site-settings-inspector .category-info-form{margin-top:16px;max-width:none}.site-settings-inspector .category-info-form>div{grid-template-columns:1fr}.site-settings-inspector .category-info-form footer{align-items:stretch;display:grid;gap:10px}.site-settings-inspector .category-info-form footer button{width:100%}
.share-card-preview{background:#fff;border:1px solid var(--line);margin-top:18px;overflow:hidden}.share-card-preview img,.share-card-preview-empty{aspect-ratio:1.91/1;display:block;object-fit:cover;width:100%}.share-card-preview-empty{align-items:center;background:#e8e5de;color:var(--muted);display:flex;font-size:12px;justify-content:center}.share-card-preview>div:last-child{padding:13px 14px 14px}.share-card-preview strong{display:block;font-size:14px;line-height:1.35}.share-card-preview p{color:var(--muted);font-size:12px;line-height:1.5;margin:7px 0}.share-card-preview small{color:var(--muted);font-size:10px;letter-spacing:.04em}
:root[data-theme='dark'] .share-card-preview{background:#101216}
.category-section-head h2 span{color:var(--muted);font:10px var(--mono);margin-left:8px;vertical-align:middle}.category-section-head h2+p{color:var(--muted);font-size:11px;margin:6px 0 0}.theme-photo-list button{position:relative}.theme-photo-list button i{color:var(--muted);font:13px var(--mono);position:absolute;right:6px;top:5px}.theme-photo-list button.is-dragging{opacity:.4}.theme-photo-list button.is-drop-target{border-color:var(--ink);box-shadow:inset 3px 0 0 var(--ink)}
.category-section-actions{align-items:center;display:flex;gap:8px}.category-manage-photos{background:var(--paper);border:1px solid var(--line);color:var(--ink);font:11px var(--mono);min-height:36px;padding:0 12px}.category-manage-photos:hover,.category-manage-photos:focus-visible{border-color:var(--ink);outline:0}.theme-bulk-delete-dialog{max-width:520px}.theme-bulk-delete-dialog>section{display:grid;gap:12px;padding-top:20px}.theme-bulk-delete-dialog>section>strong{font:16px var(--heading)}.theme-bulk-delete-dialog>section>p{color:var(--muted);font-size:11px;line-height:1.65;margin:0}.theme-bulk-delete-dialog label{display:grid;font-size:11px;gap:6px}.theme-bulk-delete-dialog input{background:var(--paper);border:1px solid var(--line);min-height:38px;padding:0 10px}.theme-bulk-delete-dialog small{color:#a8534b;font-size:10px;min-height:15px}.theme-bulk-delete-dialog footer{display:flex;gap:8px;justify-content:flex-end}.theme-bulk-delete-dialog footer button{background:var(--paper);border:1px solid var(--line);color:var(--ink);min-height:36px;padding:0 12px}.theme-bulk-delete-dialog .theme-bulk-delete-submit{border-color:#a8534b;color:#a8534b}.theme-bulk-delete-dialog .theme-bulk-delete-submit:not(:disabled){background:#a8534b;color:#fff}.theme-bulk-delete-dialog button:disabled{cursor:not-allowed;opacity:.45}
/* Theme canvases use their stored layout rectangles. Do not let intrinsic
   image proportions replace the calculated height and cause overlap. */
.theme-direct-canvas .gallery-overview-frame[style*='--asset-ratio'] { aspect-ratio: auto; height: var(--layout-h) !important; }
.gallery-overview-frame {
  background: var(--card);
  border: 0;
  cursor: pointer;
  height: var(--layout-h);
  left: var(--layout-x);
  overflow: hidden;
  padding: 0;
  position: absolute;
  top: var(--layout-y);
  transition: filter .25s ease, transform .25s ease;
  width: var(--layout-w);
}
.gallery-overview-frame[style*='--asset-ratio'] { aspect-ratio: var(--asset-ratio); height: auto; }
.gallery-overview-frame:hover { filter: brightness(.86); transform: scale(.985); }
.gallery-overview-frame img { display: block; height: 100%; object-fit: contain; pointer-events: none; width: 100%; }
.gallery-overview-frame span { bottom: 8px; color: #fff; font-size: 10px; left: 9px; position: absolute; text-shadow: 0 1px 5px rgba(0, 0, 0, .45); }

.mobile-project-overview-page { background: var(--paper); color: var(--ink); min-height: 100svh; padding: 0 12px 12px; touch-action: pan-y; }
.mobile-project-overview-head { background: var(--paper); height: 64px; position: sticky; top: 0; z-index: 3; }
.mobile-project-overview-canvas { margin: 0 auto; max-width: 1440px; width: 100%; }
.mobile-project-overview-canvas .gallery-overview-frame { cursor: default; margin: 0; }
.mobile-project-overview-canvas.has-auto-desktop-layout {
  aspect-ratio: auto;
  display: grid;
  gap: 5px;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  overflow: visible;
}
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame {
  align-self: start;
  aspect-ratio: var(--asset-ratio, 4 / 3);
  height: auto;
  left: auto;
  position: relative;
  top: auto;
  width: 100%;
}
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame:nth-child(6n + 1) { grid-column: span 5; }
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame:nth-child(6n + 2) { grid-column: span 7; }
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame:nth-child(6n + 3) { grid-column: span 4; }
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame:nth-child(6n + 4) { grid-column: span 8; }
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame:nth-child(6n + 5) { grid-column: span 7; }
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame:nth-child(6n) { grid-column: span 5; }
.mobile-project-overview-canvas.has-auto-desktop-layout .gallery-overview-frame img { object-fit: cover; }

@keyframes galleryImageIn {
  from { opacity: 0; transform: translateX(14px); }
  to { opacity: 1; transform: translateX(0); }
}

@keyframes galleryImageInLeft {
  from { opacity: 0; transform: translateX(-14px); }
  to { opacity: 1; transform: translateX(0); }
}

.floating-contact {
  background: var(--ink);
  bottom: 24px;
  color: var(--paper);
  font-size: 13px;
  font-weight: 400;
  padding: 11px 16px;
  position: fixed;
  right: 24px;
  z-index: 45;
}

.floating-contact:hover { background: var(--accent); color: #1A1A1A; }

.about-layout {
  align-items: center;
  display: grid;
  gap: clamp(34px, 7vw, 100px);
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
}

.about-portrait {
  aspect-ratio: 4 / 5;
  background: var(--card);
  overflow: hidden;
}

.about-portrait img {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.about-copy {
  display: grid;
  gap: 22px;
}

.about-points,
.brand-wall,
.contact-grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.about-points span,
.brand-wall span {
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
  padding-top: 12px;
}

.brand-wall {
  margin-top: clamp(56px, 8vw, 110px);
}

.contact-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: clamp(42px, 6vw, 76px);
}

.contact-grid article {
  border-top: 1px solid var(--line);
  display: grid;
  gap: 10px;
  padding-top: 18px;
}

.contact-grid span {
  color: var(--muted);
  font-size: 12px;
}

.contact-grid a,
.contact-grid p {
  color: var(--ink);
  font-size: clamp(18px, 2vw, 28px);
  font-weight: 400;
  margin: 0;
  overflow-wrap: anywhere;
}

.contact-form {
  display: grid;
  gap: 14px;
  margin-top: clamp(48px, 7vw, 92px);
  max-width: 720px;
}

.contact-form input,
.contact-form textarea {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--ink);
  min-height: 52px;
  padding: 12px 0;
}

.contact-form textarea {
  min-height: 120px;
  resize: vertical;
}

.contact-form button {
  background: var(--ink);
  border: 0;
  color: var(--paper);
  justify-self: start;
  min-height: 44px;
  padding: 0 20px;
}
.contact-honeypot { left: -9999px; position: absolute; }
#contact-form-status { color: var(--muted); font-size: 12px; line-height: 1.5; margin: 0; min-height: 18px; }

.placeholder-visual {
  background: var(--card);
  border: 0;
  color: var(--muted);
  min-height: 280px;
}

.placeholder-label,
.placeholder-index { color: var(--ink); }
.placeholder-mark { border-color: var(--line); }

@media (max-width: 920px) {
  .site-nav { gap: 18px; }
  .album-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .album-card,
  .album-card:nth-child(4n + 1),
  .album-card:nth-child(4n + 2),
  .album-card:nth-child(4n + 3),
  .album-card:nth-child(4n + 4),
  .album-card[class*='album-layout-'] { grid-column: auto; margin-top: 0; }
  .album-grid.is-canvas-layout { display: grid; min-height: 0; position: static; }
  .album-grid.is-canvas-layout .album-card { left: auto; position: static; top: auto; width: auto; }
  .about-layout,
  .contact-grid { grid-template-columns: 1fr; }
  .about-points,
  .brand-wall { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 700px) {
  html { scroll-snap-type: none; }
  .site-header {
    height: 64px;
    padding: 0 18px;
  }
  .wordmark { font-size: 24px; }
  .site-nav {
    display: none;
  }
  .admin-link { display: none; }
  .home-hero {
    min-height: 100svh;
    padding-top: 64px;
  }
  .immersive-hero .hero-copy { padding-bottom: 174px; }
  .immersive-entry { bottom: 30px; left: 22px; right: auto; }
  .immersive-entry strong { font-size: 30px; }
  .immersive-slide { padding: 64px 22px 30px; }
  .immersive-hero .hero-copy { padding: 0 0 126px; }
  .immersive-category-copy { left:var(--category-mobile-title-x,7%);padding:0;top:var(--category-mobile-title-y,74%); }
  .immersive-category-copy h2 { font-size: clamp(56px, 17vw, 102px); line-height: .94; margin: 12px 0; }
  .immersive-category-copy small { margin-top: 24px; }
  .home-domino-stage {
    height: 100svh;
    min-height: 0;
    padding: 80px 18px 22px;
  }
  .domino-handoff-copy {
    bottom: 152px;
    left: 22px;
    right: 22px;
  }
  .domino-handoff-copy h2 { font-size: clamp(56px, 12vw, 102px); line-height: .94; margin: 12px 0; }
  .domino-handoff-copy small { margin-top: 24px; }
  .home-domino-heading {
    align-items: start;
    gap: 8px 12px;
    grid-template-columns: 1fr auto;
  }
  .home-domino-heading span { grid-column: 1; }
  .home-domino-heading p { grid-column: 2; grid-row: 1; }
  .home-domino-heading h2 {
    font-size: clamp(38px, 11vw, 64px);
    grid-column: 1 / -1;
    line-height: .88;
  }
  .home-domino-rule { margin-top: 16px; }
  .home-domino-grid {
    bottom: 66px;
    gap: 12px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    left: 18px;
    right: 18px;
  }
  .domino-category-card,
  .domino-category-card:nth-child(2n) { gap: 7px; margin-bottom: 0; }
  .domino-card-media { aspect-ratio: 4 / 3; }
  .domino-card-copy { gap: 8px; padding-top: 7px; }
  .domino-card-copy strong { font-size: clamp(15px, 4.2vw, 22px); }
  .home-domino-complete { bottom: 22px; font-size: 8px; }
  .home-photographer-contact {
    display: block;
    min-height: 0;
    padding: 82px 18px 64px;
  }
  .home-photographer-portrait { min-height: 48svh; }
  .home-photographer-copy { margin-top: 42px; }
  .home-photographer-copy > span { display: block; margin-bottom: 22px; }
  .home-photographer-copy h2 { font-size: clamp(68px, 24vw, 112px); line-height: .88; margin-bottom: 28px; }
  .home-photographer-copy > p { font-size: 14px; line-height: 1.8; }
  .home-photographer-links { border-top: 0; display: grid; gap: 20px; grid-template-columns: 1fr; margin-top: 34px; padding-top: 0; }
  .home-photographer-links a,
  .home-photographer-links p { display: block; font-size: 16px; letter-spacing: .06em; line-height: 1.65; margin: 0; white-space: nowrap; }
  .home-photographer-links small { display: inline; font-size: inherit; margin-right: .55ch; }
  .home-photographer-links small::after { content: '：'; }
  .home-photographer-more { margin-top: 38px; }
  .immersive-swipe-hint { bottom: 24px; }
  .hero-copy {
    max-width: none;
    padding: 0 22px 44px;
  }
  .hero-copy h1 {
    font-size: clamp(92px, 28vw, 220px);
    line-height: .8;
  }
  .hero-layout-poster-peak .hero-media,
  .immersive-hero.hero-layout-poster-peak .hero-media { inset: 0; }
  .hero-layout-poster-peak .hero-copy h1 { font-size: clamp(142px, 43vw, 230px); left: var(--hero-mobile-title-x, 7%); top: var(--hero-mobile-title-y, 31%); transform:scale(var(--hero-mobile-title-scale,1)); transform-origin:left center; -webkit-text-stroke-width: 1.3px; }
  .hero-layout-poster-peak .hero-statement { bottom: auto; font-size: 10px; left: var(--hero-mobile-statement-x, clamp(26px, 7vw, 108px)); top: var(--hero-mobile-statement-y, 55%); }
  .hero-statement-label { gap: 14px; margin-bottom: 11px; }
  .hero-statement-label strong { font-size: 20px; }
  .hero-statement-label i { width: 80px; }
  .hero-poster-brand {
    font-size: 18px;
    left: 18px;
    mix-blend-mode: difference;
    pointer-events: none;
    position: fixed;
    top: 23px;
    z-index: 41;
  }
  .hero-poster-role { font-size: 9px; right: 30px; top: 34px; }
  .hero-poster-scroll { bottom: 28px; left: clamp(26px, 7vw, 108px); }
  .hero-statement { font-size: 14px; margin-top: 27px; }
  .hero-topline { font-size: 12px; left: 22px; right: 22px; top: 92px; }
  .category-panel {
    clip-path: inset(0);
    min-height: 100svh;
    opacity: 1;
    padding: 84px 22px;
    transform: none;
    transition: none;
  }
  .category-panel-copy h2 {
    font-size: 52px;
  }
  .category-panel-copy {
    left: var(--category-mobile-title-x, 7%);
    top: var(--category-mobile-title-y, 74%);
  }
  .home-contact-details { gap: 22px; grid-template-columns: 1fr; margin-top: 46px; }
  .portfolio-page,
  .info-page {
    padding: 92px 20px 72px;
  }
  .category-switcher {
    flex-wrap: nowrap;
    margin-bottom: 48px;
    overflow-x: auto;
    padding-bottom: 8px;
    scrollbar-width: none;
  }
  .category-switcher::-webkit-scrollbar { display: none; }
  .category-switcher a { flex: 0 0 auto; }
  .category-archive .category-switcher { padding-bottom: 12px; }
  .category-masthead {
    gap: 20px 12px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin-top: 24px;
    padding-bottom: 30px;
  }
  .category-masthead-issue {
    display: flex;
    grid-column: 1 / -1;
    justify-content: space-between;
    padding: 0;
  }
  .category-masthead-title { grid-column: 1 / -1; }
  .category-masthead-title p { margin-bottom: 10px; }
  .category-masthead-title h1 {
    font-size: clamp(42px, 10vw, 68px);
    line-height: .96;
  }
  .category-masthead-note {
    border-left: 0;
    border-top: 1px solid var(--line);
    display: block;
    grid-column: 1 / -1;
    min-width: 0;
    padding: 14px 0 0;
  }
  .category-masthead-note > * { display: block; max-width: none; }
  .category-masthead-note p { margin-top: 8px; text-align: left; }
  .album-grid {
    display: block;
    margin-top: 34px;
    padding: 22px 4px 68px;
  }
  .album-card,
  .album-card:nth-child(n) {
    border: 0;
    display: block;
    grid-column: auto;
    margin: 0 0 17vw;
    padding: 0;
  }
  .album-card:nth-child(n) .album-cover,
  .album-cover { aspect-ratio: var(--album-cover-ratio, 3 / 4); }
  .album-meta { display: none; }

  .album-card:nth-child(6n + 1) { margin-left: 0; width: 39%; }
  .album-card:nth-child(6n + 2) { margin-left: auto; width: 46%; }
  .album-card:nth-child(6n + 3) { margin-left: 9%; width: 56%; }
  .album-card:nth-child(6n + 4) { margin-left: auto; width: 38%; }
  .album-card:nth-child(6n + 5) { margin-left: 35%; width: 27%; }
  .album-card:nth-child(6n) { margin-left: auto; width: 49%; }
  .album-grid.is-canvas-layout { display: block; }
  .album-grid.is-canvas-layout .album-card:nth-child(n) { margin-bottom: 17vw; }
  .album-grid.is-canvas-layout .album-card:nth-child(6n + 1) { margin-left: 0; width: 39%; }
  .album-grid.is-canvas-layout .album-card:nth-child(6n + 2) { margin-left: auto; width: 46%; }
  .album-grid.is-canvas-layout .album-card:nth-child(6n + 3) { margin-left: 9%; width: 56%; }
  .album-grid.is-canvas-layout .album-card:nth-child(6n + 4) { margin-left: auto; width: 38%; }
  .album-grid.is-canvas-layout .album-card:nth-child(6n + 5) { margin-left: 35%; width: 27%; }
  .album-grid.is-canvas-layout .album-card:nth-child(6n) { margin-left: auto; width: 49%; }
  .album-grid.is-mobile-canvas-layout { display: block; min-height: 210svh; position: relative; }
  .album-grid.is-mobile-canvas-layout .album-card,
  .album-grid.is-mobile-canvas-layout .album-card:nth-child(n) { left: var(--mobile-listing-x); margin: 0; position: absolute; top: var(--mobile-listing-y); width: var(--mobile-listing-size); }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid {
    display: block;
    min-height: 0;
    position: static;
  }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid .album-card:nth-child(n) {
    left: auto;
    position: relative;
    top: auto;
  }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid .album-card:nth-child(6n + 1) { margin: 0 0 17vw; width: 39%; }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid .album-card:nth-child(6n + 2) { margin: 0 0 17vw auto; width: 46%; }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid .album-card:nth-child(6n + 3) { margin: 0 0 17vw 9%; width: 56%; }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid .album-card:nth-child(6n + 4) { margin: 0 0 17vw auto; width: 38%; }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid .album-card:nth-child(6n + 5) { margin: 0 0 17vw 35%; width: 27%; }
  .album-grid.is-mobile-canvas-layout.has-auto-project-grid .album-card:nth-child(6n) { margin: 0 0 17vw auto; width: 49%; }
  .gallery-page { grid-template-rows: 68px 1fr; }
  .gallery-topbar,
  .gallery-actions {
    grid-template-columns: 1fr auto;
    padding: 0 18px;
  }
  .gallery-topbar p {
    grid-column: 1 / -1;
    justify-self: start;
    margin-top: -16px;
  }
  .gallery-top-actions { gap: 12px; }
  .gallery-stage {
    padding: 12px 14px;
  }
  .gallery-image-shell,
  .gallery-image {
    max-height: calc(100svh - 170px);
  }
  .gallery-actions > :first-child,
  .gallery-actions > :last-child { justify-self: auto; }
  .gallery-actions { display: flex; justify-content: space-between; }
  .gallery-overview { grid-template-rows: 64px auto; padding: 0 12px 12px; }
  .gallery-overview-head { grid-template-columns: 1fr auto; padding: 0 6px; }
  .gallery-overview-head p { display: none; }
  .gallery-overview-canvas { aspect-ratio: var(--project-mobile-canvas-ratio, 18 / 77); min-height: 0; }
  .gallery-overview-frame { height: var(--mobile-layout-h); left: var(--mobile-layout-x); top: var(--mobile-layout-y); width: var(--mobile-layout-w); }
  .theme-direct-canvas .gallery-overview-frame[style*='--asset-ratio'] { height: var(--mobile-layout-h) !important; }
  .mobile-project-overview-canvas.has-auto-mobile-layout {
    aspect-ratio: auto;
    background: transparent;
    display: grid;
    gap: 3px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
  }
  .mobile-project-overview-canvas.has-auto-mobile-layout .gallery-overview-frame:nth-child(n) {
    aspect-ratio: var(--asset-ratio, 3 / 4);
    grid-column: auto;
    height: auto;
    left: auto;
    margin: 0;
    position: relative;
    top: auto;
    width: 100%;
  }
  .mobile-project-overview-canvas.has-auto-mobile-layout .gallery-overview-frame:nth-child(6n + 1),
  .mobile-project-overview-canvas.has-auto-mobile-layout .gallery-overview-frame:nth-child(6n + 4) {
    grid-column: 1 / -1;
  }
  .mobile-project-overview-canvas.has-auto-mobile-layout .gallery-overview-frame img {
    object-fit: cover;
  }
  .category-magazine-flow { display:block; padding:0 18px; }.magazine-block { margin-bottom:22px; }.template-auto,.template-single-space { margin-left:0; width:100%; }.template-auto .magazine-photo.is-portrait,.template-single-space .magazine-photo { margin-left:auto; max-width:80%; }.template-big-small,.template-portrait-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }.template-triptych { display:grid; gap:7px; grid-template-columns:repeat(3,minmax(0,1fr)); }.template-note-page { display:grid; grid-template-columns:1fr; }.template-note-page aside { margin-left:15%; width:85%; }.template-landscape-pair,.template-portrait-story,.template-portrait-landscape-mix,.template-contact-sheet,.template-wide-detail,.template-staggered { display:grid; grid-template-columns:1fr; }.template-portrait-story .magazine-photo:first-child,.template-wide-detail .magazine-photo:first-child,.template-wide-detail .magazine-photo:last-child { grid-column:auto; grid-row:auto; }.template-portrait-story .magazine-photo:not(:first-child),.template-wide-detail .magazine-photo:last-child { justify-self:auto; max-width:82%; }.template-staggered .magazine-photo:nth-child(n) { margin-top:0; }.category-meta-form { grid-template-columns:1fr; }
  /* Public mobile flow keeps the same constrained editorial groups as the admin phone preview. */
  .template-landscape-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.template-portrait-story{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);grid-template-rows:auto auto}.template-portrait-story .magazine-photo:first-child{align-self:center;grid-row:1 / span 2}.template-portrait-story .magazine-photo:not(:first-child){justify-self:end;max-width:88%}.template-portrait-landscape-mix{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.template-portrait-landscape-mix .magazine-photo:last-child{align-self:auto;grid-column:1 / -1}.template-contact-sheet{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.template-wide-detail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.template-wide-detail .magazine-photo:first-child{grid-column:1 / -1;grid-row:auto}.template-wide-detail .magazine-photo:last-child{grid-column:2;grid-row:auto;justify-self:end;max-width:86%}.template-staggered{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.template-staggered .magazine-photo:nth-child(2){margin-top:14px}.template-staggered .magazine-photo:nth-child(3){grid-column:1 / -1;justify-self:center;margin-top:8px;max-width:74%}
  .template-editorial-duo,.template-hero-stack,.template-spec-board,.template-look-compare,.template-product-orbit{display:grid;gap:clamp(6px,2vw,10px);padding:clamp(12px,4vw,20px)}.template-editorial-duo{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)}.template-editorial-duo .magazine-photo:first-child{padding:clamp(6px,2vw,10px)}.template-hero-stack{grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);grid-template-rows:auto auto}.template-hero-stack .magazine-photo:first-child{grid-row:1 / span 2}.template-hero-stack .magazine-photo:not(:first-child){width:92%}.template-spec-board{grid-template-columns:repeat(3,minmax(0,1fr))}.template-spec-board .magazine-photo:first-child{grid-column:1 / -1;grid-row:auto}.template-spec-board .magazine-photo:nth-child(n+2){grid-column:auto}.template-look-compare{grid-template-columns:1fr;padding-left:clamp(56px,17vw,78px)}.template-look-compare .magazine-photo{max-width:88%}.template-look-compare .magazine-captions span{left:clamp(14px,5vw,24px)}.template-product-orbit{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto auto}.template-product-orbit .magazine-photo:first-child{grid-column:1 / -1}.template-product-orbit .magazine-photo:nth-child(2),.template-product-orbit .magazine-photo:nth-child(3){grid-column:auto;grid-row:2;margin-top:clamp(12px,4vw,20px)}.magazine-captions{font-size:clamp(9px,2.5vw,11px)}
  .category-overview-grid{grid-template-columns:1fr}.theme-layout-desk,.theme-layout-preview{grid-template-columns:1fr}.theme-photo-list{border-bottom:1px solid var(--line);border-right:0;display:flex;max-height:none;overflow:auto;padding:0 0 10px}.theme-photo-list button{flex:0 0 128px;grid-template-columns:38px 18px 1fr}.theme-photo-list img{height:38px;width:38px}.theme-layout-controls{border-left:0;border-top:1px solid var(--line);padding:14px 0 0}.theme-preview-device{min-height:260px}.category-info-form>div,.category-cover-desk>div{grid-template-columns:repeat(2,minmax(0,1fr))}.category-cover-desk>.category-cover-slots{grid-template-columns:1fr}.category-breadcrumb{font-size:10px}.category-breadcrumb button:last-child{padding-left:8px}.category-workbench-tabs{overflow-x:auto}.category-workbench-tabs button{flex:0 0 auto}
  .site-settings-entry{bottom:max(14px,env(safe-area-inset-bottom));right:14px}
  .floating-contact {
    bottom: 16px;
    right: 16px;
  }
  .about-points,
  .brand-wall { grid-template-columns: 1fr; }
  .contact-form button {
    width: 100%;
  }
}

@media (max-width:700px){.category-identity-bar{grid-template-columns:1fr 1fr}.category-identity-bar button{grid-column:1/-1;justify-self:start}.dual-cover-modal{align-items:start;overflow:auto;padding:12px}.dual-cover-dialog{max-height:none;min-height:calc(100svh - 24px);padding:16px}.dual-cover-slots{grid-template-columns:1fr}.dual-cover-preview{min-height:150px}.dual-cover-library>div{grid-template-columns:repeat(3,minmax(0,1fr))}}

@media (max-width:700px){#app>.site-header.is-home-transparent{background:transparent!important;border-color:transparent!important;box-shadow:none!important}#immersive-stage,#immersive-stage .immersive-slide{height:100svh;height:100dvh;min-height:100svh;min-height:100dvh}.immersive-home .hero-media{inset:0}.immersive-home .category-cover-picture{min-height:100svh;min-height:100dvh}#immersive-stage .immersive-category-cover .hero-media,#immersive-stage .immersive-category-cover .category-cover-picture,#immersive-stage .immersive-category-cover .category-cover-picture img{bottom:0!important;height:100svh!important;height:100dvh!important;min-height:100svh!important;min-height:100dvh!important;top:0!important;width:100%!important}}

/* Keep the poster wordmark hollow even when global light or dark theme rules
   assign a solid heading color later in the stylesheet. */
:root[data-theme='light'] .hero-layout-poster-peak .hero-copy h1,
:root[data-theme='dark'] .hero-layout-poster-peak .hero-copy h1 {
  color: rgba(3, 10, 13, .16) !important;
  filter: drop-shadow(0 2px 7px rgba(0, 0, 0, .42));
  -webkit-text-fill-color: rgba(3, 10, 13, .16) !important;
  -webkit-text-stroke: clamp(1.5px, .14vw, 2.5px) rgba(255, 255, 255, .96) !important;
  paint-order: stroke fill;
}

/* The desktop homepage remains cinematic. Phones use normal document scrolling
   and only composite opacity/transforms, which stays smooth in WeChat WebView. */
@media (max-width:760px) {
  /* Fallback for mobile: category covers must remain in document flow after Hero. */
  #immersive-stage.immersive-home {
    height: auto;
    min-height: 0;
    overflow: visible;
  }
  #immersive-stage.immersive-home .immersive-slide {
    display: grid;
    height: 100svh;
    height: 100dvh;
    inset: auto;
    min-height: 100svh;
    min-height: 100dvh;
    opacity: 1 !important;
    pointer-events: auto;
    position: relative;
    transform: none !important;
  }
  #immersive-stage.immersive-home .immersive-category-cover,
  #immersive-stage.immersive-home .immersive-category-cover.is-before,
  #immersive-stage.immersive-home .immersive-category-cover.is-after {
    clip-path: none;
  }
  .immersive-home.is-mobile-home-flow {
    height: auto;
    min-height: 0;
    overflow: visible;
  }
  .immersive-home.is-mobile-home-flow::before,
  .immersive-home.is-mobile-home-flow::after,
  .immersive-home.is-mobile-home-flow .category-cover-backdrop { display: none; }
  .immersive-home.is-mobile-home-flow .immersive-slide,
  #immersive-stage.is-mobile-home-flow .immersive-slide {
    display: grid;
    height: 100svh;
    height: 100dvh;
    inset: auto;
    min-height: 100svh;
    min-height: 100dvh;
    opacity: 1;
    pointer-events: auto;
    position: relative;
    transform: none;
    transition: none;
  }
  .immersive-home.is-mobile-home-flow .immersive-slide::after {
    background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.08) 36%, rgba(0,0,0,.8));
  }
  .immersive-home.is-mobile-home-flow .immersive-category-cover,
  .immersive-home.is-mobile-home-flow .immersive-category-cover.is-before,
  .immersive-home.is-mobile-home-flow .immersive-category-cover.is-after {
    clip-path: none;
    opacity: 1;
    transform: none;
  }
  .immersive-home.is-mobile-home-flow .hero-media {
    will-change: auto;
  }
  .immersive-home.is-mobile-home-flow .hero-media img {
    filter: none;
    transform: scale(1.025);
  }
  .immersive-home.is-mobile-home-flow .immersive-category-copy,
  .immersive-home.is-mobile-home-flow .immersive-swipe-hint {
    opacity: 0;
    transform: translate3d(0, 16px, 0);
    transition: opacity .28s ease-out, transform .28s ease-out;
  }
  .immersive-home.is-mobile-home-flow .is-mobile-visible .immersive-category-copy,
  .immersive-home.is-mobile-home-flow .is-mobile-visible .immersive-swipe-hint {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  .immersive-home.is-mobile-home-flow .immersive-hero .hero-copy h1,
  .immersive-home.is-mobile-home-flow .immersive-hero .hero-copy p { animation: none; }
}

.hero-layout-launcher{background:var(--card);border:1px solid var(--line);color:var(--ink);cursor:pointer;display:grid;gap:7px;margin-top:16px;overflow:hidden;padding:0 0 12px;text-align:left;width:100%}.hero-layout-launcher:hover,.hero-layout-launcher:focus-visible{border-color:var(--ink);outline:0}.hero-layout-launcher img,.hero-layout-launcher>span{aspect-ratio:1.72;display:block;object-fit:cover;width:100%}.hero-layout-launcher>span{align-items:center;background:linear-gradient(135deg,#121820,#56606c);color:#fff;display:flex;font:42px var(--display);justify-content:center}.hero-layout-launcher b,.hero-layout-launcher small{padding:0 12px}.hero-layout-launcher b{font-size:12px}.hero-layout-launcher small{color:var(--muted);font-size:10px}.hero-layout-dialog{max-width:850px}.hero-layout-tools{align-items:end;border-bottom:1px solid var(--line);display:flex;gap:14px;justify-content:space-between;padding:16px 0}.hero-layout-tools label{display:grid;font-size:11px;gap:6px}.hero-layout-tools select{background:var(--paper);border:1px solid var(--line);color:var(--ink);height:34px;min-width:170px;padding:0 8px}.hero-device-switch{display:flex;gap:6px}.hero-device-switch button{background:var(--paper);border:1px solid var(--line);color:var(--ink);font-size:11px;height:34px;padding:0 12px}.hero-device-switch button.is-active{background:var(--ink);color:var(--paper)}.hero-layout-artboard{--hero-title-x:7%;--hero-title-y:32%;aspect-ratio:16/9;background:#101419 var(--hero-preview-image) center/cover no-repeat;margin:18px auto 0;max-width:100%;overflow:hidden;position:relative;width:100%}.hero-layout-artboard[data-device='mobile']{aspect-ratio:9/16;max-width:330px}.hero-layout-artboard::after{background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.5));content:'';inset:0;pointer-events:none;position:absolute}.hero-layout-artboard-label{background:rgba(0,0,0,.48);color:#fff;font:10px var(--mono);left:10px;letter-spacing:.12em;padding:5px 6px;position:absolute;top:10px;z-index:2}.hero-layout-draggable-title{background:transparent;border:0;color:rgba(3,10,13,.2);cursor:grab;font:400 clamp(88px,18vw,220px)/.8 'Bebas Neue','Oswald',Impact,sans-serif;left:var(--hero-title-x);letter-spacing:-.02em;padding:0;position:absolute;text-shadow:0 2px 7px rgba(0,0,0,.42);top:var(--hero-title-y);transform:translateY(-50%);-webkit-text-fill-color:rgba(3,10,13,.2);-webkit-text-stroke:1px rgba(255,255,255,.96);touch-action:none;z-index:3}.hero-layout-artboard[data-device='mobile'] .hero-layout-draggable-title{font-size:clamp(82px,31vw,135px)}.hero-layout-draggable-title:active{cursor:grabbing}.hero-coordinate-readout{align-items:center;color:var(--muted);display:flex;font:11px var(--mono);gap:16px;padding:12px 0}.hero-coordinate-readout b{color:var(--ink);font-weight:500}.hero-coordinate-readout small{font:10px var(--body);margin-left:auto}.hero-layout-dialog footer,.category-cover-motion>header{align-items:center;border-top:1px solid var(--line);display:flex;gap:14px;justify-content:space-between;padding-top:16px}.hero-layout-dialog footer span{color:var(--muted);font-size:10px;line-height:1.5}.hero-layout-dialog footer button,.category-cover-motion button{background:var(--ink);border:0;color:var(--paper);font-size:11px;min-height:36px;padding:0 14px}.category-cover-motion{border-top:1px solid var(--line);padding:16px 0}.category-cover-motion>header{border:0;padding:0}.category-cover-motion header>div{display:grid;gap:4px}.category-cover-motion strong{font:12px var(--mono)}.category-cover-motion small{color:var(--muted);font-size:10px}.category-cover-motion>div{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:12px}.category-cover-motion label{display:grid;font-size:10px;gap:6px}.category-cover-motion select{background:var(--paper);border:1px solid var(--line);color:var(--ink);height:34px;padding:0 8px}

.hero-layout-launcher img,.hero-layout-launcher>span{aspect-ratio:4/3}.hero-layout-artboard[data-layout='classic'] .hero-layout-draggable-title{color:#fff;font-family:var(--display);font-size:clamp(88px,16vw,190px);font-weight:600;letter-spacing:0;text-shadow:0 3px 15px rgba(0,0,0,.4);-webkit-text-fill-color:#fff;-webkit-text-stroke:0}.hero-layout-artboard[data-layout='classic'] .hero-layout-draggable-title::after{background:#d5ff24;content:'';display:inline-block;height:.14em;margin:0 0 .03em .08em;width:.14em}.dual-cover-preview{position:relative}.dual-cover-draggable-title{background:transparent;border:0;color:#fff;cursor:grab;left:var(--category-title-x,7%);padding:0;position:absolute;text-align:left;text-shadow:0 2px 10px rgba(0,0,0,.72);top:var(--category-title-y,78%);touch-action:none;transform:translateY(-50%);z-index:2}.dual-cover-draggable-title strong{display:block;font-family:'Source Han Serif SC','Noto Serif SC',serif;font-size:clamp(28px,4vw,54px);font-weight:500;line-height:.9}.dual-cover-draggable-title span{display:block;font:600 11px var(--mono);letter-spacing:.12em;margin-top:7px}.dual-cover-draggable-title:active{cursor:grabbing}.category-cover-title-controls{align-items:center;border-top:1px solid var(--line);display:flex;gap:16px;justify-content:space-between;padding:16px 0}.category-cover-title-controls div{display:grid;gap:4px}.category-cover-title-controls strong{font:12px var(--mono)}.category-cover-title-controls small{color:var(--muted);font-size:10px}.category-cover-title-controls button{background:var(--ink);border:0;color:var(--paper);font-size:11px;min-height:36px;padding:0 14px}

.dual-cover-slot[data-cover-device='desktop'] .dual-cover-preview{aspect-ratio:16/9;min-height:0}.dual-cover-slot[data-cover-device='desktop'] .dual-cover-preview img{height:100%;max-height:none;object-fit:cover;width:100%}.dual-cover-slot[data-cover-device='mobile'] .dual-cover-preview{aspect-ratio:9/16;margin-left:auto;margin-right:auto;max-width:55%;min-height:0}.dual-cover-slot[data-cover-device='mobile'] .dual-cover-preview img{height:100%;max-height:none;object-fit:cover;width:100%}.dual-cover-draggable-title h2{color:#fff;font-family:'Source Han Serif SC','Noto Serif SC','Songti SC',serif;font-size:clamp(30px,4.5vw,58px);font-weight:500;letter-spacing:.035em;line-height:.9;margin:0}.dual-cover-draggable-title p{color:#fff;font:600 11px var(--mono);letter-spacing:.12em;line-height:1.2;margin:8px 0 0}.hero-layout-artboard .hero-layout-draggable-title{transform:translateY(-50%) scale(var(--hero-title-scale,1));transform-origin:left center}.hero-layout-preview-copy{bottom:auto;color:#fff;display:none;font:500 11px/1.55 var(--mono);gap:2px;left:7%;letter-spacing:.12em;position:absolute;text-shadow:0 1px 8px rgba(0,0,0,.48);top:64%;z-index:3}.hero-layout-preview-copy strong{align-items:center;display:flex;font-family:var(--heading);font-size:20px;font-weight:500;gap:14px;letter-spacing:.08em;margin-bottom:10px}.hero-layout-preview-copy strong i{border-top:1px solid rgba(255,255,255,.65);width:72px}.hero-layout-preview-copy span{display:block}.hero-layout-preview-copy b{font:500 10px/1.5 var(--mono);letter-spacing:.1em;margin-top:7px}.hero-layout-preview-scroll{bottom:28px;color:rgba(255,255,255,.92);display:none;font:500 9px/1 var(--mono);left:7%;letter-spacing:.18em;position:absolute;transform:rotate(180deg);writing-mode:vertical-rl;z-index:3}.hero-layout-artboard[data-layout='poster-peak'] .hero-layout-preview-copy,.hero-layout-artboard[data-layout='poster-peak'] .hero-layout-preview-scroll{display:grid}.hero-layout-artboard[data-layout='poster-peak'] .hero-layout-preview-scroll{display:block}.hero-coordinate-readout label{align-items:center;display:flex;gap:6px}.hero-coordinate-readout input[type='range']{accent-color:var(--ink);width:110px}

/* The cover editor borrows the public immersive category-cover composition.
   Only the artboard scale changes between editor and portfolio. */
.dual-cover-preview { container-type: size; }
.dual-cover-draggable-title { display: grid; gap: clamp(5px, 1.1cqh, 14px); max-width: 76%; font: inherit; }
.dual-cover-draggable-title span,
.dual-cover-draggable-title p { color: #fff; font: 500 clamp(8px, 1.5cqw, 22px)/1.25 'PingFang SC', 'Microsoft YaHei', sans-serif; letter-spacing: .14em; margin: 0; text-shadow: 0 2px 12px rgba(0,0,0,.72); }
.dual-cover-draggable-title span { align-items: center; display: flex; gap: 10px; }
.dual-cover-draggable-title span::after { display: none; }
.dual-cover-draggable-title > span { color: #fff; font: 500 clamp(6px, 1.1cqw, 11px)/1 var(--mono); letter-spacing: .09em; margin: 0; text-shadow: 0 2px 12px rgba(0,0,0,.72); }
.dual-cover-draggable-title h2 { color: #fff; font-family: 'Oswald', 'Arial Narrow', sans-serif; font-size: clamp(30px, 15cqh, 204px); font-weight: 700; letter-spacing: 0; line-height: .92; margin: 0; text-shadow: 0 2px 2px rgba(0,0,0,.72), 0 10px 28px rgba(0,0,0,.56), 0 22px 44px rgba(0,0,0,.22); text-transform: uppercase; }
.dual-cover-draggable-title p { text-transform: none; }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-draggable-title { gap: clamp(3px, .8cqh, 9px); }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-draggable-title h2 { font-size: clamp(24px, 12cqw, 102px); }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-draggable-title p { font-size: clamp(7px, 1.15cqw, 18px); }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-draggable-title > span { font-size: clamp(5px, .85cqw, 10px); }
.dual-cover-header-actions { align-items: flex-start; display: flex; gap: 14px; }
.category-cover-title-save-top { background: var(--ink); border: 0; color: var(--paper); font-size: 11px; min-height: 36px; padding: 0 14px; white-space: nowrap; }

/* The Hero cover picker is also its live layout board. These layers reuse the
   public poster composition so choosing an image never hides the typography
   that will sit on top of it on the real page. */
.hero-cover-layout-controls { align-items: end; border-bottom: 1px solid var(--line); display: flex; gap: 18px; justify-content: space-between; padding: 14px 0; }
.hero-cover-layout-controls label { color: var(--muted); display: grid; font: 10px var(--mono); gap: 6px; }
.hero-cover-layout-controls select { background: var(--paper); border: 1px solid var(--line); color: var(--ink); height: 34px; min-width: 154px; padding: 0 8px; }
.hero-cover-layout-controls p { color: var(--muted); font-size: 10px; line-height: 1.5; margin: 0; max-width: 390px; }
.hero-dual-cover-preview { background: #101419; container-type: size; isolation: isolate; }
.hero-dual-cover-preview > img { height: 100%; inset: 0; max-height: none; object-fit: cover; position: absolute; width: 100%; z-index: 0; }
.hero-dual-cover-preview::after { background: linear-gradient(180deg, rgba(0,0,0,.08), rgba(0,0,0,.52)); content: ''; inset: 0; pointer-events: none; position: absolute; z-index: 1; }
.dual-cover-hero-draggable-title { background: transparent; border: 0; color: rgba(3,10,13,.18); cursor: grab; font: 400 clamp(70px, 28cqw, 104px)/.8 'Bebas Neue', 'Oswald', sans-serif; left: var(--hero-title-x, 7%); letter-spacing: -.018em; padding: 0; position: absolute; text-align: left; text-shadow: none; top: var(--hero-title-y, 32%); touch-action: none; transform: scale(var(--hero-title-scale, 1)); transform-origin: left center; -webkit-text-fill-color: rgba(3,10,13,.18); -webkit-text-stroke: 1px rgba(255,255,255,.88); z-index: 3; }
.dual-cover-hero-draggable-title:active { cursor: grabbing; }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-hero-draggable-title { font-size: clamp(72px, 43cqw, 88px); -webkit-text-stroke-width: 1.3px; }
.dual-cover-hero-preview-copy { bottom: auto; color: #fff; cursor: grab; display: none; font: 500 max(3px, .634cqw)/1.55 var(--mono); gap: .5px; left: var(--hero-statement-x, 4.89%); letter-spacing: .12em; position: absolute; text-shadow: 0 1px 8px rgba(0,0,0,.48); top: var(--hero-statement-y, 64%); touch-action: none; user-select: none; z-index: 3; }
.dual-cover-hero-preview-copy strong { align-items: center; display: flex; font-family: var(--heading); font-size: max(6px, 1.358cqw); font-weight: 500; gap: max(4px, .815cqw); letter-spacing: .08em; margin-bottom: max(3px, .589cqw); }
.dual-cover-hero-preview-copy strong i { border-top: 1px solid rgba(255,255,255,.65); width: clamp(24px, 8.6cqw, 40px); }
.hero-dual-cover-preview .dual-cover-hero-preview-copy span { color: inherit; display: block; font: inherit; letter-spacing: inherit; line-height: inherit; white-space: nowrap; }
.dual-cover-hero-preview-copy b { font: 500 max(3px, .589cqw)/1.5 var(--mono); letter-spacing: .1em; margin-top: max(2px, .362cqw); }
.hero-dual-cover-preview .dual-cover-hero-preview-copy,
.hero-dual-cover-preview .dual-cover-hero-preview-copy strong,
.hero-dual-cover-preview .dual-cover-hero-preview-copy span,
.hero-dual-cover-preview .dual-cover-hero-preview-copy b { color: #fff !important; }
.dual-cover-hero-preview-copy:active { cursor: grabbing; }
.hero-dual-cover-preview .dual-cover-hero-preview-scroll { bottom: 5%; color: rgba(255,255,255,.92); display: none; font: 500 max(3px, .453cqw)/1 var(--mono); left: 4.89%; letter-spacing: .18em; position: absolute; transform: rotate(180deg); writing-mode: vertical-rl; z-index: 3; }
.hero-dual-cover-preview[data-hero-layout='poster-peak'] .dual-cover-hero-preview-copy { display: grid; }
.hero-dual-cover-preview[data-hero-layout='poster-peak'] .dual-cover-hero-preview-scroll { display: block; }
.hero-dual-cover-preview[data-hero-layout='classic'] .dual-cover-hero-draggable-title { color: #fff; font-family: var(--display); font-size: clamp(36px, 25cqh, 190px); font-weight: 600; letter-spacing: 0; text-shadow: 0 3px 15px rgba(0,0,0,.4); -webkit-text-fill-color: #fff; -webkit-text-stroke: 0; }
.hero-dual-cover-preview[data-hero-layout='classic'] .dual-cover-hero-draggable-title::after { background: #d5ff24; content: ''; display: inline-block; height: .14em; margin: 0 0 .03em .08em; width: .14em; }
.hero-cover-title-scale { align-items: center; color: var(--muted); display: flex; font: 10px var(--mono); gap: 8px; margin-top: 10px; }
.hero-cover-title-scale input { accent-color: var(--ink); flex: 1; max-width: 150px; }
.hero-cover-title-scale output { color: var(--ink); min-width: 34px; }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-hero-preview-copy { font-size: max(3px, 1.47cqw); left: var(--hero-statement-x, 7%); top: var(--hero-statement-y, 55%); }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-hero-preview-copy strong { font-size: max(6px, 2.94cqw); gap: max(4px, 2.06cqw); margin-bottom: max(3px, 1.62cqw); }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-hero-preview-copy strong i { width: 11.76cqw; }
.dual-cover-slot[data-cover-device='mobile'] .dual-cover-hero-preview-copy b { font-size: max(3px, 1.47cqw); margin-top: max(2px, 1.18cqw); }
.dual-cover-slot[data-cover-device='mobile'] .hero-dual-cover-preview .dual-cover-hero-preview-scroll { bottom: 4.1%; font-size: max(3px, 1.47cqw); left: 7%; }
@media (max-width: 700px) { .hero-cover-layout-controls { align-items: start; flex-direction: column; gap: 10px; } .hero-cover-layout-controls p { max-width: none; } }

/* Both Hero editors use the same saved anchor as the public page: the title's
   top-left corner. This override also keeps the legacy quick editor aligned. */
.hero-layout-artboard .hero-layout-draggable-title { transform: scale(var(--hero-title-scale, 1)); transform-origin: left center; }

/* Scale the poster's supporting type from the same desktop rules as the
   public Hero. The artboard is a proportional viewport, not a separate look. */
.hero-layout-artboard { container-type: size; }
.hero-layout-preview-copy {
  font: 500 clamp(6px, 1.15cqw, 14px)/1.55 var(--mono);
  gap: 1px;
  left: 4.25%;
  letter-spacing: .12em;
  top: 64%;
}
.hero-layout-preview-copy strong {
  font-size: clamp(12px, 2.2cqw, 30px);
  gap: clamp(8px, 1.4cqw, 18px);
  margin-bottom: clamp(5px, 1cqw, 13px);
}
.hero-layout-preview-copy strong i { width: clamp(36px, 6cqw, 190px); }
.hero-layout-preview-copy b { font-size: clamp(6px, 1cqw, 13px); margin-top: clamp(3px, .6cqw, 8px); }
.hero-layout-preview-scroll {
  bottom: 3%;
  font-size: clamp(4px, .7cqw, 10px);
  left: 4.25%;
}

.home-entrance-loader {
  --home-entrance-fill: 0%;
  align-items: center;
  background: #060708;
  color: #fff;
  display: grid;
  inset: 0;
  justify-items: center;
  opacity: 1;
  position: fixed;
  transition: opacity .42s ease, visibility .42s ease;
  z-index: 1000;
}
.home-entrance-loader.is-leaving { opacity: 0; visibility: hidden; }
.home-entrance-loader.is-handing-off .home-entrance-progress {
  opacity: 0;
  transition: opacity .18s ease-out;
}
.home-entrance-loader.is-handing-off .home-entrance-mark {
  animation: none !important;
  opacity: 1 !important;
  transform: translate3d(var(--home-handoff-x), var(--home-handoff-y), 0) scaleX(1.12) scale(var(--home-handoff-scale-x), var(--home-handoff-scale-y)) !important;
  transition: transform .68s cubic-bezier(.16, 1, .3, 1);
}
.home-entrance-handoff {
  animation: none !important;
  margin: 0 !important;
  pointer-events: none;
  position: fixed !important;
  transform-origin: left top;
  z-index: 1001;
}
#immersive-stage .immersive-category-cover .immersive-category-copy > span,
#immersive-stage .immersive-category-cover .immersive-category-copy p,
#immersive-stage .immersive-category-cover .immersive-category-copy small {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, .72);
}
.home-entrance-frame { display: grid; justify-items: center; min-width: min(74vw, 470px); position: relative; }
.home-entrance-mark {
  align-items: flex-end;
  display: flex;
  line-height: 0;
  overflow: visible;
  padding: 0;
  position: relative;
}
.home-entrance-ocean { aspect-ratio: 620 / 270; display: block; height: auto; width: clamp(400px, 40vw, 585px); }
.home-entrance-progress { background: rgba(255,255,255,.22); height: 1px; margin-top: 32px; overflow: hidden; width: 100%; }
.home-entrance-progress i { background: #f4f4f1; display: block; height: 100%; transform: scaleX(0); transform-origin: left center; width: 100%; }
@media (prefers-reduced-motion: no-preference) {
  .home-entrance-mark {
    animation: home-entrance-copy-in 1.15s cubic-bezier(.16, 1, .3, 1) both;
    opacity: 0;
    transform: translate3d(0, 10px, 0);
  }
  .home-entrance-mark {
    animation-delay: .12s;
    animation-duration: 1.15s;
    animation-name: home-entrance-mark-in;
    animation-timing-function: cubic-bezier(.16, 1, .3, 1);
    transform: translate3d(0, 12px, 0);
  }
}
@keyframes home-entrance-copy-in { to { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes home-entrance-mark-in { to { opacity: 1; transform: translate3d(0, 0, 0); } }
html.home-entrance-active { overflow: hidden; }
@media (max-width: 700px) {
  .home-entrance-frame { min-width: min(82vw, 420px); }
  .home-entrance-ocean { width: min(76vw, 420px); }
}
@media (prefers-reduced-motion: reduce) {
  .home-entrance-loader { transition-duration: .16s; }
}