.work-detail-page{min-height:100vh}.work-detail{max-width:1040px;padding-bottom:var(--page-bottom);padding-top:clamp(26px,4vw,44px)}.work-detail__back{color:var(--muted);font-family:var(--mono);margin-bottom:clamp(30px,5vw,58px);font-size:11px;text-decoration:none;transition:color .18s,transform .18s;display:inline-flex}.work-detail__back:hover,.work-detail__back:focus-visible{color:var(--text);transform:translate(-3px)}.work-detail__header{border-bottom:1px solid var(--line-soft);padding-bottom:clamp(30px,5vw,58px)}.work-detail__header p,.work-detail__section-heading p,.work-detail__grid span{color:var(--muted);font-family:var(--mono);margin:0;font-size:11px}.work-detail__header h1{color:var(--text);font-family:var(--display);letter-spacing:0;margin:clamp(12px,2vw,20px) 0 0;font-size:clamp(42px,7vw,88px);line-height:.98}.work-detail__header span{color:var(--muted);max-width:760px;margin-top:clamp(18px,3vw,30px);font-size:clamp(15px,1.55vw,19px);line-height:1.65;display:block}.work-detail__grid{border-bottom:1px solid var(--line-soft);grid-template-columns:1.3fr 1fr 1fr;display:grid}.work-detail__grid div{border-right:1px solid var(--line-soft);gap:9px;min-block-size:142px;padding:clamp(18px,3vw,28px);display:grid}.work-detail__grid div:last-child{border-right:0}.work-detail__grid strong,.work-detail__grid a{color:var(--text);font-family:var(--mono);font-size:13px;font-weight:600}.work-detail__grid a{text-decoration-color:var(--decoration);text-underline-offset:4px}.work-detail__grid p{color:var(--muted);margin:0;font-size:13px;line-height:1.55}.work-detail__section{padding-top:clamp(34px,5vw,58px)}.work-detail__section+.work-detail__section{border-top:1px solid var(--line-soft);margin-top:clamp(34px,5vw,58px)}.work-detail__section-heading{margin-bottom:18px}.work-detail__section-heading h2{color:var(--text);font-family:var(--display);margin:8px 0 0;font-size:clamp(24px,3vw,38px);line-height:1.08}.work-detail__links,.work-detail__collaborators{flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;display:flex}.work-detail__links a,.work-detail__links>span,.work-detail__collaborators a,.work-detail__collaborators>span{border:1px solid var(--line);color:var(--text);font-family:var(--mono);background:var(--surface-floating);align-items:center;gap:7px;padding:7px 9px;font-size:10px;display:inline-flex}.work-detail__links a,.work-detail__collaborators a{border-color:var(--line-bright);text-transform:lowercase;text-decoration:none;transition:background-color .16s,color .16s,transform .16s}.work-detail__collaborators>span{border-color:var(--line-medium)}.work-detail__collaborators strong{font-weight:500}.work-detail__links small,.work-detail__collaborators small{border-left:1px solid var(--line-medium);color:var(--muted);padding-left:7px;font-size:9px;line-height:1}.work-detail__links a[data-kind=code]{border-style:dashed}.work-detail__links a[data-kind=client],.work-detail__links a[data-kind=site]{background:var(--surface-solid-soft)}.work-detail__links a[data-kind=student],.work-detail__links a[data-kind=policy]{border-color:var(--line-bright)}.work-detail__links a:hover,.work-detail__links a:focus-visible,.work-detail__collaborators a:hover,.work-detail__collaborators a:focus-visible{background:var(--text);color:var(--background);transform:translateY(-1px)}.work-detail__links a:hover small,.work-detail__links a:focus-visible small,.work-detail__collaborators a:hover small,.work-detail__collaborators a:focus-visible small{border-color:color-mix(in srgb, var(--background) 45%, transparent);color:var(--background)}.work-detail__links>span[data-pending]{color:var(--muted);background:0 0;border-style:dashed}.work-detail__screens{gap:clamp(14px,2.4vw,22px);display:grid}.work-detail__screens[data-layout=portrait]{grid-template-columns:repeat(2,minmax(0,1fr))}.work-detail__screens[data-layout=landscape]{max-width:var(--article-max);grid-template-columns:minmax(0,1fr);gap:clamp(20px,3.4vw,34px)}.work-detail__screens[data-layout=landscape] img{inline-size:auto;max-inline-size:100%}.work-detail__screens figure{margin:0}.work-detail__screens img{background:var(--panel);border:1px solid var(--line-medium);block-size:auto;inline-size:100%;display:block}.work-detail__screens figcaption{color:var(--muted);font-family:var(--mono);margin-top:10px;font-size:10px;line-height:1.5}.work-detail__empty{color:var(--muted);margin:0;font-size:13px}@media (width>=640px){.work-detail__screens[data-layout=portrait]{grid-template-columns:repeat(4,minmax(0,1fr))}}@media (width<=760px){.work-detail__grid{grid-template-columns:1fr}.work-detail__grid div{border-bottom:1px solid var(--line-soft);border-right:0;min-block-size:auto}.work-detail__grid div:last-child{border-bottom:0}}@media (prefers-reduced-motion:reduce){.work-detail__back,.work-detail__links a,.work-detail__collaborators a{transition:none}}
