/* Website Reels remain legible over bright and dark, unfiltered media. */
body.web-ui[data-page="/reels"] .main{padding-top:40px;padding-bottom:56px}
body.web-ui .reels-shell{max-width:720px;margin:auto;color:#171717}
body.web-ui .reels-stage{height:clamp(420px,74dvh,760px);border-radius:2px!important;background:#080808;color:#fff;max-width:100%;overflow:hidden}
body.web-ui .reels-stage>video,body.web-ui .reels-stage>.reels-photo{object-fit:contain;filter:none;background:#080808}
body.web-ui .reels-stage:after{background:linear-gradient(#0008,transparent 28%,transparent 55%,#000b);pointer-events:none}
body.web-ui .reels-stage :is(button,summary){background:#0009!important;color:#fff!important;border:1px solid #ffffff30!important;border-radius:2px!important;min-width:44px!important;min-height:44px!important;padding:10px;box-shadow:none;filter:none;transform:none;font-size:13px;font-weight:500;line-height:1.4;text-shadow:none}
body.web-ui .reels-stage :is(button,summary):hover{background:#fff!important;color:#171717!important;border-color:#fff!important;transform:none}
body.web-ui .reels-stage :is(button,summary):disabled{background:#0008!important;color:#bbb!important;border-color:#ffffff30!important;opacity:.7}
body.web-ui .reels-stage :is(button,summary,a,input):focus-visible{outline-color:#fff!important;outline-offset:3px;box-shadow:0 0 0 6px #000b!important}
body.web-ui .reels-stage :is(button,summary)>.ui-icon{display:block!important;width:24px;height:24px;stroke-width:1.65}
body.web-ui .reels-social [aria-pressed=true] .ui-icon{fill:currentColor!important;stroke:currentColor!important}
body.web-ui .reels-top{left:20px;right:20px;top:20px;gap:12px;flex-wrap:wrap;align-items:center}
body.web-ui .reels-top>div{gap:8px}
body.web-ui .reels-top>.reels-filter{position:static!important;transform:none!important;left:auto!important;top:auto!important;order:3;flex:0 0 auto;gap:0}
body.web-ui .reels-filter button{padding:10px 16px;min-width:44px;border-radius:0!important}
body.web-ui .reels-filter button[aria-pressed=true]{background:#fff!important;color:#171717!important;border-color:#fff!important}
body.web-ui .reels-social{right:20px;bottom:150px;gap:12px}
body.web-ui .reels-social button{min-width:52px;min-height:64px;padding:10px!important;flex-direction:column;gap:4px}
body.web-ui .reels-social .ui-icon{width:28px!important;height:28px!important}
body.web-ui .reels-social span{font-size:13px}
body.web-ui .reels-caption{left:20px;right:88px;bottom:96px;color:#fff;background:transparent;gap:12px;font-size:15px;max-width:none}
body.web-ui .reels-caption .initials{background:#333!important;color:#fff!important;border-color:#777!important}
body.web-ui .reels-caption .avatar{filter:none}
body.web-ui .reels-caption .reels-info{flex-shrink:0}
body.web-ui .reels-info>div{background:#171717!important;color:#fff!important;border:1px solid #666;border-radius:2px;padding:16px;z-index:8;max-width:240px}
body.web-ui .reels-info a,body.web-ui .reels-info p{color:#fff!important;font-size:14px;margin:8px 0}
body.web-ui .reels-views{color:#fff!important;font-size:12px}
body.web-ui .reels-switch{left:20px;right:20px;bottom:34px;color:#ddd;font-size:12px}
body.web-ui .reels-status{position:absolute;left:20px;right:20px;bottom:132px;z-index:7;color:#fff!important;background:#171717d9!important;border-radius:2px;padding:10px;font-size:14px;margin:0;pointer-events:none;max-width:none}
body.web-ui .reels-status:empty{display:none}
body.web-ui .reels-timeline{bottom:8px;left:20px;right:20px;height:24px}
body.web-ui .reels-timeline input[type=range]{min-height:24px!important;border:0!important;padding:0!important;background:transparent!important;accent-color:#fff;cursor:pointer;border-radius:0!important}
body.web-ui .reels-timeline input::-webkit-slider-runnable-track{background:linear-gradient(to right,#fff var(--seek-progress,0%),#ffffff60 var(--seek-progress,0%));height:3px}
body.web-ui .reels-timeline input::-webkit-slider-thumb{background:#fff;border:1px solid #111}
body.web-ui .reels-heart-burst{color:#fff!important;filter:drop-shadow(0 2px 8px #0009)}
body.web-ui .reels-heart-burst .ui-icon{fill:#fff!important;stroke:#fff!important}
body.web-ui .reels-hint{color:#555;font-size:14px;margin:20px auto;max-width:none}
body.web-ui .reels-comments-dialog{background:#fff!important;color:#171717!important;border-radius:2px!important;padding:24px;border:1px solid #aaa!important;max-width:calc(100vw - 32px)}
body.web-ui .reels-comments-head{background:#fff!important;border-color:#d5d5d5!important;gap:12px;padding-bottom:16px}
body.web-ui .reels-comments-head h2{font-size:24px;margin:0}
body.web-ui .reels-comments-head button{min-width:44px;min-height:44px;padding:10px!important;color:#171717!important;background:#f1f1f1!important;border:0}
body.web-ui .reels-comments-head button:hover{background:#171717!important;color:#fff!important}
body.web-ui .reels-comments-dialog .ui-icon{display:inline-block!important}
body.web-ui .reels-comment{background:#fff!important;color:#171717!important;border-color:#d5d5d5!important;padding:20px 0}
body.web-ui .reels-comment p{font-size:16px;line-height:1.6;color:#171717!important}
body.web-ui .reels-comment-head strong{font-size:15px}
body.web-ui .reels-comment-head time{margin-left:auto;text-align:right;font-size:12px;color:#606060!important}
body.web-ui .reels-comment-actions button{color:#333!important;background:transparent!important;border:0;min-height:44px;font-size:13px;padding:8px 12px}
body.web-ui .reels-comment-actions button:hover{background:#ededed!important;color:#171717!important}
body.web-ui .reels-comment-like{color:#333!important;background:transparent!important;min-width:44px;min-height:44px;padding:8px!important;border:0!important}
body.web-ui .reels-comment-like[aria-pressed=true] .ui-icon{fill:#171717!important;stroke:#171717!important}
body.web-ui .reels-comment-like .ui-icon{width:20px;height:20px}
body.web-ui .reels-comment-send{background:#171717!important;color:#fff!important;border:1px solid #171717!important;padding:12px 20px!important;font-size:14px;min-height:48px}
body.web-ui .reels-comment-send:hover{background:#444!important}
body.web-ui .reels-comments-dialog form .field{font-size:14px;margin-top:16px}
body.web-ui .reels-comments-dialog textarea{min-height:80px!important;max-height:200px}
body.web-ui .reels-comments-dialog :is([role=status],.field-hint){color:#555!important;font-size:13px}
body.web-ui :is(.reels-parent,.reels-reply-context,.is-new-comment,.reels-replies){background:#f2f2f2!important;color:#333!important;border-color:#aaa!important;border-radius:2px!important}
body.web-ui .reels-comment-editor{padding:16px;background:#f5f5f5;border:1px solid #d5d5d5}
body.web-ui .reel-upload-dialog{padding:24px;border-radius:2px!important}
body.web-ui :is(.reel-upload-choices,.reel-upload-selection){background:#fff!important;color:#171717!important;border-color:#ccc!important}
body.web-ui .reel-upload-dialog :is(.muted,small,[role=status]){color:#555!important}
body.web-ui .reel-upload-dialog :is(.ui-icon){color:inherit!important}
body.web-ui .reel-upload-dialog [data-upload-submit]{background:#171717;color:#fff}
body.web-ui .reels-shell:fullscreen{background:#080808;padding:0;display:flex;align-items:center;justify-content:center;max-width:none;width:100%;height:100%}
body.web-ui .reels-shell:fullscreen .reels-stage{width:var(--reels-full-width);height:var(--reels-full-height);max-width:100vw;max-height:100vh;border-radius:0!important}
body.web-ui .reels-shell:fullscreen .reels-stage video{object-fit:contain!important}
body.web-ui .reels-stage.reels-previewing{border-radius:2px!important}
body.web-ui .reels-stage.reels-previewing :is(button,summary){padding:8px!important;min-width:40px;min-height:40px}
@media(max-width:760px){body.web-ui .reels-top{left:14px;right:14px;top:14px}body.web-ui .reels-stage{height:clamp(440px,75dvh,720px)}body.web-ui .reels-top>.reels-filter{order:3;flex:0 0 100%;justify-content:center}body.web-ui .reels-caption{left:14px;right:80px;font-size:14px}body.web-ui .reels-social{right:14px}body.web-ui .reels-comments-dialog{padding:20px}body.web-ui .reels-comments-head h2{font-size:22px}body.web-ui .reels-comment-actions{flex-wrap:wrap}body.web-ui .reels-comment-head{flex-wrap:wrap;gap:8px}}
@media(max-width:480px){body.web-ui[data-page="/reels"] .main{padding:20px 12px 32px}body.web-ui .reels-top>div{gap:6px}body.web-ui .reels-caption .reels-views{position:absolute;top:-24px;left:0}body.web-ui .reels-comments-dialog{max-width:100vw;border-left:0!important;border-right:0!important;padding:16px}body.web-ui .reels-comments-head{gap:8px}body.web-ui .reels-comments-head button{padding:10px!important}body.web-ui .reels-switch{left:14px;right:14px}body.web-ui .reels-comment-head time{font-size:11px}}
