/* Consistent project frames; posters retain their original proportions. */
#work,#credits,#profile { scroll-margin-top:90px; }
.project-toolbar { display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:30px;border-bottom:1px solid var(--line);padding-bottom:22px; }
.project-selects { display:flex;gap:18px;flex-wrap:wrap; }
.project-selects label { display:grid;gap:8px;font-size:.875rem;color:var(--silver-2); }
.project-selects select { min-width:160px;padding:12px 38px 12px 14px;background:var(--panel);color:var(--silver);border:1px solid var(--line);border-radius:0;font:inherit;cursor:pointer; }
#project-count { color:var(--silver-2);font-size:.875rem;white-space:nowrap; }
.portfolio-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 24px; }
.portfolio-card { min-width:0; }
.portfolio-open { display:flex;flex-direction:column;width:100%;height:100%;padding:0;border:1px solid var(--line);background:#0d0a13;color:inherit;text-align:left;cursor:pointer;transition:border-color .2s; }
.portfolio-open:hover,.portfolio-open:focus-visible { border-color:#a969e4; }
.portfolio-cover { display:block;width:100%;aspect-ratio:16/11;background:#07060a;position:relative;overflow:hidden; }
.portfolio-cover img { width:100%;height:100%;object-fit:contain;display:block;transition:transform .3s; }
.portfolio-open:hover .portfolio-cover img { transform:scale(1.015); }
.portfolio-open-label { position:absolute;right:12px;bottom:12px;background:rgba(7,5,11,.9);border:1px solid #70637e;padding:7px 10px;font-size:.75rem;letter-spacing:.08em;color:#fff; }
.portfolio-card-body { display:flex;flex-direction:column;flex:1;padding:20px; }
.portfolio-meta { color:#c99aff;font-size:.8125rem;letter-spacing:.05em;text-transform:uppercase; }
.portfolio-title { font-size:clamp(1.35rem,1.8vw,1.8rem);font-weight:700;line-height:1.15;letter-spacing:-.035em;margin:12px 0; }
.portfolio-role { font-size:.875rem;color:var(--silver-2);line-height:1.5;margin-bottom:22px; }
.portfolio-card-bottom { margin-top:auto;font-size:.8125rem;color:#c5c0cc;border-top:1px solid var(--line);padding-top:14px; }
.credit-project-link { padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer;font:inherit; }
.credit-project-link:hover strong { color:#c99aff; }
.credit-photo-details summary { cursor:pointer;font-size:.875rem;color:#c99aff; }
.project-dialog { width:min(1180px,94vw);max-height:92svh;overflow:auto;border:1px solid #60536e;background:#0d0a13;color:var(--silver);padding:0;overscroll-behavior:contain; }
.project-dialog::backdrop { background:rgba(0,0,0,.86);backdrop-filter:blur(8px); }
body:has(dialog[open]) { overflow:hidden; }
.project-dialog-bar { position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#0d0a13;border-bottom:1px solid var(--line);padding:15px 28px; }
.project-dialog-bar > span { font-size:.75rem;letter-spacing:.14em;color:#c99aff; }
#close-project { min-height:44px;padding:8px 16px;background:#1c1328;color:#fff;border:1px solid var(--line);cursor:pointer; }
#project-detail { padding:32px; }
.detail-hero { display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:start; }
.detail-cover { background:#07060a;border:1px solid var(--line);padding:0;cursor:zoom-in;width:100%; }
.detail-cover img { width:100%;height:360px;object-fit:contain;display:block; }
.detail-eyebrow { color:#c99aff;font-size:.875rem;letter-spacing:.06em;margin:0 0 18px; }
.detail-copy h2 { font-size:clamp(2rem,4vw,3.8rem);line-height:1.05;letter-spacing:-.045em;margin:0 0 22px; }
.detail-description { color:#ccc7d4;line-height:1.65; }
.detail-role { border-top:1px solid var(--line);margin-top:24px;padding-top:18px; }
.detail-role > span { color:#c99aff;font-size:.75rem;letter-spacing:.12em; }
.detail-role p { margin:8px 0; }
.detail-note { color:var(--silver-2);font-size:.875rem;line-height:1.65; }
.detail-section { border-top:1px solid var(--line);padding-top:26px;margin-top:36px; }
.detail-section h3 { font-size:1.5rem;font-weight:600;margin:0 0 24px; }
.video-group-title { font-size:.875rem;color:#c99aff;font-weight:500;margin:26px 0 16px; }
.detail-video-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 20px; }
.detail-video-play { width:100%;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:pointer; }
.detail-video-image { display:block;position:relative;aspect-ratio:16/9;background:#060508; }
.detail-video-image img { width:100%;height:100%;object-fit:contain;display:block; }
.detail-play { position:absolute;bottom:8px;right:8px;padding:5px 9px;background:#08060ce6;font-size:.75rem;letter-spacing:.08em;border:1px solid #7e6a93; }
.detail-video-title { display:block;margin-top:12px;font-size:1rem;font-weight:600;line-height:1.4; }
.detail-video-channel { font-size:.8125rem;color:var(--silver-2);margin:8px 0; }
.detail-video-link { display:inline-block;font-size:.875rem;color:#d5b1f9;text-underline-offset:4px;padding:6px 0; }
.detail-photo-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px; }
.detail-photo { padding:0;background:#07060a;border:1px solid var(--line);cursor:zoom-in; }
.detail-photo img { width:100%;height:160px;object-fit:contain;display:block; }
@media(max-width:1050px){.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.detail-video-grid{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:650px){.portfolio-grid{grid-template-columns:1fr;gap:22px;}.project-toolbar{display:block;}.project-selects{display:grid;grid-template-columns:1fr 1fr;gap:12px;}.project-selects select{min-width:0;width:100%;}.project-dialog{width:100%;max-width:100%;height:100svh;max-height:100svh;margin:0;border:0;}.project-dialog-bar{padding:10px 18px;}#project-detail{padding:20px;}.detail-hero{grid-template-columns:1fr;gap:24px;}.detail-cover img{height:260px;}.detail-video-grid{grid-template-columns:1fr;}.detail-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.detail-photo img{height:150px;}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}.portfolio-cover img{transition:none;}}

.detail-photo-caption{display:block;padding:10px;color:var(--silver-2);font-size:.75rem;line-height:1.5;text-align:left;}
.detail-resources{padding-left:20px;}
.detail-resources li{margin-bottom:16px;}