[data-trailer-floor]{padding:clamp(18px,2vw,28px) max(10px,4vw) 24px;background:#030805;color:#eee5c8;box-sizing:border-box;min-height:calc(100svh - var(--t-header-desktop,72px))}
.q-trailer-heading{max-width:1140px;margin:0 auto 14px;text-align:center}
.q-trailer-ticket{color:#25dc71;font:400 15px/1.2 var(--t-font-display)}
.q-trailer-heading h2{margin:6px 0 4px;font:400 clamp(28px,3vw,42px)/1.1 var(--t-font-display);color:#f4e7cb;text-shadow:3px 3px #000}
.q-trailer-heading p{margin:4px 0;font:400 18px/1.25 var(--t-font-body)}
.q-trailer{width:min(1140px,100%);margin:auto;position:relative;box-sizing:border-box}
/* The whole player, screen and controls, fits the window under the header (70 px), the contract address deck
   (--q-ca-room) and the floor's heading (its padding and about 111 px) with 12 px to spare: its height is 2B + (W - 2B) * 9/16
   for the screen (B its frame) plus 160 px of deck, so W is capped at (window - above - 172 px - 2B) * 16/9 + 2B. At 1440 by
   900 the controls ended at 1073 px, under the fold; the player is now 736 px wide and ends at 888. Never narrower than
   600 px, where the four controls still sit on one row (a short window scrolls instead), never wider than before; phones
   keep the full width. (audit-B, 22 Oct.) */
@media(min-width:601px){
 .q-trailer{--trailer-crt:clamp(12px,2vw,24px);--trailer-above:calc(70px + var(--q-ca-room,0px) + clamp(18px,2vw,28px) + 111px);
  width:clamp(min(600px,100%),calc((100vh - var(--trailer-above) - 172px - 2 * var(--trailer-crt)) * 16 / 9 + 2 * var(--trailer-crt)),min(1140px,100%));
  width:clamp(min(600px,100%),calc((100svh - var(--trailer-above) - 172px - 2 * var(--trailer-crt)) * 16 / 9 + 2 * var(--trailer-crt)),min(1140px,100%))}
}
.q-trailer-screen{position:relative;border:clamp(12px,2vw,24px) solid transparent;border-image:url('community-art/crt.webp') 134 / 1 stretch;background:#030805;box-sizing:border-box}
.q-trailer-poster{position:absolute;inset:0;pointer-events:none}
.q-trailer-poster img{display:block;width:100%;height:100%;object-fit:contain}
.q-trailer[data-started="true"] .q-trailer-poster{display:none}
.q-trailer-screen video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;background:#030805}
.q-trailer-screen video::cue{font-family:Arial,sans-serif;color:white;background:rgb(0 0 0 / .85);font-size:clamp(14px,2vw,25px)}
.q-trailer-deck{position:relative;margin-top:-4px;padding:8px 14px 6px;border:12px solid transparent;border-image:url('community-art/deck.webp') 66 76 72 76 fill / 12px stretch;box-sizing:border-box}
.q-trailer-timeline{display:flex;align-items:center;gap:16px;margin-bottom:6px}
.q-trailer-timeline output{white-space:nowrap;color:#f4e7cb;font:400 20px/1.2 "VT323",monospace;min-width:108px;text-align:right}
.q-trailer-timeline input{flex:1;min-width:0;width:100%;height:44px;appearance:none;-webkit-appearance:none;background:none;cursor:pointer;touch-action:pan-y}
.q-trailer-timeline input::-webkit-slider-runnable-track{height:12px;border:3px solid #151e11;border-radius:5px;background:#25dc71;box-shadow:0 0 0 2px #777a5a}
.q-trailer-timeline input::-moz-range-track{height:8px;border:3px solid #151e11;border-radius:5px;background:#25dc71;box-shadow:0 0 0 2px #777a5a}
.q-trailer-timeline input::-webkit-slider-thumb{-webkit-appearance:none;width:30px;height:30px;margin-top:-12px;border:0;background:url('community-art/cheer.webp') center / contain no-repeat}
.q-trailer-timeline input::-moz-range-thumb{width:30px;height:30px;border:0;background:url('community-art/cheer.webp') center / contain no-repeat}
.q-trailer-timeline input:disabled{opacity:.5;cursor:default}
.q-trailer-controls{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
.q-trailer-controls button{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:112px;min-height:48px;padding:6px 16px;background:none;border:8px solid transparent;border-image:url('/media/trailer-v10/control-plate.webp') 110 130 fill / 8px 12px stretch;border-image-source:image-set(url('/media/trailer-v10/control-plate.avif') type('image/avif'),url('/media/trailer-v10/control-plate.webp') type('image/webp'));color:#25dc71;font:400 15px/1.2 var(--t-font-display);cursor:pointer;text-align:center;transition:transform .12s,filter .12s}
.q-trailer-controls [data-trailer-play]{color:#ffe1b4}
.q-trailer-controls button:hover{filter:brightness(1.3);transform:translateY(-1px)}
.q-trailer-controls button:active{transform:translateY(2px)}
.q-trailer :focus-visible,.q-trailer:focus-visible,.q-trailer-transcript summary:focus-visible{outline:3px solid #ffe36b;outline-offset:3px}
.q-trailer [data-trailer-status]{min-height:1.3em;margin:6px 0 0;text-align:center;color:#f4e7cb;font:400 14px/1.3 var(--t-font-body)}
.q-trailer-transcript{max-width:1080px;margin:22px auto 0;font:400 18px/1.5 var(--t-font-body)}
.q-trailer-transcript summary{cursor:pointer;list-style:none;text-align:center;text-decoration:underline;text-underline-offset:5px;color:#b6c5b6;font:400 15px/1.4 var(--t-font-display);padding:12px}
.q-trailer-transcript summary::-webkit-details-marker{display:none}
.q-trailer-transcript>div{max-width:720px;margin:20px auto;padding:0 12px}
.q-trailer:fullscreen{width:100%;max-width:none;height:100%;display:flex;flex-direction:column;justify-content:center;background:#030805;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
.q-trailer:fullscreen .q-trailer-screen{min-height:0;flex:1;border-width:0;display:flex;align-items:center;justify-content:center}
.q-trailer:fullscreen video{width:100%;height:100%;min-height:0;object-fit:contain}
.q-trailer:fullscreen .q-trailer-deck{flex:none;width:100%;padding:6px 20px;border-width:8px;margin:0}
.q-trailer:fullscreen [data-trailer-status]:empty{display:none}
@media(max-width:600px){
 [data-trailer-floor]{padding:22px 8px 20px;min-height:0}
 .q-trailer-heading{margin-bottom:16px}
 .q-trailer-deck{padding:12px 4px 6px;border-width:12px}
 .q-trailer-timeline{gap:6px;margin-bottom:8px}
 .q-trailer-timeline output{font-size:17px;min-width:83px}
 .q-trailer-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
 .q-trailer-controls button{min-width:0;min-height:44px;font-size:13px;padding:6px}
 .q-trailer [data-trailer-status]{font-size:14px}
}
@media(max-height:500px) and (orientation:landscape){
 .q-trailer:fullscreen .q-trailer-controls{display:flex;gap:8px}
 .q-trailer:fullscreen .q-trailer-controls button{min-height:36px;min-width:96px;font-size:12px;padding:4px}
 .q-trailer:fullscreen .q-trailer-timeline{margin-bottom:0}
}
@media(prefers-reduced-motion:reduce){.q-trailer-controls button{transition:none}}

.q-trailer-transcript>a{display:block;min-height:48px;padding:12px;text-align:center;text-underline-offset:5px;color:#b6c5b6}

/* The owner's order, 22 Oct 2026 : the trailer spans the full width of the screen. */
[data-trailer-floor]{padding-left:0;padding-right:0}
.q-trailer,.q-trailer-heading{max-width:none}
@media(min-width:601px){.q-trailer{width:100%}}