.portfolio-library{max-width:1700px;margin:0 auto;padding:0 28px 120px}.portfolio-tabs{display:flex;border-top:1px solid #252525;border-bottom:1px solid #252525;overflow-x:auto;scrollbar-width:none}.portfolio-tabs::-webkit-scrollbar{display:none}.portfolio-tab{position:relative;flex:1;min-width:142px;padding:25px 18px;border:0;border-right:1px solid #252525;background:transparent;color:#777;text-align:left;font:600 16px/1.2 inherit;cursor:pointer;transition:.25s}.portfolio-tab:first-child{border-left:1px solid #252525}.portfolio-tab sup{margin-left:7px;color:#555;font:700 10px/1 monospace}.portfolio-tab:after{content:"";position:absolute;left:18px;right:18px;bottom:-1px;height:2px;background:#b8ff00;transform:scaleX(0);transform-origin:left;transition:.25s}.portfolio-tab:hover,.portfolio-tab.is-active{color:#f2f2f2}.portfolio-tab.is-active:after{transform:scaleX(1)}.portfolio-tab.is-active sup{color:#b8ff00}.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:34px;scroll-margin-top:92px}.library-card{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;border:1px solid #252525;background:#111;color:#fff;text-align:left;cursor:pointer;padding:0}.library-card__video{width:100%;height:100%;display:block;object-fit:cover;filter:saturate(.78) brightness(.78);transition:transform .7s cubic-bezier(.2,.7,.2,1),filter .4s}.library-card__shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(0,0,0,.82))}.library-card__meta{position:absolute;left:28px;right:75px;bottom:25px;display:flex;flex-direction:column;gap:8px}.library-card__meta small{color:#b8ff00;font:700 12px/1.2 monospace;letter-spacing:.08em}.library-card__meta strong{overflow:hidden;color:#f5f5f5;font:600 clamp(18px,1.5vw,27px)/1.25 inherit;text-overflow:ellipsis;white-space:nowrap}.library-card__play{position:absolute;right:26px;bottom:22px;width:45px;height:45px;border:1px solid rgba(255,255,255,.5);border-radius:50%;font:300 37px/38px Arial;text-align:center;transition:.25s}.library-card__number{position:absolute;top:22px;right:24px;color:rgba(255,255,255,.65);font:700 12px/1 monospace}.library-card:hover .library-card__video{transform:scale(1.025);filter:saturate(1) brightness(.92)}.library-card:hover .library-card__play{border-color:#b8ff00;background:#b8ff00;color:#080808}.library-modal-open{overflow:hidden}.library-modal{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:28px}.library-modal__backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.88);backdrop-filter:blur(12px);cursor:pointer}.library-modal__panel{position:relative;width:min(1500px,94vw);max-height:94vh;padding:22px;background:#0b0b0b;border:1px solid #303030}.library-modal__top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:0 0 18px}.library-modal__top span{color:#b8ff00;font:700 12px/1.2 monospace}.library-modal__top h3{margin:7px 0 0;color:#f5f5f5;font:600 clamp(19px,2vw,30px)/1.2 inherit}.library-modal__close{width:44px;height:44px;border:1px solid #444;border-radius:50%;background:transparent;color:#fff;font:300 28px/1 Arial;cursor:pointer}.library-modal video{display:block;width:100%;max-height:calc(94vh - 115px);aspect-ratio:16/9;background:#000;object-fit:contain}@media(max-width:900px){.portfolio-library{padding:0 18px 72px}.portfolio-grid{grid-template-columns:1fr}.portfolio-tab{padding:19px 14px;font-size:14px}.library-card__meta{left:18px;bottom:17px}.library-card__play{right:16px;bottom:14px}.library-modal{padding:12px}.library-modal__panel{padding:12px;width:98vw}}

/* Mixed landscape / portrait work grid */
.portfolio-grid{grid-template-columns:repeat(12,minmax(0,1fr));align-items:start}
.library-card.is-landscape{grid-column:span 6;aspect-ratio:16/9}
.library-card.is-portrait{grid-column:span 3;aspect-ratio:9/16}
.library-card__media{position:absolute;inset:0;display:block;overflow:hidden;background:#0b0b0b}
.library-card.is-portrait .library-card__video{object-fit:cover}
.library-card.is-portrait .library-card__meta{left:20px;right:58px;bottom:20px}
.library-card.is-portrait .library-card__meta strong{font-size:clamp(16px,1.15vw,21px)}
.library-card.is-portrait .library-card__play{right:17px;bottom:17px;width:38px;height:38px;font-size:31px;line-height:32px}
.library-card.is-portrait .library-card__number{top:18px;right:18px}
.library-modal__stage{display:grid;place-items:center;width:100%;max-height:calc(94vh - 115px);background:#000;overflow:hidden}
.library-modal__panel.is-portrait{width:min(620px,94vw)}
.library-modal__panel.is-portrait .library-modal__stage{height:calc(94vh - 115px)}
.library-modal__panel.is-portrait video{width:auto;height:100%;max-width:100%;aspect-ratio:9/16}
.library-modal__panel:not(.is-portrait) .library-modal__stage{aspect-ratio:16/9}
.library-modal__panel:not(.is-portrait) video{width:100%;height:100%}

/* Restrained scroll reveal motion */
.reveal-on-scroll{opacity:0;transform:translate3d(0,34px,0);filter:blur(3px);transition:opacity .75s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),transform .9s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),filter .75s ease var(--reveal-delay,0ms);will-change:opacity,transform}
.reveal-on-scroll.is-visible{opacity:1;transform:translate3d(0,0,0);filter:blur(0)}
.library-card.reveal-on-scroll{transform:translate3d(0,42px,0) scale(.985)}
.library-card.reveal-on-scroll.is-visible{transform:translate3d(0,0,0) scale(1)}
@media(max-width:900px){.library-card.is-landscape{grid-column:span 12}.library-card.is-portrait{grid-column:span 9;justify-self:center;width:100%}.library-modal__panel.is-portrait{width:min(520px,96vw)}}
@media(prefers-reduced-motion:reduce){.reveal-on-scroll,.library-card.reveal-on-scroll{opacity:1;transform:none;filter:none;transition:none}.library-card__video{transition:none}}


/* About and stats readability */
.about-copy .kicker{font-size:clamp(22px,1.45vw,28px)!important;font-weight:700!important;letter-spacing:.06em!important}
.stats span{font-size:clamp(14px,.88vw,17px)!important;line-height:1.55!important;font-weight:700!important;letter-spacing:.055em!important;color:#a3a8a4!important}
@media(max-width:900px){.about-copy .kicker{font-size:20px!important}.stats span{font-size:13px!important}}
/* Smooth high-resolution hero playback */
.hero-video{transform:translateZ(0);will-change:transform;backface-visibility:hidden}

/* Final UI and performance pass */
.portrait{background-image:none!important;background:#090b0d!important}
.portrait img{opacity:1!important;object-fit:cover!important;object-position:50% 42%!important;filter:none!important}
.portfolio-tabs{position:sticky;top:0;z-index:24;background:#0d0f10}
.library-card{contain:layout paint;transform:translateZ(0)}
.library-card__video{backface-visibility:hidden;transform:translateZ(0)}
.reveal-on-scroll{filter:none!important;transform:translate3d(0,22px,0);transition:opacity .55s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms),transform .65s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms)}
.reveal-on-scroll.is-visible{will-change:auto}
.library-modal__backdrop{backdrop-filter:blur(6px)}
.portfolio-tab:focus-visible,.library-card:focus-visible,.library-modal__close:focus-visible{outline:2px solid #b8ff00;outline-offset:3px}
#work{scroll-margin-top:24px}
@media(hover:none){.library-card__video{transition:none}.library-card:hover .library-card__video{transform:none;filter:saturate(.9) brightness(.86)}}

/* Project role labels */
.library-card__shade{background:linear-gradient(180deg,transparent 22%,rgba(0,0,0,.94))}
.library-card__meta{right:82px;gap:7px;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.library-card__role{display:flex;flex-direction:column;gap:4px;max-height:0;overflow:hidden;opacity:0;transform:translateY(9px);transition:max-height .4s cubic-bezier(.2,.7,.2,1),opacity .25s ease,transform .35s cubic-bezier(.2,.7,.2,1)}
.library-card__role b{align-self:flex-start;padding:4px 7px;background:#b8ff00;color:#080a08;font:800 10px/1 monospace;letter-spacing:.08em}
.library-card__role span{color:#e3e6e3;font:600 clamp(11px,.76vw,14px)/1.5 inherit;letter-spacing:.012em}
.library-card:hover .library-card__role,.library-card:focus-visible .library-card__role{max-height:86px;opacity:1;transform:translateY(0)}
.library-modal__info{min-width:0}
.library-modal__panel{width:min(1580px,96vw);max-height:94vh;overflow:hidden}
.library-modal__content{display:grid;grid-template-columns:minmax(0,1fr) 330px;min-height:0;border-top:1px solid #252825}
.library-modal__stage{min-width:0;max-height:calc(94vh - 116px);background:#000}
.library-modal__panel:not(.is-portrait) .library-modal__stage{aspect-ratio:16/9}
.library-modal__panel:not(.is-portrait) video{width:100%;height:100%;max-height:none;aspect-ratio:auto}
.library-modal__panel.is-portrait{width:min(1020px,96vw)}
.library-modal__panel.is-portrait .library-modal__content{grid-template-columns:minmax(320px,1fr) 320px}
.library-modal__panel.is-portrait .library-modal__stage{height:calc(94vh - 116px);max-height:760px}
.library-modal__panel.is-portrait video{width:auto;height:100%;max-width:100%;max-height:none;aspect-ratio:9/16}
.library-modal__aside{display:flex;flex-direction:column;gap:30px;overflow-y:auto;padding:30px 28px;border-left:1px solid #252825;background:#101210}
.library-modal__aside section{display:flex;flex-direction:column;gap:10px}
.library-modal__aside section+section{padding-top:28px;border-top:1px solid #2a2d2a}
.library-modal__aside small{color:#8e958e;font:700 10px/1.3 monospace;letter-spacing:.1em}
.library-modal__aside strong{color:#b8ff00;font:700 clamp(20px,1.55vw,27px)/1.25 inherit}
.library-modal__aside p{margin:0;color:#e4e7e4;font:500 14px/1.75 inherit}
.library-card.is-portrait .library-card__meta{right:18px}
.library-card.is-portrait .library-card__role span{font-size:11px;line-height:1.5}
.library-card.is-portrait:hover .library-card__role,.library-card.is-portrait:focus-visible .library-card__role{max-height:112px}
@media(max-width:900px){.library-card__meta{right:68px}.library-card__role{max-height:100px;opacity:1;transform:none}.library-card__role span{font-size:12px}.library-modal__panel{max-height:96vh;overflow-y:auto}.library-modal__content,.library-modal__panel.is-portrait .library-modal__content{grid-template-columns:1fr}.library-modal__stage,.library-modal__panel.is-portrait .library-modal__stage{height:auto;max-height:58vh}.library-modal__panel.is-portrait video{height:58vh}.library-modal__aside{gap:20px;padding:22px 18px;border-top:1px solid #252825;border-left:0}.library-modal__aside section+section{padding-top:20px}}
@media(hover:none){.library-card__role{max-height:100px;opacity:1;transform:none}}
