/* v427 — single mobile contract for work information and trailer overlays. */
@media (max-width:720px){
  html.universal-sheet-open,
  html.universal-sheet-open body{
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }

  body.studio-theme .universal-work-sheet{
    display:grid!important;
    place-items:center!important;
    align-items:center!important;
    padding:12px!important;
  }

  body.studio-theme .universal-work-sheet>article{
    grid-template-columns:116px minmax(0,1fr)!important;
    width:min(500px,calc(100vw - 24px))!important;
    height:auto!important;
    min-height:0!important;
    max-height:calc(100dvh - 28px)!important;
    overflow:hidden!important;
    border-radius:19px!important;
  }

  body.studio-theme .universal-work-sheet__close{
    top:9px!important;
    right:9px!important;
  }

  body.studio-theme .universal-work-sheet__art{
    min-height:250px!important;
    background:#050b13!important;
  }
  body.studio-theme .universal-work-sheet__art>img{
    top:50%!important;
    right:6px!important;
    bottom:auto!important;
    left:6px!important;
    width:calc(100% - 12px)!important;
    height:auto!important;
    aspect-ratio:2/3!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:12px!important;
    transform:translateY(-50%)!important;
  }
  body.studio-theme .universal-work-sheet__art>button{
    top:50%!important;
    right:auto!important;
    bottom:auto!important;
    left:50%!important;
    width:48px!important;
    height:48px!important;
    display:grid!important;
    place-items:center!important;
    padding:0!important;
    border:1px solid #70c9ffb8!important;
    border-radius:50%!important;
    background:linear-gradient(145deg,#103a5ee8,#07182ee8)!important;
    box-shadow:0 12px 30px #000b,0 0 0 5px #168ff52b,inset 0 1px 0 #ffffff30!important;
    transform:translate(-50%,-50%)!important;
    backdrop-filter:blur(10px)!important;
  }
  body.studio-theme .universal-work-sheet__art>button i{
    position:relative!important;
    width:0!important;
    height:0!important;
    display:block!important;
    margin-left:3px!important;
    overflow:visible!important;
    border-top:7px solid transparent!important;
    border-bottom:7px solid transparent!important;
    border-left:11px solid #fff!important;
    border-radius:2px!important;
    background:transparent!important;
    color:transparent!important;
    font-size:0!important;
    filter:drop-shadow(0 2px 5px #0008)!important;
  }
  body.studio-theme .universal-work-sheet__art>button b{display:none!important}

  body.studio-theme .universal-work-sheet__copy{
    min-width:0!important;
    min-height:250px!important;
    padding:47px 13px 15px!important;
  }
  body.studio-theme .universal-work-sheet__copy>small{
    font-size:7px!important;
    letter-spacing:.1em!important;
  }
  body.studio-theme .universal-work-sheet__copy h2{
    margin:8px 0 7px!important;
    font-size:20px!important;
  }
  body.studio-theme .universal-work-sheet__copy p{
    font-size:10px!important;
    line-height:1.7!important;
    -webkit-line-clamp:4!important;
  }
  body.studio-theme .universal-work-sheet__copy>div{
    gap:4px!important;
    margin-top:10px!important;
    max-height:58px!important;
    overflow:hidden!important;
  }
  body.studio-theme .universal-work-sheet__copy>div span{
    padding:4px 6px!important;
    border-radius:7px!important;
    font-size:7px!important;
  }

  body.studio-theme .universal-work-sheet.is-trailer-only>article{
    display:block!important;
    width:min(620px,calc(100vw - 24px))!important;
    height:auto!important;
    min-height:0!important;
    max-height:calc(100dvh - 24px)!important;
    aspect-ratio:16/9!important;
    border-radius:18px!important;
    padding-bottom:0!important;
  }
  body.studio-theme .universal-work-sheet.is-trailer-only .universal-work-sheet__art{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    aspect-ratio:16/9!important;
  }
  body.studio-theme .universal-work-sheet.is-trailer-only .universal-work-sheet__art>img,
  body.studio-theme .universal-work-sheet.is-trailer-only .universal-work-sheet__art>span,
  body.studio-theme .universal-work-sheet.is-trailer-only .universal-work-sheet__art>button,
  body.studio-theme .universal-work-sheet.is-trailer-only .universal-work-sheet__copy{
    display:none!important;
  }
  body.studio-theme .universal-work-sheet.is-trailer-only .universal-work-sheet__art>iframe{
    display:block!important;
    width:100%!important;
    height:100%!important;
  }
}

@media (max-width:360px){
  body.studio-theme .universal-work-sheet>article{grid-template-columns:100px minmax(0,1fr)!important}
  body.studio-theme .universal-work-sheet__art,
  body.studio-theme .universal-work-sheet__copy{min-height:230px!important}
  body.studio-theme .universal-work-sheet__copy{padding-inline:10px!important}
}

/* Shared Studio detail dialog: one layout owner for every card entry point. */
body.studio-theme .studio-work-modal{padding:16px;align-items:center}
body.studio-theme .studio-work-modal>article{
  width:min(860px,100%);height:auto;min-height:0;max-height:calc(100dvh - 32px);
  padding:22px;display:grid;grid-template-columns:220px minmax(0,1fr);
  grid-template-areas:"art heading" "art facts" "art story" "art cast" "actions actions";
  grid-template-rows:auto;gap:12px 22px;align-items:start;
  overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;
  border-radius:22px;background:var(--studio-component-dialog-bg);color:var(--studio-color-text);
}
body.studio-theme .studio-work-modal .studio-work-info{display:contents}
body.studio-theme .studio-work-modal .studio-work-close{
  position:absolute;inset:10px auto auto;inset-inline-end:10px;width:36px;height:36px;z-index:8;
  border-color:var(--studio-component-dialog-border);font-size:22px;
}
body.studio-theme .studio-work-modal .studio-work-heading{grid-area:heading;min-width:0;padding-inline-end:26px}
body.studio-theme .studio-work-heading>[data-studio-work-tag]{display:inline-block;padding:3px 8px;border-radius:6px;background:rgba(var(--studio-rgb),.12);color:var(--studio-color-accent);font-size:11px;line-height:1.5}
body.studio-theme .studio-work-modal .studio-work-info h2{margin:7px 0 3px;color:var(--studio-color-text);font-size:clamp(20px,2vw,26px);line-height:1.4;letter-spacing:normal;overflow-wrap:anywhere}
body.studio-theme .studio-work-modal .studio-work-info h3{margin:0;color:var(--studio-color-text-muted);font-size:12px;line-height:1.6;overflow-wrap:anywhere}
/* Reserve the original portrait space so stretching artwork never enlarges the dialog. */
body.studio-theme .studio-work-art-reserve{grid-area:art;aspect-ratio:2/3;min-width:0;pointer-events:none}
body.studio-theme .studio-work-modal .studio-work-art{grid-area:1/1/-1/2;position:relative;align-self:stretch;min-height:0;width:calc(100% + 22px);height:auto;aspect-ratio:auto;margin-block:-22px;margin-inline:-22px 0;border:0;border-radius:0;overflow:hidden;isolation:isolate}
body.studio-theme .studio-work-modal .studio-work-art::after{z-index:1;inset:0;background:linear-gradient(to right,transparent 60%,var(--studio-component-dialog-bg)),linear-gradient(180deg,color-mix(in srgb,var(--studio-component-dialog-bg) 12%,transparent),transparent 18%,transparent 68%,var(--studio-component-dialog-bg));pointer-events:none}
body.studio-theme .studio-work-modal:dir(rtl) .studio-work-art::after{background:linear-gradient(to left,transparent 60%,var(--studio-component-dialog-bg)),linear-gradient(180deg,color-mix(in srgb,var(--studio-component-dialog-bg) 12%,transparent),transparent 18%,transparent 68%,var(--studio-component-dialog-bg))}
body.studio-theme .studio-work-modal .studio-work-art>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;aspect-ratio:auto;filter:brightness(.94) saturate(.97);transition:transform .55s ease,filter .35s ease}
body.studio-theme .studio-work-art:after{pointer-events:none}
body.studio-theme .studio-work-modal .studio-work-preview{width:68px;height:68px;gap:4px;z-index:3;box-shadow:0 0 0 6px #ffffff16,0 8px 24px #0005}
body.studio-theme .studio-work-preview svg{width:23px;height:23px;fill:currentColor}
body.studio-theme .studio-work-modal .studio-work-preview span{font-size:9px;line-height:1.4}
body.studio-theme .studio-work-trailer-empty{position:absolute;z-index:2;inset:auto 6px 10px;text-align:center;font-size:10px;line-height:1.5;color:var(--studio-color-text-muted);text-shadow:none}
body.studio-theme .studio-work-genres{display:flex;flex-wrap:wrap;gap:5px;margin:10px 0 0;min-width:0}
body.studio-theme .studio-work-genres>span{padding:3px 8px;border:1px solid var(--studio-component-dialog-border);border-radius:6px;color:var(--studio-color-text-muted);font-size:11px;line-height:1.5;max-width:100%;overflow-wrap:anywhere}
body.studio-theme .studio-work-facts{grid-area:facts;position:relative;display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;text-align:start;border:0;min-width:0}
body.studio-theme .studio-work-facts>div{position:relative;display:flex;align-items:center;gap:2px;min-width:0;max-width:100%;padding-inline-end:9px;border:1px solid var(--studio-component-dialog-border);border-radius:8px;background:color-mix(in srgb,var(--studio-color-accent) 5%,transparent)}
body.studio-theme .studio-work-facts dt{margin:0;line-height:1}
body.studio-theme .studio-work-facts [data-work-fact-toggle]{display:grid;place-items:center;width:34px;height:36px;padding:7px;border:0;border-radius:7px;background:transparent;color:var(--studio-color-accent);cursor:pointer}
body.studio-theme .studio-work-facts svg{width:18px;height:18px}
body.studio-theme .studio-work-facts dd{margin:0;font-size:12px;line-height:1.6;font-weight:650;color:var(--studio-color-text);unicode-bidi:isolate;overflow-wrap:anywhere}
body.studio-theme .studio-work-facts [role=tooltip]{position:absolute;z-index:9;inset:auto;left:var(--work-tooltip-left,0px);bottom:calc(100% + 8px);width:max-content;max-width:calc(100vw - 44px);box-sizing:border-box;padding:8px 12px;border:1px solid var(--studio-color-accent);border-radius:9px;background:var(--studio-color-accent);box-shadow:0 6px 20px #0004;color:var(--studio-color-on-accent);font-size:12px;font-weight:650;line-height:1.6;overflow-wrap:anywhere;visibility:hidden;opacity:0;transition:opacity .15s}
body.studio-theme .studio-work-facts [role=tooltip]::after{content:"";position:absolute;top:100%;left:calc(var(--work-tooltip-arrow,50%) - 5px);border:5px solid transparent;border-top-color:var(--studio-color-accent)}
body.studio-theme .studio-work-facts [role=tooltip][data-placement=below]{top:calc(100% + 8px);bottom:auto}
body.studio-theme .studio-work-facts [role=tooltip][data-placement=below]::after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:var(--studio-color-accent)}
body.studio-theme .studio-work-facts dt:has([aria-expanded=true]) [role=tooltip]{visibility:visible;opacity:1}
body.studio-theme .studio-work-modal .studio-work-info>p{grid-area:story;display:block;margin:0;height:auto;min-height:0;max-height:none;overflow:visible;font-size:13px;line-height:1.8;color:var(--studio-color-text-muted);overflow-wrap:anywhere}
body.studio-theme .studio-work-modal .studio-work-cast{grid-area:cast;display:block;margin:0;min-width:0}
body.studio-theme .studio-work-cast header strong{font-size:11px;color:var(--studio-color-text-muted)}
body.studio-theme .studio-work-cast>div{display:flex;flex-wrap:wrap;gap:8px;margin-top:7px;overflow:visible;padding:0}
body.studio-theme .studio-work-cast span{width:64px;gap:5px}
body.studio-theme .studio-work-cast :is(img,i){width:36px;height:36px;border:1px solid var(--studio-component-dialog-border);border-radius:50%;box-shadow:none}
body.studio-theme .studio-work-cast i{display:grid;place-items:center;color:var(--studio-color-text-muted);font-size:16px;background:var(--studio-color-surface)}
body.studio-theme .studio-work-cast b{max-width:64px;color:var(--studio-color-text-muted);font-size:9px;line-height:1.5}
body.studio-theme .studio-work-cast:has(.is-empty){display:none}
body.studio-theme .studio-work-modal .studio-work-actions{grid-area:actions;grid-column:2;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;margin:0;padding-top:12px;border-top:1px solid var(--studio-component-dialog-border)}
body.studio-theme .studio-work-modal .studio-work-actions :is(a,button){min-width:0;height:auto;min-height:42px;padding:8px 14px;font-size:12px;line-height:1.5;text-decoration:none}
body.studio-theme .studio-work-modal .studio-work-actions>a{grid-column:auto;background:linear-gradient(115deg,#ffe39a,#dbac43);border-color:#e6bd64;box-shadow:inset 0 1px #fff5;color:#302005;transition:filter .2s,box-shadow .2s}
body.studio-theme .studio-work-modal .studio-work-actions svg{width:18px;height:18px;flex:none}
body.studio-theme .studio-work-modal .studio-work-actions :is(a,button){gap:6px;border-radius:11px}
body.studio-theme .studio-work-modal .studio-work-actions>button{padding-inline:10px}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
 body.studio-theme .studio-work-modal:not(.is-previewing) .studio-work-art:hover>img{transform:scale(1.035);filter:brightness(1) saturate(1)}
 body.studio-theme .studio-work-modal .studio-work-actions>a:hover{filter:brightness(1.07);box-shadow:inset 0 1px #fff9,0 3px 12px #d9ae4226}
}
body.studio-theme .studio-work-modal .studio-work-actions>button{color:var(--studio-color-text-muted);background:var(--studio-color-surface);border-color:var(--studio-component-dialog-border);opacity:.8}
body.studio-theme .studio-work-modal [hidden]{display:none!important}
body.studio-theme .studio-work-modal :is(button,a):focus-visible{outline:2px solid var(--studio-color-accent);outline-offset:3px}
/* Small screens retain a portrait beside the heading, then use the full row. */
@media(max-width:600px){
 body.studio-theme .studio-work-modal{padding:10px}
 body.studio-theme .studio-work-modal>article{width:min(480px,100%);padding:16px;max-height:calc(100dvh - 20px);grid-template-columns:96px minmax(0,1fr);grid-template-areas:"art heading" "facts facts" "story story" "cast cast" "actions actions";gap:12px;border-radius:18px}
 body.studio-theme .studio-work-modal .studio-work-info h2{font-size:20px}
 body.studio-theme .studio-work-modal .studio-work-info h3{font-size:11px}
 body.studio-theme .studio-work-modal .studio-work-heading{padding-inline-end:16px}
 body.studio-theme .studio-work-genres{gap:4px;margin-top:8px}
 body.studio-theme .studio-work-genres>span{padding:2px 5px;font-size:10px}
 body.studio-theme .studio-work-modal .studio-work-preview{width:48px;height:48px;box-shadow:0 0 0 4px #ffffff16}
 body.studio-theme .studio-work-modal .studio-work-preview span{display:none}
 body.studio-theme .studio-work-trailer-empty{font-size:9px}
 body.studio-theme .studio-work-facts [data-work-fact-toggle]{width:36px;height:40px}
 body.studio-theme .studio-work-art-reserve{display:block}
 body.studio-theme .studio-work-modal .studio-work-art{grid-area:art;min-height:144px;width:calc(100% + 16px);margin-block:-16px 0;margin-inline:-16px 0}
 body.studio-theme .studio-work-modal .studio-work-actions{grid-column:1/-1;grid-template-columns:1fr 1fr}
 body.studio-theme .studio-work-modal .studio-work-actions>a{grid-column:1/-1}
 body.studio-theme .studio-work-cast span{width:calc((100% - 32px)/5)}
 body.studio-theme .studio-work-cast b{max-width:100%}
}
/* Trailer playback has its own landscape stage inside the same dialog. */
body.studio-theme .studio-work-modal.is-previewing>article{width:min(860px,100%,calc((100dvh - 92px) * 1.7778 + 24px));grid-template-columns:minmax(0,1fr);grid-template-areas:"art";padding:48px 12px 12px}
body.studio-theme .studio-work-modal.is-previewing .studio-work-info{display:none}
body.studio-theme .studio-work-modal.is-previewing .studio-work-art{grid-area:art;aspect-ratio:16/9;border-radius:10px;width:100%;margin:0;min-height:0}
body.studio-theme .studio-work-modal.is-previewing .studio-work-art-reserve,body.studio-theme .studio-work-modal.is-previewing .studio-work-art::after{display:none}
body.studio-theme .studio-work-modal.is-previewing .studio-work-art>:not([data-trailer-frame],[data-studio-trailer-back]){display:none!important}
body.studio-theme .studio-work-modal .studio-work-trailer-back{position:absolute;z-index:7;inset-block-start:8px;inset-inline-start:12px;display:flex;align-items:center;min-height:34px;padding:5px 10px;border:1px solid var(--studio-component-dialog-border);border-radius:7px;background:var(--studio-component-dialog-bg);color:var(--studio-color-text);font:inherit;font-size:12px}
@media(prefers-reduced-motion:reduce){body.studio-theme .studio-work-modal,body.studio-theme .studio-work-modal>article,body.studio-theme .studio-work-modal *{animation:none!important;transition:none!important}}
