/* Siize Film app (bk450): the few things the live app needs beyond the approved prototype CSS. */
.sheet .box.narrow{width:min(460px,calc(100vw - 32px))}
.acct .seg{margin:8px 0 12px}
/* bk469: the account sheets are one column at every width (the settings grid class .acct made them three squeezed columns) */
/* bk471: the account and profile sheets get their padding back; the heading clears the close button */
.sheet .acct{display:block;min-width:0;padding:30px 28px 26px}.sheet .acct .h-l{font-size:clamp(24px,2.6vw,30px);line-height:1.08;margin:6px 44px 10px 0;text-wrap:balance}.sheet .acct .eyebrow{padding-right:44px}.sheet .acct .lv-form .btn{width:100%;justify-content:center}
.sheet .acct{display:block;min-width:0}.sheet .acct .muted,.sheet .acct .fine{overflow-wrap:anywhere}.sheet .box.narrow{overflow-x:hidden}
.lv-form{display:flex;flex-direction:column;gap:12px}
.lv-form .fld{display:flex;flex-direction:column;gap:6px}
.lv-form label{font-size:12px;color:var(--mut);font-weight:600}
.lv-form input,.lv-form select,.lv-form textarea,.inp{background:var(--raise);border:1px solid var(--line2);border-radius:10px;color:var(--ink);padding:11px 12px;font:inherit;min-height:44px}
.ld-err{color:var(--bad);font-size:13px}.ld-err.ok{color:var(--ok)}
.counsel{color:var(--gold);font-family:var(--f-mono);font-size:12px}
.fine{font-size:12px;color:var(--mut);margin:10px 0 0}
.bar{height:6px;border-radius:9px;background:var(--raise2);overflow:hidden;margin:8px 0 6px}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--violet),var(--violet2));border-radius:9px}
.grid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}
.card.sk{min-height:180px;background:linear-gradient(90deg,var(--raise),var(--raise2),var(--raise));background-size:200% 100%;animation:sk 1.2s linear infinite;border-radius:16px}
@keyframes sk{to{background-position:-200% 0}}
.empty b{display:block;font-size:16px;margin-bottom:6px}
.v{min-height:100%}
html,body{overflow-x:hidden}
.fbnote{position:absolute;top:54px;left:50%;transform:translateX(-50%);z-index:5;background:rgba(12,14,20,.82);border:1px solid var(--line2);padding:6px 12px;border-radius:999px;font-size:12px;color:var(--ink2);max-width:92%;text-align:center}
.profhead{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.watchwrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px}
@media (max-width:900px){.watchwrap{grid-template-columns:1fr}}
.verified svg{width:14px;height:14px;vertical-align:-2px;color:var(--ice)}
a.nav,a.btn{text-decoration:none;color:inherit}
a.btn.gold{color:#1b1204}
.upf .inp{width:100%}
@media (max-width:600px){.upf{grid-template-columns:1fr!important}}
.sm-grid{align-items:start}
.sm-chat{display:flex;flex-direction:column;min-height:60vh;max-height:calc(100vh - 140px);border:1px solid var(--line);border-radius:16px;background:var(--deck);overflow:hidden}
.sm-ch{display:flex;gap:10px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line)}.sm-ct{flex:1;min-width:0;display:flex;flex-direction:column}
.sm-video{padding:8px 12px;border-bottom:1px solid var(--line)}
.sm-msgs{flex:1;overflow:auto;padding:8px 14px}
.sm-comp{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);align-items:center}.sm-comp input{flex:1;background:var(--raise);border:1px solid var(--line2);border-radius:999px;color:var(--ink);padding:10px 14px;min-height:42px}
.sm-req{display:flex;flex-direction:column;gap:8px;padding:12px;border-top:1px solid var(--line)}
.sm-pick{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))!important}.sm-pk{display:flex;flex-direction:column;gap:4px;font-size:12px;text-align:left;border:1px solid var(--line);border-radius:10px;padding:4px;background:var(--raise)}.sm-pk img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px}.sm-pk.on{border-color:var(--gold)}
.sm-back{display:none}
.lrow.on{background:var(--raise2)}
@media (max-width:820px){.sm-grid{grid-template-columns:1fr!important}.sm.chat-open .sm-list{display:none}.sm:not(.chat-open) .sm-chat{display:none}.sm-back{display:inline-flex;transform:rotate(-90deg)}.sm-chat{max-height:calc(100vh - 160px)}}
.recdot{width:14px;height:14px;border-radius:50%;background:#f87171;animation:sk 1s ease-in-out infinite alternate}
.legal{display:flex;flex-direction:column;gap:2px;padding:8px 12px;font-size:11px}
#app.rail-min .legal{display:none}
.free-ribbon{max-width:calc(100% - 56px);white-space:normal}
[hidden]{display:none!important}
.pcrow small{display:block}
.pcrow b{display:block}

/* bk469: landscape film plays wide on a desktop (the picture's own shape, as large as the column and the screen height allow), and fills the width on a phone */
@media (min-width:960px){
  .slide:has(.stage.wide){align-items:center}
  .slide .stage.wide{aspect-ratio:var(--ar,16/9);height:auto;flex:none;max-width:none;width:min(calc(100% - 62px), calc((100vh - 150px) * 16 / 9))}
}
@media (max-width:959px){ .stage.wide{width:100%} .stage.wide video{object-fit:contain} }