.work-dialog{--work-line-duration:1100ms;--work-title-start:320ms;--work-title-duration:360ms;--work-project-start:1200ms;--work-project-stagger:280ms;--work-image-duration:800ms;--work-text-duration:560ms;--work-ease:cubic-bezier(.16,1,.3,1);--work-header-height:10svh;--work-footer-height:10svh;box-sizing:border-box;inset:0;width:100%;max-width:none;height:100svh;max-height:none;margin:0;padding:0;border:0;background:rgba(246,241,232,.8);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#111;overflow:hidden;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c9c6c0 #f6f1e8}
.work-dialog::backdrop{background:transparent}
.work-dialog-frame{position:fixed;inset:0;z-index:3;pointer-events:none}
.work-frame-line{position:absolute;background:#c9c6c0}
.work-frame-line--left,.work-frame-line--right{top:0;bottom:0;width:1px}
.work-frame-line--left{left:6%}.work-frame-line--right{right:6%}
.work-frame-line--top,.work-frame-line--bottom{left:0;right:0;height:1px}
.work-frame-line--top{top:10%}.work-frame-line--bottom{bottom:10%}
.work-dialog-bar{position:fixed;top:0;left:0;right:0;z-index:2;height:var(--work-header-height);background:transparent}
.work-dialog-base{position:fixed;z-index:2;left:0;right:0;bottom:0;height:var(--work-footer-height);background:transparent;pointer-events:none}
.work-dialog-mark{position:fixed;z-index:6;left:6%;top:var(--work-header-height);width:5px;height:5px;background:#34312d;transform:translate(-50%,-50%) rotate(45deg);pointer-events:none}
.work-dialog-mark--bottom{left:94%;top:auto;bottom:var(--work-footer-height);transform:translate(-50%,50%) rotate(45deg)}
.work-close{position:fixed;z-index:4;top:calc(var(--work-header-height) + 4px);right:calc(6% + 4px);display:grid;place-items:center;width:44px;height:44px;padding:12px;border:1px solid transparent;border-radius:0;background:transparent;color:#111;cursor:pointer;transition:background 180ms,color 180ms}
.work-close svg{width:20px;height:20px}.work-close:is(:hover,:active){border-color:transparent;background:transparent}
.work-close:focus-visible{outline:0}.work-close:focus-visible svg{outline:1px solid currentColor;outline-offset:4px;border-radius:50%}
.work-project:focus-visible{outline:2px solid #111;outline-offset:6px}
.work-dialog-scroll{position:absolute;inset:var(--work-header-height) 0 var(--work-footer-height);overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#c9c6c0 transparent}
.work-dialog-body{position:relative;z-index:1;box-sizing:border-box;width:min(100% - (6% + 48px)*2,1480px);min-height:100%;margin:0 auto;padding:64px 0;display:flex;flex-direction:column;justify-content:center}
.work-dialog h2{margin:0 0 44px;text-align:center;font:500 2rem/1.1 "Cormorant Garamond",Baskerville,Georgia,serif;letter-spacing:-.025em;text-wrap:balance}
.work-projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,44px)}
.work-project{display:block;min-width:0;color:#111;text-decoration:none}
.work-project-preview{display:block;box-sizing:border-box;aspect-ratio:16/9;margin:0 0 20px;padding:10px;background:rgba(0,0,0,.2);overflow:hidden}
.work-project-preview img{display:block;width:100%;height:100%;object-fit:contain;transition:transform 500ms cubic-bezier(.16,1,.3,1)}
.work-project:first-child .work-project-preview img{object-fit:cover;object-position:center top}
.work-project:hover .work-project-preview img,.work-project:focus-visible .work-project-preview img{transform:scale(1.035)}
.work-project-caption{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.work-project h3{margin:0;font:400 .8125rem/1.45 "Courier New",Courier,monospace;letter-spacing:0;text-wrap:balance}
.work-project:is(:hover,:focus-visible) .work-name-ink{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.work-project-caption svg{flex:none;width:16px;height:16px;margin-top:2px;transition:transform 250ms}
.work-project:hover .work-project-caption svg,.work-project:focus-visible .work-project-caption svg{transform:translate(2px,-2px)}
@media(max-width:760px){.work-dialog-body{width:calc(100% - (6% + 28px)*2)}.work-projects{grid-template-columns:1fr;gap:44px}.work-project-preview{margin-bottom:18px}.work-project h3{font-size:.8125rem}}
@media(max-width:480px){.work-dialog-body{width:calc(100% - (6% + 26px)*2);padding-top:64px}.work-dialog h2{font-size:1.75rem;margin-bottom:36px}.work-projects{gap:36px}}
@media(prefers-reduced-motion:reduce){.work-close,.work-close svg,.work-project-preview img,.work-project-caption svg{transition:none}.work-project:hover .work-project-preview img,.work-project:focus-visible .work-project-preview img{transform:none}}
/* The requested Projects reference: trace the new panes, then resolve their content. */
.work-dialog-wash{position:fixed;inset:10svh 6%;z-index:0;pointer-events:none;background:rgba(70,64,55,.045)}
.work-project-preview{--work-preview-ground:#ebe3f8;position:relative;background:var(--work-preview-ground)}
.work-project:nth-child(2) .work-project-preview{--work-preview-ground:#d5e6f3}
.work-project:nth-child(3) .work-project-preview{--work-preview-ground:#e0d5f1}
.work-project:nth-child(n+2) .work-project-preview img{background:var(--work-preview-ground)}
.work-preview-edge{position:absolute;z-index:2;pointer-events:none;background:#c9c6c0;opacity:0}
.work-preview-edge--top,.work-preview-edge--bottom{left:0;right:0;height:1px}
.work-preview-edge--top{top:0;transform-origin:left}.work-preview-edge--bottom{bottom:0;transform-origin:right}
.work-preview-edge--left,.work-preview-edge--right{top:0;bottom:0;width:1px}
.work-preview-edge--left{left:0;transform-origin:bottom}.work-preview-edge--right{right:0;transform-origin:top}
.work-title-frame{display:inline-grid;text-align:left}
.work-title-frame>span{grid-area:1/1}
.work-title-measure,.work-name-measure{visibility:hidden}
.work-project h3{display:grid}
.work-project h3>span{grid-area:1/1;min-width:0}
.work-revealing .work-dialog-wash{animation:work-wash-in 560ms var(--work-ease) 280ms both}
.work-revealing .work-frame-line--left,.work-revealing .work-frame-line--right{animation:work-rule-vertical var(--work-line-duration) var(--work-ease) both}
.work-revealing .work-frame-line--left{transform-origin:top}.work-revealing .work-frame-line--right{transform-origin:bottom;animation-delay:0ms}
.work-revealing .work-frame-line--top,.work-revealing .work-frame-line--bottom{animation:work-rule-horizontal var(--work-line-duration) var(--work-ease) both}
.work-revealing .work-frame-line--top{transform-origin:left;animation-delay:180ms}.work-revealing .work-frame-line--bottom{transform-origin:right;animation-delay:180ms}
.work-revealing .work-dialog-mark{animation:work-node-in 350ms var(--work-ease) 1220ms both}
.work-revealing .work-project-preview{background:transparent}
.work-revealing .work-project-preview::before{content:"";position:absolute;inset:0;background:var(--work-preview-ground);opacity:0}
.work-revealing .work-preview-edge{animation:work-edge-y 360ms var(--work-ease) calc(720ms + var(--work-index)*50ms) both,work-trace-fade var(--work-image-duration) ease calc(var(--work-project-start) + var(--work-index)*var(--work-project-stagger)) both}
.work-revealing .work-preview-edge--top,.work-revealing .work-preview-edge--bottom{animation-name:work-edge-x,work-trace-fade;animation-delay:calc(360ms + var(--work-index)*50ms),calc(var(--work-project-start) + var(--work-index)*var(--work-project-stagger))}
.work-revealing .work-project-preview img,.work-revealing .work-project-caption{opacity:0}
.work-revealing .work-project-preview::before{animation:work-content-resolve var(--work-image-duration) var(--work-ease) calc(var(--work-project-start) + var(--work-index)*var(--work-project-stagger)) both}
.work-revealing .work-project-preview img{animation:work-content-resolve var(--work-image-duration) var(--work-ease) calc(var(--work-project-start) + var(--work-index)*var(--work-project-stagger)) both}
.work-revealing .work-project-caption{animation:work-content-resolve var(--work-image-duration) var(--work-ease) calc(var(--work-project-start) + var(--work-index)*var(--work-project-stagger)) both}
.work-reveal-paused :is(.work-dialog-wash,.work-frame-line,.work-dialog-mark,.work-preview-edge,.work-project-preview img,.work-project-caption),.work-reveal-paused .work-project-preview::before{animation-play-state:paused!important}
@keyframes work-wash-in{from{opacity:0}to{opacity:1}}
@keyframes work-content-resolve{from{opacity:0}to{opacity:1}}
@keyframes work-pane-trace{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@keyframes work-trace-fade{from{opacity:1}to{opacity:0}}
@keyframes work-node-in{from{opacity:0}to{opacity:1}}
@keyframes work-rule-vertical{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes work-rule-horizontal{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){.work-revealing :is(.work-dialog-wash,.work-frame-line,.work-dialog-mark,.work-preview-edge,.work-project-preview img,.work-project-caption),.work-revealing .work-project-preview::before{animation:none}.work-preview-edge{display:none}.work-project-preview{background:var(--work-preview-ground)}}
@keyframes work-edge-x{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes work-edge-y{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.work-dialog.work-closing::backdrop{animation:work-close-backdrop 280ms ease-out both}
@keyframes work-close-backdrop{to{background-color:transparent}}
@media(prefers-reduced-motion:reduce){.work-dialog.work-closing::backdrop{animation-duration:80ms}}