.contact-links{display:flex;align-items:center;justify-content:center;gap:20px;margin:16px auto 0}.contact-links .contact-linkedin{margin:0;flex-shrink:0}.contact-resume{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:14px;line-height:1.4;text-decoration:none}.contact-resume-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;transition:color .2s,background .2s,transform .2s}.contact-resume:hover .contact-resume-icon{color:var(--ink);background:var(--surface);transform:translateY(-2px)}
.case-scenario{padding:16px 20px;border:1px solid var(--line);border-radius:12px;margin:20px 0}.case-scenario h3{margin:0 0 8px}.case-scenario p{margin:0;color:var(--muted)}
#project-story{padding:24px 32px;background:var(--panel);color:var(--ink)}.project-story-meta{font-size:14px;color:var(--muted);margin-bottom:16px}#project-story dl{margin:0}#project-story dl>div{display:grid;grid-template-columns:135px 1fr;gap:18px;padding:12px 0;border-top:1px solid var(--line)}#project-story dt{font:600 14px/1.6 Inter,sans-serif}#project-story dd{margin:0;font-size:16px;line-height:1.7;color:var(--muted)}@media(max-width:600px){#project-story{padding:20px}#project-story dl>div{grid-template-columns:1fr;gap:6px}}

.timeline time{color:var(--muted)}

#project-dialog #project-title{font-family:Inter,sans-serif;font-size:18px;line-height:1.4}
.project-live-link{display:inline-flex;align-items:center;gap:8px;margin-top:18px;padding:10px 14px;border:1px solid var(--line);border-radius:999px;font:600 13px/1.4 Inter,sans-serif}.project-live-link:hover{background:var(--panel-hover);border-color:var(--interactive-border,var(--accent))}.project-image-wrap.has-project-gallery{padding:24px;background:var(--dialog-surface)}.fple-project-gallery{display:grid;gap:24px}.fple-project-gallery figure{margin:0;overflow:hidden;border-radius:12px;background:var(--background);box-shadow:0 8px 28px #00000012}.fple-project-gallery img{width:100%;height:auto}.fple-project-gallery figcaption{padding:10px 14px;color:var(--muted);font:12px/1.5 Inter,sans-serif}
@media(max-width:600px){.project-image-wrap.has-project-gallery{padding:10px}.fple-project-gallery{gap:14px}.fple-project-gallery figure{border-radius:8px}.fple-project-gallery figcaption{padding:8px 10px;font-size:11px}}

/* Shared footer controls and curved resume label. */
.footer-credit{grid-column:1/-1;align-items:center}.snoopy-memorial{font-size:14px;align-items:center}.snoopy-memorial-icon{width:24px;height:24px;flex-basis:24px}
footer .footer-actions{grid-column:1/-1;justify-self:end;display:flex;align-items:center;flex-wrap:nowrap;gap:12px}
footer .footer-actions>button,footer .footer-actions>a{position:static;display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;min-width:44px;min-height:44px;margin:0;padding:0;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);font:14px/1 Inter,sans-serif;box-shadow:none;transition:background .2s,border-color .2s}
footer .footer-actions>button:hover,footer .footer-actions>a:hover{background:var(--panel-hover,var(--surface));border-color:var(--muted)}
footer .footer-actions svg,footer .footer-actions .motion-toggle img{width:22px;height:22px}
footer .footer-actions>button:disabled{opacity:.45;cursor:default}

.contact-links{align-items:center;gap:16px}.contact-links .contact-linkedin{margin:0}.contact-resume{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:44px;min-height:44px;padding:0;gap:0}.contact-resume:hover .contact-resume-icon{transform:none}
.resume-download{position:relative;z-index:5}.resume-tooltip,.resume-bubble{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);width:max-content;max-width:240px;border:1px solid var(--line);border-radius:12px;background:var(--background);color:var(--ink);box-shadow:0 6px 24px #0002;font:12px/1.5 var(--font-body);z-index:8}.resume-tooltip{padding:8px 12px;visibility:hidden;pointer-events:none}.resume-bubble a{display:flex;align-items:center;min-height:44px;padding:10px 14px}.resume-bubble[hidden]{display:none}.resume-tooltip:before,.resume-bubble:before{content:"";position:absolute;width:8px;height:8px;top:-5px;left:calc(50% - 4px);background:var(--background);border-top:1px solid var(--line);border-left:1px solid var(--line);transform:rotate(45deg)}
@media(hover:hover) and (pointer:fine) and (min-width:761px){.resume-download:hover .resume-tooltip,.resume-download:focus-within .resume-tooltip{visibility:visible}}
/* Match the footprint of the supplied Chinese lettering and the English title. */
html .contact h2,html:not([lang=en]) .contact h2,html[lang=en] .contact h2{width:clamp(220px,29vw,360px);height:clamp(103px,13.5vw,168px);aspect-ratio:auto;display:flex;align-items:center;justify-content:center;margin:0 auto 25px;transform:none;line-height:1.1}
html[lang=en] .contact h2{font-size:clamp(64px,8.4vw,104px);white-space:nowrap}
@media(min-width:761px){.footer-credit{grid-column:1;grid-row:2}footer .footer-actions{grid-column:2;grid-row:2}}
@media(max-width:760px){
 .footer-preferences .design-quotes{min-height:0;padding-block:12px;display:block}
 .footer-preferences .design-quotes blockquote{min-height:52px;line-height:26px}
 .footer-preferences .design-quotes blockquote p,.footer-preferences .design-quotes cite{font-size:14px;line-height:26px}
}

@media(max-width:760px){
 footer .footer-actions{gap:8px}
 footer .footer-actions>button,footer .footer-actions>a{position:relative;inset:auto;isolation:isolate;border:0;background:transparent;font-size:12px}
 footer .footer-actions>button:before,footer .footer-actions>a:before{content:"";position:absolute;inset:4px;border:1px solid var(--line);border-radius:50%;z-index:-1}
 footer .footer-actions>button:hover,footer .footer-actions>a:hover{background:transparent}
 footer .footer-actions>button:hover:before,footer .footer-actions>a:hover:before{background:var(--panel-hover,var(--surface));border-color:var(--muted)}
 footer .footer-actions svg,footer .footer-actions .motion-toggle img{width:18px;height:18px}
}

/* Project names stay visible in both themes and on touch screens. */
.gallery .project-card .project-name{position:relative;display:block;padding:12px 14px;background:var(--panel);color:var(--ink);font:500 14px/1.45 var(--font-body,Inter,sans-serif);text-align:left;overflow-wrap:anywhere}
@media(max-width:760px){.gallery .project-card .project-name{padding:9px 7px;font-size:12px}}