.menu-toggle,.menu-close{position:fixed;top:16px;right:22px;width:44px;height:44px;border:0;background:transparent;color:#fff;cursor:pointer;display:grid;place-content:center;gap:7px;padding:11px;z-index:3}
.menu-toggle span,.menu-close span{display:block;width:22px;height:1px;background:currentColor;transition:transform var(--motion-ui) var(--ease-quiet)}
@media(hover:hover){.menu-toggle:hover span:first-child{transform:translateY(2px)}
.menu-toggle:hover span:last-child{transform:translateY(-2px)}}
.menu-toggle:focus-visible,.menu-close:focus-visible{outline:none;color:#fff}
:where(#site-menu) a:focus-visible,:where(#site-menu) .menu-entry:focus-visible{outline:1px solid #aaaaaa;outline-offset:5px}
:where(#site-menu){position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:clamp(32px,6svh,72px) clamp(32px,8vw,120px) 110px;border:0;background:#000000;color:#fff}
:where(#site-menu)::backdrop{background:transparent}
:where(#site-menu)[open]{display:flex;flex-direction:column;justify-content:center;animation:menu-arrive 1s cubic-bezier(.4,0,.2,1) both}
:where(#site-menu) nav{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(14px,2.5svh,28px)}
:where(#site-menu) a,:where(#site-menu) .menu-entry{font:italic 400 clamp(36px,6vw,72px)/1.2 var(--serif);color:#fff;text-decoration:none;display:block;position:relative;isolation:isolate;padding:8px 12px;margin-left:-12px}
:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light)::before{content:"";position:absolute;left:-80px;right:-180px;top:-30px;bottom:-30px;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 42% 50%,rgba(255,255,255,.29) 0%,rgba(255,255,255,.15) 30%,rgba(255,255,255,.055) 54%,transparent 78%);opacity:0;transform:scaleX(.85);transition:opacity 1.25s ease,transform 1.4s var(--ease-quiet)}
:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light).lit::before,:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light):focus-visible::before{opacity:1;transform:scaleX(1)}
:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light) span{position:relative;display:block;transform:translate(0,0);text-shadow:0 0 18px transparent;transition:transform .65s var(--ease-quiet),text-shadow 1.15s ease,color 1.15s ease}
:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light) span::after{content:attr(data-label);position:absolute;inset:0;pointer-events:none;color:transparent;background:linear-gradient(105deg,transparent 15%,rgba(255,255,255,.25) 32%,#ffffff 48%,rgba(255,255,255,.3) 64%,transparent 82%);background-size:240% 100%;background-position:100% 50%;background-clip:text;-webkit-background-clip:text;opacity:0;transition:opacity .65s ease,background-position 1.2s var(--ease-quiet)}
:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light).lit span,:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light):focus-visible span{transform:translate(var(--drift,0px),-3px);color:#fff;text-shadow:0 0 12px rgba(255,255,255,.32),0 0 32px rgba(255,255,255,.27),0 0 64px rgba(255,255,255,.18)}
:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light).lit span::after,:is(:where(#site-menu) a,:where(#site-menu) .menu-entry,.collection-light):focus-visible span::after{opacity:1;background-position:var(--light,50%) 50%}
.menu-close{position:absolute}
.menu-close span:first-child{transform:translateY(4px) rotate(45deg);animation:menu-line-top .75s var(--ease-quiet) both}
.menu-close span:last-child{transform:translateY(-4px) rotate(-45deg);animation:menu-line-bottom .75s var(--ease-quiet) both}
.menu-caption{margin:0;font:10px/1.5 Arial,sans-serif;letter-spacing:.12em;color:var(--dim)}
body.menu-open{overflow:hidden}
@keyframes menu-line-top{from{transform:translateY(0) rotate(0)}to{transform:translateY(4px) rotate(45deg)}}
@keyframes menu-line-bottom{from{transform:translateY(0) rotate(0)}to{transform:translateY(-4px) rotate(-45deg)}}
@keyframes menu-arrive{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){:where(#site-menu)[open],.menu-close span{animation:none}
.menu-toggle span,.menu-close span{transition:none}}
@media(prefers-reduced-motion:reduce){:where(#site-menu) a::before,:where(#site-menu) a span,:where(#site-menu) a span::after,:where(#site-menu) .menu-entry::before,:where(#site-menu) .menu-entry span,:where(#site-menu) .menu-entry span::after{transition:none}
:where(#site-menu) a.lit span,:where(#site-menu) a:focus-visible span{transform:none}}
.menu-footer{position:absolute;left:clamp(32px,8vw,120px);right:clamp(32px,8vw,120px);bottom:32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.social-links{display:flex;align-items:center;gap:26px}
.social-links a{padding:10px;margin:0;min-width:44px;min-height:44px;font-size:16px}
.social-links svg{display:block;width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.social-links a:last-child svg text{stroke:none;fill:currentColor;font:600 8px Arial,sans-serif}
.social-links a::before{left:-35px;right:-35px;top:-20px;bottom:-20px}
.social-links a.lit svg{filter:drop-shadow(0 0 8px rgba(255,255,255,.45))}
:where(#site-menu) .menu-entry{border:0;background:transparent;text-align:left;cursor:pointer}
.menu-levels{position:relative}
:where(#site-menu) .menu-translation{display:block;font:12px/1.6 "Songti SC",serif;letter-spacing:.12em;color:var(--dim);margin-top:8px}
@media(max-width:600px){:where(#site-menu) .menu-entry{font-size:clamp(28px,8vw,42px)}}
.menu-node{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(140px,22%);gap:clamp(20px,2vw,32px);align-items:center;width:100%;max-width:1200px;min-height:clamp(132px,21svh,195px)}
.menu-node .menu-entry,:where(#site-menu) .menu-journal{font-size:clamp(30px,3.5vw,54px)}
.menu-branch{display:grid;grid-template-columns:clamp(45px,6vw,90px) minmax(0,1fr);align-items:center;pointer-events:none}
.menu-branch svg{width:100%;height:150px;overflow:visible;fill:none;stroke:#ffffff;stroke-width:1;opacity:0;clip-path:inset(0 100% 0 0);transition:clip-path 1.8s cubic-bezier(.4,0,.2,1),opacity .6s ease}
.menu-branch path{vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.menu-branch-links{display:flex;flex-direction:column;gap:28px;padding-left:18px}
:where(#site-menu) .menu-branch a{font-size:clamp(21px,2vw,30px);white-space:nowrap;opacity:0;visibility:hidden;transform:translateX(-6px);transition:opacity .55s ease,transform .7s ease,visibility 0s .55s}
.menu-branch a::before{left:-35px;right:-45px;top:-20px;bottom:-20px}
.menu-node:is(:hover,:focus-within) .menu-branch{pointer-events:auto}
.menu-node:is(:hover,:focus-within) .menu-branch svg{opacity:1;clip-path:inset(-2px)}
.menu-node:is(:hover,:focus-within) .menu-branch a{opacity:1;visibility:visible;transform:translateX(0);transition-delay:1.15s,1.15s,0s}
.menu-node:is(:hover,:focus-within) .menu-branch a:last-child{transition-delay:1.3s,1.3s,0s}
.menu-photo-preview{position:relative;width:100%;height:150px;align-self:center;perspective:1000px}
.preview-work{position:absolute;inset:0;margin:0}
.preview-work figcaption{position:absolute;top:100%;left:-8px;right:-8px;text-align:center;font:italic 400 12px/1.7 var(--serif);color:#fff;padding-top:14px;opacity:0;transform:translateY(3px);transition:opacity .8s ease,transform .8s ease}
.preview-work:has(img.visible) figcaption{opacity:1;transform:translateY(0);transition-delay:.5s}
.menu-photo-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;filter:blur(5px) drop-shadow(0 0 10px transparent) drop-shadow(0 0 28px transparent);transform:rotateX(var(--preview-x,0deg)) rotateY(var(--preview-y,0deg));transition:opacity 1.1s ease,filter 1.6s ease,transform .7s var(--ease-quiet)}
.menu-photo-preview img.visible{opacity:.85;filter:blur(0) drop-shadow(0 0 8px rgba(255,255,255,.12)) drop-shadow(0 8px 18px rgba(0,0,0,.55))}
@media(max-width:900px),(hover:none){:where(#site-menu)[open]{justify-content:flex-start;padding-top:76px;padding-bottom:110px}
:where(#site-menu) .menu-main{gap:26px}
.menu-levels{display:block}
.menu-photo-preview{height:150px;margin:10px 0 48px;flex-shrink:0}
.menu-photo-preview img{transform:none}
.menu-node{display:block;min-height:0}
.menu-node .menu-entry,:where(#site-menu) .menu-journal{font-size:clamp(28px,6vw,42px)}
.menu-node .menu-branch{display:grid;grid-template-columns:1fr;grid-template-rows:0fr;opacity:0;pointer-events:none;margin-top:0;transition:grid-template-rows .65s var(--ease-quiet),opacity .45s ease}
.menu-node.branch-open .menu-branch{grid-template-rows:1fr;opacity:1;pointer-events:auto}
.menu-branch svg{display:none}
.menu-branch-links{min-height:0;overflow:hidden;gap:12px;padding-left:24px;border-left:1px solid #444444}
.menu-branch-links a:first-child{margin-top:14px}
:where(#site-menu) .menu-node .menu-branch a{opacity:1;visibility:visible;transform:none;font-size:24px;white-space:normal;transition:none}
:where(#site-menu) .menu-translation{font-size:11px;margin-top:5px}
.menu-footer{position:static;margin-top:40px;flex-shrink:0}}
@media(prefers-reduced-motion:reduce){.preview-work figcaption,.menu-photo-preview img,.menu-node .menu-branch,.menu-branch svg,.menu-branch path,:where(#site-menu) .menu-branch a{transition:none!important}}
@media(prefers-reduced-motion:reduce){.menu-photo-preview img{transform:none}}