/* DNworks archive: full compositions and user-controlled motion. */
.artist-portfolio{grid-column:1/-1;min-width:0;border-top:1px solid #11162224;padding-top:36px}
.portfolio-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:30px}
.portfolio-heading .eyebrow{font-size:11px;margin:0 0 13px;letter-spacing:.14em;color:#657065}
.portfolio-heading h3{font-family:var(--pixel,monospace);font-size:clamp(19px,1.75vw,26px);font-weight:400;letter-spacing:-.04em;line-height:1.5;margin:0}
.portfolio-heading>p{font-size:15px;line-height:1.65;color:#596172;max-width:345px;margin:0}
.artist-work-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 20px;align-items:stretch}
.artist-work{display:flex;flex-direction:column;margin:0;min-width:0}
.work-media{position:relative;flex:none;aspect-ratio:1;display:grid;place-items:center;background:#050606;overflow:hidden;border-radius:4px}
.work-media>img,.work-media>video{display:block;width:100%;height:100%;min-height:0;object-fit:contain;image-rendering:auto}
.work-media>[hidden]{display:none}
.artist-work figcaption{display:flex;flex-direction:column;flex:1;padding-top:12px}
.artist-work h4{font-size:16px;font-weight:700;line-height:1.4;margin:0;letter-spacing:-.02em}
.work-subtitle{font-size:13px;line-height:1.5;color:#596172;margin:3px 0 0}
.work-footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:10px;min-height:44px}
.work-category{font-size:10px;line-height:1.5;letter-spacing:.1em;text-transform:uppercase;color:#657065}
.work-play{display:inline-flex;align-items:center;gap:15px;border:1px solid #11162235;border-radius:999px;padding:8px 13px;background:transparent;color:#111622;font-size:12px;line-height:1.2;font-weight:600;cursor:pointer;min-width:80px;justify-content:space-between}
.work-play:hover,.work-play[aria-pressed="true"]{background:#111622;color:#f8f1d5;border-color:#111622}
.work-play:focus-visible{outline:2px solid #111622;outline-offset:4px}
.work-status{font-size:12px;line-height:1.5;margin:9px 0 0;color:#596172}
@media(max-width:900px){.artist-work-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 18px}.portfolio-heading{display:block}.portfolio-heading>p{margin-top:18px;max-width:440px}.portfolio-heading h3{font-size:23px}}
@media(max-width:600px){.artist-portfolio{margin-top:40px;padding-top:28px}.portfolio-heading{margin-bottom:25px}.portfolio-heading h3{font-size:clamp(18px,5.2vw,24px)}.portfolio-heading>p{font-size:14px;margin-top:17px}.artist-work-grid{gap:24px 12px}.artist-work h4{font-size:14px}.work-subtitle{font-size:12px}.work-footer{gap:7px;flex-wrap:wrap}.work-category{font-size:9px;letter-spacing:.06em}.work-play{min-height:44px;gap:9px;min-width:76px}}
@media(max-width:380px){.artist-work-grid{grid-template-columns:minmax(0,1fr)}.artist-work h4{font-size:16px}}


/* Authorship and original production tools apply to the DNworks archive. */
.portfolio-authorship{padding:24px 26px;margin:0 0 32px;border-radius:4px;background:#111622;color:#f5f7ff}
.portfolio-authorship .authorship-title{font-family:var(--pixel,monospace);font-size:clamp(17px,1.6vw,23px);line-height:1.7;letter-spacing:-.035em;margin:0;color:#c7ff8b;text-wrap:balance}
.artist-work h4{font-size:18px}
.work-tools{display:block;padding:11px 12px;margin:12px 0 4px;border-left:3px solid #111622;background:#e5ebe7}
.work-tools>span{display:block;font-size:10px;line-height:1.4;letter-spacing:.12em;font-weight:700;color:#596172;margin-bottom:4px}
.work-tools>strong{display:block;font-size:18px;line-height:1.4;font-weight:700;color:#111622}
.artist-work.work-wide{grid-column:span 2}
.artist-work.work-wide .work-media{aspect-ratio:16/9}
@media(max-width:900px){.portfolio-authorship{padding:22px}.artist-work.work-wide{grid-column:1/-1}}
@media(max-width:600px){.portfolio-authorship{padding:20px 18px;margin-bottom:28px}.portfolio-authorship .authorship-title{font-size:16px;line-height:1.7}.artist-work h4{font-size:15px}.work-tools{padding:9px 10px;margin-top:10px}.work-tools>strong{font-size:16px;line-height:1.45}.work-tools>span{font-size:10px;letter-spacing:.08em}}
@media(max-width:380px){.artist-work.work-wide{grid-column:auto}.portfolio-authorship .authorship-title{font-size:14px}}

/* Match the two-column Cyberpunk image to the single-column ETHandROLL image.
   Preserve the lower edge and crop excess image height from the top. */
@media(min-width:901px){
 .artist-work.work-wide .work-media{aspect-ratio:auto;height:0;padding-top:calc((100% - 20px)/2)}
 .artist-work.work-wide .work-media>img{position:absolute;inset:0;object-fit:cover;object-position:center bottom}
}


.portfolio-swipe-hint{display:none}
@media(max-width:900px){
 .portfolio-swipe-hint{display:block;margin:0 0 16px;color:#596172;font-size:14px}
 .artist-work-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(82%,340px);gap:18px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:2px;overscroll-behavior-x:contain;padding:2px 2px 18px;scrollbar-width:thin;scrollbar-color:#64735d #dce3dd}
 .artist-work-grid:focus-visible{outline:2px solid #111622;outline-offset:5px}
 .artist-work,.artist-work.work-wide{grid-column:auto;scroll-snap-align:start}
 .artist-work.work-wide .work-media{aspect-ratio:1}
 .artist-work.work-wide .work-media>img{object-fit:cover;object-position:center bottom}
}

.artist-portfolio{color:#111622;font-family:Arial,Helvetica,sans-serif}
.artist-portfolio h4{font-family:Arial,Helvetica,sans-serif;font-weight:700}
.artist-portfolio .work-media{isolation:isolate}

/* V20: the existing accessible control lives over each video poster. */
.artist-portfolio .work-media>.work-play{position:absolute;z-index:3;left:50%;top:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;width:90px;height:90px;min-width:90px;min-height:90px;padding:14px;border:1px solid #ffffffa6;border-radius:50%;background:#101b29bf;color:#fff;box-shadow:0 6px 24px #0005,inset 0 0 0 1px #ffffff12;backdrop-filter:blur(5px);font:700 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;touch-action:manipulation;transition:background-color .15s,border-color .15s}
.artist-portfolio .work-media>.work-play:hover{background:#101b29e8;border-color:#fff}
.artist-portfolio .work-media>.work-play:focus-visible{outline:3px solid #c7ff8b;outline-offset:5px;border-color:#fff;background:#101b29ed}
.work-play-icon{display:grid;place-items:center;width:25px;height:25px;flex:none}
.work-play-icon::before{content:'';display:block;width:0;height:0;margin-left:4px;border-top:9px solid transparent;border-bottom:9px solid transparent;border-left:14px solid currentColor}
.work-play-label{display:block;white-space:nowrap}
.artist-portfolio .work-media>.work-play[data-playback="loading"]{background:#101b29df;gap:9px;letter-spacing:.035em}
.work-play[data-playback="loading"] .work-play-icon::before{width:22px;height:22px;margin:0;border:2px solid #ffffff65;border-top-color:#fff;border-radius:50%;animation:gallery-loading-spin .8s linear infinite}
.artist-portfolio .work-media>.work-play[data-playback="playing"]{left:auto;right:12px;top:12px;transform:none;flex-direction:row;gap:8px;width:auto;height:44px;min-height:44px;min-width:88px;padding:10px 13px;border-radius:999px;background:#101b29bf;box-shadow:0 2px 12px #0003;font-size:10px;letter-spacing:.08em}
.work-play[data-playback="playing"] .work-play-icon{width:15px;height:18px}
.work-play[data-playback="playing"] .work-play-icon::before{width:12px;height:14px;margin:0;border:0;background:linear-gradient(to right,currentColor 0 33%,transparent 33% 67%,currentColor 67% 100%)}
.artist-portfolio .work-media>.work-play[data-playback="retry"]{border-color:#f9cbb5;background:#321f28d9}
@keyframes gallery-loading-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.work-play[data-playback="loading"] .work-play-icon::before{animation:none}.artist-portfolio .work-media>.work-play{transition:none}}