/* Confirmed profile and real downloadable resources, within the existing spacing system. */
:root { --page-title: clamp(36px,4vw,64px); }
.page-head h1 { font-size: var(--page-title); line-height: 1.08; max-width: 22ch; }
.menu-socials { grid-template-columns: repeat(3,minmax(0,1fr)); }
.menu-socials button,.menu-socials a { display: grid; place-items: center; align-content: center; gap: var(--s1); min-width: 0; min-height: 72px; padding: var(--s3) var(--s2); border: 0; background: var(--menu-surface); color: var(--fg-2); font-size: 12px; cursor: pointer; overflow-wrap: anywhere; }
.menu-socials :is(button,a):hover { background: var(--red); color: var(--fg); }
.menu-socials :is(button,a):active { background: var(--red-bright); }
.menu-socials button:disabled { opacity: .5; cursor: wait; }
.menu-socials :is(button,a) span:last-child { font-size: 11px; }
.menu-contact-title { font-size: clamp(20px,3.2vw,30px); }
.profile-fields [data-profile-field="bio"] { max-width: 55ch; font-size: 17px; line-height: 1.7; color: var(--fg-2); }
.profile-fields a:hover,.menu-contact a:hover { color: var(--red-bright); }
.social-reserve { grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--s8); }
.social-reserve>.social-entry { display: flex; flex-direction: column; align-items: flex-start; justify-content: start; gap: var(--s4); padding: var(--s6) 0; }
.social-entry code { font-family: var(--f-mono); font-size: 18px; color: var(--fg); }
.social-entry a { display: inline-flex; gap: var(--s2); align-items: center; font-size: 18px; }
.social-entry .icon { width: 16px; height: 16px; }
.social-entry a:hover { color: var(--red-bright); }
.copy-wechat { background: transparent; padding: var(--s2) 0; cursor: pointer; }
.copy-wechat:disabled { opacity: .5; cursor: wait; }
.copy-status { min-height: 24px; font-size: 13px; color: var(--fg-2); margin-top: var(--s4); }
body[data-page="gallery"] .work-thumb { aspect-ratio: 4/5; background: var(--surface); }
body[data-page="gallery"] .work-thumb img { object-fit: contain; opacity: 1; }
.image-download { display: inline-block; margin-top: var(--s6); }
.resource-section { padding-top: var(--s12); }
.resource-intro { max-width: 68ch; color: var(--fg-2); font-size: 16px; line-height: 1.7; }
.resource-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s4) var(--s8); margin-top: var(--s6); }
.resource-actions>a:not(.btn),.resource-images article>a { border-bottom: 1px solid var(--fg-3); padding: var(--s2) 0; font-size: 13px; }
.resource-actions>a:not(.btn):hover,.resource-images article>a:hover { color: var(--red-bright); border-color: var(--red-bright); }
.resource-actions a:active,.resource-images article>a:active { opacity: .7; }
.resource-list { margin-top: var(--s8); }
.resource-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: var(--s8); align-items: center; padding: var(--s6) 0; border-top: 1px solid var(--line); }
.resource-row h3 { font-size: 20px; line-height: 1.35; font-weight: 600; }
.resource-row .resource-actions { margin-top: 0; }
.resource-images { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--s8); margin-top: var(--s8); }
.resource-preview { display: block; width: 100%; aspect-ratio: 4/5; overflow: hidden; padding: 0; border: 0; background: var(--surface); cursor: pointer; }
.resource-preview img { width: 100%; height: 100%; object-fit: contain; transition: transform .3s var(--film-ease); }
.resource-preview:hover img { transform: scale(1.015); }
.resource-preview:active { opacity: .85; }
.resource-images h3 { margin: var(--s4) 0 var(--s2); font-size: 17px; font-weight: 600; line-height: 1.4; }
@media(max-width:860px) { .resource-row { grid-template-columns: 1fr; gap: var(--s4); } .resource-images { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
 :root { --page-title: clamp(30px,8.5vw,36px); }
 .page-head { padding-top: calc(var(--s24) + env(safe-area-inset-top)); }
 .page-head h1 { line-height: 1.16; }
 .page-head>p { margin-top: var(--s4); font-size: 15px; line-height: 1.75; }
 .social-reserve,.resource-images { grid-template-columns: 1fr; }
 .resource-actions { gap: var(--s3) var(--s6); }
 .resource-actions .btn { min-height: 48px; max-width: 100%; font-size: 11px; letter-spacing: .06em; padding: var(--s3) var(--s4); }
 .profile-fields>div { grid-template-columns: 1fr; gap: var(--s3); }
 .reserve-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--s6) var(--s4); }
 .reserve-slot h3 { font-size: 14px; }
 .reserve-slot p { font-size: 12px; }
}
@media(prefers-reduced-motion:reduce) { .resource-preview img { transition: none; } }