/* Match the existing illustrated navigation instead of typesetting one label. */
.handwritten .nav.work .portfolio-label{background-image:url('assets/portfolio-lettering.webp')}
.portfolio-dialog{width:min(1180px,94vw);max-width:94vw;max-height:92dvh;padding:0;color:#233c4b;background:#c1d4dd url('assets/mist-grain.svg');border:1.5px solid #536f7b;border-radius:3px;box-shadow:10px 10px 0 #29475820;overflow:auto}
.portfolio-dialog::backdrop{background:#203b4c66;backdrop-filter:blur(9px)}
.portfolio-bar{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:18px;min-height:74px;padding:14px 26px;border-bottom:1px solid #536f7b55;background:#c1d4dd url('assets/mist-grain.svg')}
.portfolio-bar span{font-size:13px;letter-spacing:.12em;flex:1}
.portfolio-dialog button{color:inherit;font:inherit;cursor:pointer}
.portfolio-close{border:1px solid #536f7b;border-radius:50%;background:transparent;font-size:28px!important;width:40px;height:40px;line-height:1;flex-shrink:0}
.portfolio-back{border:0;border-bottom:1px solid #536f7b;background:transparent;padding:8px 0;font-size:14px!important}
.portfolio-body{padding:40px clamp(20px,4vw,52px) 48px}
.portfolio-eyebrow{font-size:14px;color:#58747d;margin:0 0 12px;letter-spacing:.07em}
.portfolio-dialog h2{font-size:clamp(30px,3.5vw,50px);margin:0 0 14px;line-height:1.2}
.portfolio-intro>p:last-child,.project-heading>p:last-child{font-size:17px;line-height:1.8;margin:0;max-width:780px;color:#4c6570}
.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px;margin-top:32px}
.project-card{padding:0;text-align:left;background:transparent;border:0;border-radius:2px;overflow:hidden;transition:transform .2s,border-color .2s}
.project-cover{aspect-ratio:16/9;position:relative;background:#182023;overflow:hidden}
.project-cover img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .3s}
.project-action{position:absolute;right:12px;bottom:12px;background:#e3edf1f2;color:#233c4b;padding:7px 12px;border-radius:2px;font-size:13px}
.project-card-copy{padding:18px 2px 12px}
.project-number{font-size:12px;letter-spacing:.07em;color:#5a737c}
.project-card h3{font-size:25px;font-weight:700;margin:9px 0}
.project-card p{font-size:16px;line-height:1.7;margin:0;color:#4c6570}
.project-card:hover{transform:translateY(-3px);border-color:#233c4b}
.project-card:hover img{transform:scale(1.025)}
.portfolio-dialog button:focus-visible{outline:3px solid #476e84;outline-offset:4px}
.project-heading{margin-bottom:28px}
.project-media,.project-screens figure{margin:0}
.project-media video{display:block;width:100%;max-height:65dvh;aspect-ratio:16/9;object-fit:contain;background:#15191a}
.portfolio-dialog figcaption{font-size:14px;color:#5a737c;margin-top:12px;line-height:1.6}
.project-screens{display:grid;gap:28px}
.project-screens img{display:block;width:100%;height:auto;border:1px solid #536f7b44}
.project-availability{font-size:14px;color:#5a737c;margin:26px 0 0}
.project-error{color:#854627}
@media(min-width:651px) and (max-width:1000px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.portfolio-dialog{width:96vw;max-width:96vw;max-height:95dvh}.portfolio-bar{padding:12px 14px;gap:10px;min-height:64px}.portfolio-bar span{font-size:10px;letter-spacing:.03em}.portfolio-back{font-size:12px!important}.portfolio-body{padding:28px 18px 32px}.project-grid{grid-template-columns:1fr;gap:20px;margin-top:24px}.project-card-copy{padding:18px}.project-card h3{font-size:24px}.project-card p,.project-heading>p:last-child,.portfolio-intro>p:last-child{font-size:16px}.portfolio-close{width:36px;height:36px}.project-media video{max-height:none}}
@media(prefers-reduced-motion:reduce){.project-card,.project-cover img{transition:none}.project-card:hover,.project-card:hover img{transform:none}}

/* 封面与说明共用站点的纸面主题；覆盖通用 dialog 图片的默认外边距。 */
.portfolio-dialog{font-family:'LXGW WenKai','PingFang SC',sans-serif}
.portfolio-dialog .project-cover img{margin:0;max-height:none}
.portfolio-intro{max-width:780px}
.portfolio-dialog .project-card:hover{color:#233c4b}