:root:has(dialog.modal[open]){scrollbar-gutter:stable;overflow:hidden}dialog.modal{width:100%;max-width:none;height:100%;max-height:none;color:var(--ink);overscroll-behavior:contain;background:0 0;border:0;margin:0;padding:clamp(16px,4vw,48px)}dialog.modal[open]{place-items:center;display:grid}dialog.modal::backdrop{background:color-mix(in oklch, var(--ink) 30%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:.3s modal-fade}.modal-panel{border:1px solid var(--line);border-radius:var(--r-tile);background:var(--tile);max-width:100%;max-height:100%;box-shadow:var(--shadow-float);animation:modal-in .45s var(--ease-out);flex-direction:column;display:flex;overflow:hidden}.modal-close{background:color-mix(in oklch, var(--ink) 7%, transparent);width:36px;height:36px;color:var(--ink);border-radius:50%;flex-shrink:0;place-items:center;transition:background-color .25s,scale .1s;display:grid}.modal-close:active{scale:.94}@media (hover:hover) and (pointer:fine){.modal-close:hover{background:color-mix(in oklch, var(--ink) 12%, transparent)}}@keyframes modal-fade{0%{opacity:0}}@keyframes modal-in{0%{opacity:0;transform:translateY(16px)scale(.98)}}.ql-panel{width:min(100%,960px)}.ql-bar{padding:12px 12px 12px var(--pad-tile);border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;display:flex}.ql-title{min-width:0;font-size:var(--text-sm);text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:600;overflow:hidden}.ql-count{font-size:var(--text-xs);color:var(--ink-2);font-variant-numeric:tabular-nums;margin-left:auto;font-weight:600}.ql-stage{background:var(--tile-sunk);place-items:center;min-height:0;padding:10px;display:grid;position:relative}.ql-nav{-webkit-backdrop-filter:blur(14px)saturate(160%);backdrop-filter:blur(14px)saturate(160%);color:#131719;color:lab(7.24071% -1.2651 -2.48287);background:#ffffffc7;background:lab(100% 0 0/.78);border:1px solid #12171a1f;border:1px solid lab(7.24315% -1.55334 -3.10362/.12);border-radius:50%;place-items:center;width:40px;height:40px;transition:background-color .25s,scale .1s;display:grid;position:absolute;top:50%;translate:0 -50%;box-shadow:0 6px 16px -8px #00000059;box-shadow:0 6px 16px -8px lab(0% 0 0/.35)}.ql-prev{left:18px}.ql-next{right:18px}.ql-nav:active{scale:.94}@media (hover:hover) and (pointer:fine){.ql-nav:hover{background:#fffffff2;background:lab(100% 0 0/.95)}}.ql-img{border-radius:calc(var(--r-tile) - 10px);object-fit:contain;width:auto;max-width:100%;height:auto;max-height:calc(100dvh - 2*clamp(16px,4vw,48px) - 84px)}@media (prefers-reduced-motion:reduce){.modal-panel{animation-name:modal-fade}}.film{color:#f8f8f8;color:lab(97.68% -.0000298023 .0000119209);overscroll-behavior:contain;background:0 0;border:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:clamp(16px,4vw,48px)}.film[open]{place-items:center;animation:.3s modal-fade;display:grid}.film::backdrop{-webkit-backdrop-filter:blur(20px)saturate(140%);backdrop-filter:blur(20px)saturate(140%);background:#06070bc2;background:lab(1.95834% .105061 -1.66215/.76);animation:.3s modal-fade}:root:has(.film[open]){scrollbar-gutter:stable;overflow:hidden}.film-stage{width:min(100%,1180px,177.778dvh - 266.667px);min-width:min(100%,280px)}.film-bar{justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;display:flex}.film-title{min-width:0;font-size:var(--text-sm);align-items:baseline;gap:10px;font-weight:600;display:flex}.film-runtime{opacity:.62;font-variant-numeric:tabular-nums}.film-close{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#f8f8f8;color:lab(97.68% -.0000298023 .0000119209);background:#ffffff1f;background:lab(100% 0 0/.12);border:1px solid #ffffff29;border:1px solid lab(100% 0 0/.16);border-radius:50%;flex-shrink:0;place-items:center;width:36px;height:36px;transition:background-color .25s,scale .1s;display:grid}.film-close:focus-visible{outline-color:var(--mint)}.film-close:active{scale:.94}@media (hover:hover) and (pointer:fine){.film-close:hover{background:#fff3;background:lab(100% 0 0/.2)}}.film-frame{aspect-ratio:16/9;background:#000;border-radius:18px;overflow:hidden}.film-frame video{object-fit:contain;width:100%;height:100%}@media (prefers-reduced-motion:reduce){.film[open]{animation:none}.modal-close:active,.film-close:active,.ql-nav:active{scale:none}}