.video-page{display:grid;gap:var(--space-5);align-items:start;grid-template-areas:"player" "info" "main"}@media(max-width:1099px){.video-page:not([data-theatre]){grid-template-areas:"player" "info" "main" "related"}.video-page:not([data-theatre]) .video-page__aside{display:contents}.video-page:not([data-theatre]) .video-head{grid-area:info;min-width:0}.video-page:not([data-theatre]) .video-page__related{grid-area:related;min-width:0}}@media(min-width:1100px){.video-page{grid-template-columns:minmax(0,1fr) 23rem;grid-template-rows:auto 1fr;grid-template-areas:"player info" "main   info"}}.video-page__player{grid-area:player;min-width:0}.video-page__main{grid-area:main;min-width:0;display:flex;flex-direction:column;gap:var(--space-6)}.video-page__aside{grid-area:info;min-width:0;display:flex;flex-direction:column;gap:var(--space-5)}.video-page__related-list{display:flex;flex-direction:column;gap:var(--space-3)}@media(min-width:1100px){.video-page__related-list .video-card--row .video-card__thumb,.video-page__related-list .playlist-card--row .playlist-card__stack{width:8.5rem}}.video-head{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--raised)}.video-head>h1{font-size:var(--text-lg)}.video-head__meta{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--ink-3)}.video-head__creator{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);padding-block:var(--space-3);border-block:1px solid var(--line)}.video-head__identity{display:flex;align-items:center;gap:var(--space-3);min-width:0;margin-inline-end:auto;color:inherit}.video-head__name{display:flex;align-items:center;gap:var(--space-1);font-family:var(--font-display);font-weight:600;color:var(--ink)}.video-head__handle{font-size:var(--text-sm);color:var(--ink-3)}.video-head__actions{display:flex;flex-wrap:wrap;gap:var(--space-2)}.video-head__actions>.btn{flex:1 1 8rem}.video-description{padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--raised);color:var(--ink-2);font-size:var(--text-sm)}.video-description>summary{display:flex;align-items:center;gap:var(--space-2);font-family:var(--font-display);font-weight:600;color:var(--ink);cursor:pointer}.video-description>p{margin-block-start:var(--space-3);white-space:pre-wrap}.comments{display:flex;flex-direction:column;gap:var(--space-4);padding:var(--space-4);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--raised)}.comments__toggle{align-self:center;color:var(--accent-ink)}.comments__toggle[aria-expanded=true] .comment__expand-arrow{transform:rotate(180deg)}.comments>.section-head{margin-block-end:0}.comments>.section-head>h2{font-size:var(--text-lg);margin-inline-end:0}.comments>.empty{border:0;background:none;padding-block:var(--space-5)}.comment-form{display:flex;flex-direction:column;gap:var(--space-2)}.comment-form__row{display:flex;align-items:flex-start;gap:var(--space-3)}.comment-form__field{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--space-2)}.comment-form textarea.input{resize:none;field-sizing:content;max-height:12lh}.comment__body>.comment-form{margin-block-start:var(--space-3)}.comment-form__actions{display:flex;justify-content:flex-end;gap:var(--space-2)}.comment-list,.comment__replies{display:flex;flex-direction:column;gap:var(--space-4);list-style:none}.comment{display:flex;gap:var(--space-3)}.comment__body{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--space-1)}.comment__head{display:flex;align-items:baseline;gap:var(--space-2)}.comment__author{font-weight:600;color:var(--ink);text-decoration:none}.comment__time{font-size:var(--text-xs);color:var(--ink-3)}.comment__text{color:var(--ink-2);white-space:pre-wrap}.comment__actions{display:flex;gap:var(--space-1);position:relative}.comment__delete{display:inline-flex}.comment__confirm{position:absolute;inset-block-start:calc(100% + var(--space-1));inset-inline-start:0;z-index:3;display:flex;flex-direction:column;gap:var(--space-2);width:max-content;max-width:min(18rem,100%);animation:comment-confirm-in var(--dur-micro) var(--ease);transform-origin:top left;padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--raised);box-shadow:var(--shadow-popover)}@keyframes comment-confirm-in{0%{opacity:0;transform:translateY(-4px) scale(.96)}}.comment__confirm-text{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm);color:var(--ink-2)}.comment__confirm-actions{display:flex;justify-content:flex-end;gap:var(--space-1)}.comment:last-child .comment__confirm,.comment__replies .comment:last-child .comment__confirm{inset-block-start:auto;inset-block-end:calc(100% + var(--space-1))}.comment__expand{align-self:flex-start;margin-block-start:var(--space-1);color:var(--accent-ink)}.comment__expand-arrow{transition:transform var(--dur-base) var(--ease)}.comment__expand[aria-expanded=true] .comment__expand-arrow{transform:rotate(180deg)}.comment__replies{margin-block-start:var(--space-3)}.comment__replies[data-depth="0"],.comment__replies[data-depth="1"]{padding-inline-start:var(--space-4);border-inline-start:1px solid var(--line)}.comment__replies:not([data-depth="0"]):not([data-depth="1"]){margin-inline-start:calc(-1 * (32px + var(--space-3)))}.app-main:has(.video-page[data-theatre]){max-width:none;padding-inline:0;padding-block-start:0}.video-page[data-theatre]{gap:0;grid-template-columns:minmax(0,1fr) min(26rem,28%);grid-template-areas:"player main" "info   info"}.video-page[data-theatre] .player{border-radius:0}.video-page[data-theatre][data-panel=closed]{grid-template-columns:minmax(0,1fr);grid-template-areas:"player" "info"}.video-page[data-theatre] .video-page__aside{display:flex;flex-direction:column;gap:var(--space-5);width:100%;padding:var(--space-5) var(--space-5) 0}.video-page[data-theatre] .video-page__related-list{display:grid;grid-auto-flow:column;grid-auto-columns:min(22rem,82%);gap:var(--space-4);overflow-x:auto;scroll-snap-type:x mandatory;padding-block-end:var(--space-2);scrollbar-width:thin}.video-page[data-theatre] .video-page__related-list>*{scroll-snap-align:start}.video-page[data-theatre] .video-page__related-list .video-card:hover{transform:none}.video-page[data-theatre] .video-page__related-list .video-card__extra{display:none}.video-page[data-theatre] .video-head{background:transparent}.video-page[data-theatre] .video-page__main{grid-area:main;align-self:stretch}body:has(.video-page[data-theatre]){--ground: #000;background:#000}.video-page[data-theatre] .video-page__player{display:flex;justify-content:center}.video-page[data-theatre] .player-dock__inner{width:min(100%,calc((100dvh - var(--nav-h)) * 16 / 9))}.theatre-stage{display:flex;flex-direction:column;height:100%;min-height:0}.theatre-bubbles{position:relative;flex:1;min-height:0;overflow:hidden;container-type:size;padding:var(--space-3) var(--space-3) var(--space-4);-webkit-mask-image:linear-gradient(to top,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(to top,transparent,#000 12%,#000 88%,transparent)}.theatre-bubble{position:absolute;--offset: calc((.18 + var(--lean, 0) * .82) * 46%);inset-inline-start:var(--offset);inset-block-end:0;width:max-content;max-width:calc(100% - var(--offset) - var(--gutter, 4%));display:flex;align-items:flex-start;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:color-mix(in oklab,var(--raised) 80%,#000);border:1px solid color-mix(in oklab,var(--line) 70%,transparent);color:var(--ink);text-align:start;font-size:var(--text-sm);cursor:pointer;animation-name:bubble-rise,bubble-sway;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-direction:normal,alternate}.theatre-bubble[data-preset="0"]{--gutter: 12%;border-radius:1.2rem 1.2rem 1.2rem .3rem}.theatre-bubble[data-preset="1"]{--gutter: 2%;border-radius:1.5rem 1.5rem .3rem;padding-inline:var(--space-4)}.theatre-bubble[data-preset="2"]{--gutter: 7%;border-radius:.3rem 1.4rem 1.4rem}.theatre-bubble[data-preset="3"]{--gutter: 0%;border-radius:1.6rem .3rem 1.6rem 1.6rem;padding-inline:var(--space-5)}.theatre-bubble>.avatar{--avatar-size: 26px}.theatre-bubble__body{min-width:0;display:flex;flex-direction:column;gap:2px}.theatre-bubble__quote{display:block;max-width:100%;padding-inline-start:var(--space-2);border-inline-start:2px solid var(--accent-ink);color:var(--ink-2);font-size:var(--text-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.theatre-bubble__quote .icon{vertical-align:-1px;margin-inline-end:2px}.theatre-bubble__author{font-weight:600;color:var(--accent-ink);font-size:var(--text-xs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.theatre-bubble__text{min-width:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.theatre-bubbles:focus-within .theatre-bubble{animation-play-state:paused}@keyframes bubble-rise{0%{translate:0 25cqh;opacity:0}6%{opacity:1}90%{opacity:1}to{translate:0 -100cqh;opacity:0}}@keyframes bubble-sway{0%{rotate:-2.2deg}to{rotate:2.2deg}}@media(prefers-reduced-motion:reduce){.theatre-bubble{animation:none;position:static;margin-block-start:var(--space-2)}.theatre-bubbles{display:flex;flex-direction:column-reverse;justify-content:flex-start;overflow-y:auto}.comment__confirm{animation:none}}.theatre-foot{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-2) var(--space-3) var(--space-3)}.theatre-composer{max-height:11rem;overflow-y:auto;font-size:var(--text-sm)}.theatre-popup{padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-card);background:var(--raised);color:var(--ink);box-shadow:var(--shadow-modal);pointer-events:auto}.theatre-popup__head{display:flex;align-items:center;gap:var(--space-2)}.theatre-popup__head>.btn{margin-inline-start:auto}.theatre-popup__text{margin-block-start:var(--space-2);color:var(--ink-2);font-size:var(--text-sm);white-space:pre-wrap;overflow-wrap:anywhere;max-height:40cqh;overflow-y:auto}.video-locked{display:grid;place-items:center;gap:var(--space-3);aspect-ratio:16 / 9;text-align:center;padding:var(--space-4);color:var(--ink-2)}.video-locked h2{font-size:var(--text-lg);color:var(--ink)}