/* ===== Cinema player ===== */
html.lb-lock{overflow:hidden}
.lb{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}
.lb[hidden]{display:none}
.lb.is-open{opacity:1}
.lb__bg{position:absolute;inset:0;background:rgba(5,5,5,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.lb__wrap{position:relative;width:min(94vw,calc((100dvh - 190px) * 16 / 9));min-width:min(94vw,320px)}
.lb__head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:.9rem}
.lb__title b{display:block;font-family:var(--serif);font-weight:700;font-size:clamp(1.15rem,2.4vw,1.7rem);line-height:1.1;color:var(--fg)}
.lb__title span{display:block;margin-top:.3rem;font-size:.82rem;color:var(--fg-dim)}
.lb__frame{position:relative;aspect-ratio:16/9;background:#000;border-radius:10px;overflow:hidden;box-shadow:0 40px 140px rgba(0,0,0,.7);transform:scale(.965);transition:transform .45s var(--ease)}
.lb.is-open .lb__frame{transform:none}
.lb__slot,.lb__slot video,.lb__slot iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;object-fit:contain;background:#000}
.lb__shield{position:absolute;inset:0;z-index:2;border:0;background:none;cursor:pointer;padding:0}
.lb__shield::after{content:"";position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;background:var(--acid) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%230A0A0A' d='M9 5v14l11-7z'/%3E%3C/svg%3E") center/26px no-repeat;opacity:0;transform:scale(.7);transition:opacity .3s,transform .3s var(--ease);pointer-events:none}
.lb.is-paused .lb__shield::after{opacity:1;transform:none}
.lb__bar{display:flex;align-items:center;gap:.35rem;margin-top:.8rem}
.lb__bar button,.lb__close{width:40px;height:40px;border-radius:50%;border:1px solid rgba(244,243,238,.16);background:transparent;display:grid;place-items:center;cursor:pointer;padding:0;flex:none;transition:background .25s,border-color .25s}
.lb__bar button svg,.lb__close svg{width:17px;height:17px;fill:var(--fg);transition:fill .25s}
.lb__bar button:hover,.lb__bar button:focus-visible,.lb__close:hover,.lb__close:focus-visible{background:var(--acid);border-color:var(--acid);outline:none}
.lb__bar button:hover svg,.lb__bar button:focus-visible svg,.lb__close:hover svg,.lb__close:focus-visible svg{fill:#0A0A0A}
.lb__seek{flex:1;min-width:0;margin:0 .7rem;height:20px;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer}
.lb__seek::-webkit-slider-runnable-track{height:3px;border-radius:3px;background:linear-gradient(90deg,var(--acid) var(--p,0%),rgba(244,243,238,.18) var(--p,0%))}
.lb__seek::-moz-range-track{height:3px;border-radius:3px;background:rgba(244,243,238,.18)}
.lb__seek::-moz-range-progress{height:3px;border-radius:3px;background:var(--acid)}
.lb__seek::-webkit-slider-thumb{-webkit-appearance:none;width:13px;height:13px;border-radius:50%;background:var(--acid);margin-top:-5px;border:0}
.lb__seek::-moz-range-thumb{width:13px;height:13px;border-radius:50%;background:var(--acid);border:0}
.lb__seek:focus-visible{outline:2px solid var(--acid);outline-offset:4px;border-radius:4px}
.lb__time{font-size:.8rem;color:var(--fg-dim);font-variant-numeric:tabular-nums;white-space:nowrap;margin-right:.5rem}
.lb:fullscreen .lb__wrap{width:min(96vw,calc((100vh - 170px) * 16 / 9))}
@media (max-width:560px){.lb__time{display:none}.lb__bar button{width:38px;height:38px}}
@media (prefers-reduced-motion:reduce){.reels__layer,.lb,.lb__frame{transition:none}.reels__info.swap{animation:none}.reels__disc::before,.reels__live i{animation:none}}
/* player: portrait films fill the height */
.lb.is-portrait .lb__frame{aspect-ratio:auto;height:calc(100dvh - 190px);width:calc((100dvh - 190px) * 9 / 16);max-width:100%;margin:0 auto}
.lb.is-portrait:fullscreen .lb__frame{height:calc(100vh - 170px);width:calc((100vh - 170px) * 9 / 16)}

/* player: browse films endlessly */
.lb__frame.is-swap .lb__slot{animation:lbswap .45s var(--ease)}
@keyframes lbswap{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.lb__count{margin-left:.6rem;font-size:.78rem;color:var(--muted);font-variant-numeric:tabular-nums;flex:none}
.lb{overscroll-behavior:contain;touch-action:none}
@media (max-width:560px){.lb__count{margin-left:.3rem}}
@media (prefers-reduced-motion:reduce){.lb__frame.is-swap .lb__slot{animation:none}}
/* player bar */
.lb__bar{gap:.3rem;margin-top:.7rem}
.lb__bar button,.lb__close{width:34px;height:34px;border-color:rgba(244,243,238,.12)}
.lb__bar button svg,.lb__close svg{width:15px;height:15px}
.lb__bar [data-a=toggle]{width:38px;height:38px}
@media (max-width:560px){
  .lb__bar button{width:32px;height:32px}.lb__bar [data-a=toggle]{width:36px;height:36px}
  .lb__bar [data-a=restart]{display:none}
  .lb__close{width:32px;height:32px}
}

/* ===== Work grid ===== */
.wk__bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin:0 0 clamp(1.4rem,2.6vw,2.2rem);flex-wrap:wrap}
.wk__filters{display:flex;gap:.5rem;flex-wrap:wrap}
.wk__chip{appearance:none;font:inherit;font-size:.78rem;font-weight:500;letter-spacing:.04em;color:var(--fg-dim);background:transparent;border:1px solid var(--line);border-radius:999px;padding:.55rem 1.05rem;cursor:pointer;transition:color .25s,border-color .25s,background .25s}
.wk__chip:hover{color:var(--fg);border-color:rgba(244,243,238,.3)}
.wk__chip[aria-pressed=true]{background:var(--acid);border-color:var(--acid);color:#0A0A0A}
.wk__chip:focus-visible{outline:2px solid var(--acid);outline-offset:3px}
.wk__count{font-size:.78rem;color:var(--muted);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.wk__grid{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(1.1rem,2vw,1.75rem) clamp(1rem,1.8vw,1.5rem)}
.wk__card{appearance:none;font:inherit;color:inherit;text-align:left;background:none;border:0;padding:0;cursor:pointer;display:block;grid-column:span 2;min-width:0}
.wk__card[hidden]{display:none}
.wk__grid[data-n="1"] .wk__card,.wk__grid[data-n="2"] .wk__card,.wk__grid[data-n="4"] .wk__card{grid-column:span 3}
.wk__grid[data-n="5"] .wk__card:nth-child(n+4){grid-column:span 3}
.wk__grid[data-n="5"] .wk__card[style*="--n:3"],.wk__grid[data-n="5"] .wk__card[style*="--n:4"]{grid-column:span 3}
.wk__thumb{position:relative;display:block;aspect-ratio:16/9;border-radius:14px;overflow:hidden;background:var(--surface);border:1px solid var(--line-soft)}
.wk__thumb img,.wk__pv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease),opacity .4s}
.wk__pv{opacity:0}.wk__pv.is-live{opacity:1}
.wk__card:hover .wk__thumb img,.wk__card:focus-visible .wk__thumb img{transform:scale(1.04)}
.wk__thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,9,9,0) 55%,rgba(9,9,9,.55));pointer-events:none}
.wk__play{position:absolute;z-index:2;left:50%;top:50%;width:58px;height:58px;margin:-29px 0 0 -29px;border-radius:50%;display:grid;place-items:center;background:rgba(9,9,9,.5);border:1px solid rgba(244,243,238,.3);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .3s,border-color .3s,transform .4s var(--ease)}
.wk__play svg{width:20px;height:20px;fill:var(--fg);margin-left:3px;transition:fill .3s}
.wk__card:hover .wk__play,.wk__card:focus-visible .wk__play{background:var(--acid);border-color:var(--acid);transform:scale(1.08)}
.wk__card:hover .wk__play svg,.wk__card:focus-visible .wk__play svg{fill:#0A0A0A}
.wk__card:focus-visible{outline:none}
.wk__card:focus-visible .wk__thumb{outline:2px solid var(--acid);outline-offset:3px}
.wk__meta{display:block;padding:1rem .15rem 0}
.wk__meta small{display:block;font-size:.66rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--acid)}
.wk__meta b{display:block;margin-top:.5rem;font-family:var(--serif);font-weight:600;font-size:clamp(1.25rem,1.9vw,1.6rem);line-height:1.15;letter-spacing:-.01em}
.wk__meta span{display:block;margin-top:.45rem;font-size:.88rem;line-height:1.55;color:var(--fg-dim);font-weight:300;max-width:46ch}
.wk__more{margin-top:clamp(1.75rem,3vw,2.5rem)}
@media (max-width:900px){
  .wk__grid,.wk__grid[data-n]{grid-template-columns:repeat(2,1fr)}
  .wk__grid .wk__card,.wk__grid[data-n] .wk__card{grid-column:span 1}
  .wk__grid[data-n="1"] .wk__card,.wk__grid[data-n="3"] .wk__card:last-child,.wk__grid[data-n="5"] .wk__card:last-child{grid-column:span 2}
}
@media (max-width:560px){
  .wk__grid,.wk__grid[data-n]{grid-template-columns:1fr}
  .wk__grid .wk__card,.wk__grid[data-n] .wk__card,.wk__grid[data-n] .wk__card:last-child{grid-column:span 1!important}
  .wk__play{width:50px;height:50px;margin:-25px 0 0 -25px}
  .wk__filters{flex-wrap:nowrap;overflow-x:auto;margin-right:-1rem;padding-right:1rem;scrollbar-width:none}
  .wk__filters::-webkit-scrollbar{display:none}
  .wk__chip{white-space:nowrap;flex:none}
}
@media (prefers-reduced-motion:reduce){.wk__thumb img,.wk__play{transition:none}}

.wk__all{display:flex;justify-content:flex-end;align-self:end}
@media (max-width:860px){.wk__all{justify-content:flex-start}}
.lb__bar [hidden]{display:none}
.wk__card{align-self:start}

/* YouTube gate inside the player */
.lb__gate{position:absolute;inset:0;z-index:3;display:grid;place-items:center;background:#000}
.lb__gate img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35}
.lb__gate__in{position:relative;text-align:center;padding:1.25rem;max-width:30rem}
.lb__gate__in p{margin:0 0 1rem;font-size:.95rem;line-height:1.55;color:var(--fg)}
.lb__gate__in div{display:flex;gap:.6rem;justify-content:center;flex-wrap:wrap}
.lb__gate__in button,.lb__gate__in a{font:inherit;font-size:.78rem;font-weight:600;letter-spacing:.05em;padding:.65rem 1.15rem;border-radius:999px;cursor:pointer;text-decoration:none}
.lb__gate__in button{background:var(--acid);border:1px solid var(--acid);color:#0A0A0A}
.lb__gate__in a{border:1px solid rgba(244,243,238,.35);color:var(--fg)}
.lb__gate__in a:hover{border-color:var(--fg)}