:root{--reel-blue:#075ee9;--reel-text:#11182e;--reel-muted:#66738b;--reel-line:#dfe6ef}
.reel-upload-message.is-success{display:flex;flex-direction:column;gap:4px;min-height:0;padding:12px 14px;border:1px solid #a7dfbc;border-radius:6px;background:#f0fdf4;color:#166534;line-height:1.5}
.reel-upload-message.is-success strong{font-weight:700;color:#166534}
.reel-success-popup{position:fixed;z-index:10020;inset:0;display:grid;place-items:center;padding:20px;background:rgba(0,0,0,.56);backdrop-filter:blur(2px);animation:reel-success-popup-in .18s ease-out}.reel-success-popup.is-closing{opacity:0;transition:opacity .18s ease}.reel-success-popup__panel{position:relative;box-sizing:border-box;width:min(100%,380px);margin-top:40px;padding:58px 26px 24px;border:1px solid #e5e7eb;border-radius:5px;background:#fff;box-shadow:0 18px 52px rgba(0,0,0,.24);text-align:center;color:#1f2937}.reel-success-popup__icon{position:absolute;top:-42px;left:calc(50% - 42px);box-sizing:border-box;width:84px;height:84px;display:grid;place-items:center;border:4px solid #fff;border-radius:50%;background:#68c348;color:#fff;box-shadow:0 2px 8px rgba(0,0,0,.12)}.reel-success-popup__icon:before{content:"";width:22px;height:12px;border-left:5px solid currentColor;border-bottom:5px solid currentColor;transform:rotate(-45deg);margin-top:-5px}.reel-success-popup__title{display:block;font-size:28px;line-height:1.25;font-weight:400;color:#333}.reel-success-popup__message{margin:12px 0 26px;font-size:15px;line-height:1.45;color:#555}.reel-success-popup__close{width:100%;min-height:44px;padding:0 18px;border:0;border-radius:3px;background:#68c348;color:#fff;font-size:16px;font-weight:600;cursor:pointer}.reel-success-popup__close:hover{background:#5ab43d}@keyframes reel-success-popup-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.reels-app{padding:16px;min-height:calc(100vh - 76px);color:var(--reel-text);background:#f8fafc;font-family:Inter,"Segoe UI",Arial,sans-serif}.reels-app *{box-sizing:border-box}.reels-app svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.reels-heading{min-height:70px;padding:11px 16px;display:flex;align-items:center;gap:13px;border-left:4px solid var(--reel-blue)}.reels-heading-icon{width:47px;height:47px;display:grid;place-items:center;border-radius:9px;background:#dceaff;color:var(--reel-blue)}.reels-heading-icon svg{width:28px;height:28px;fill:currentColor}.reels-heading h1{margin:0 0 4px;font-size:23px}.reels-heading small{color:var(--reel-muted)}.reels-add{height:38px;margin-left:auto;padding:0 16px;display:flex;align-items:center;gap:7px;border:0;border-radius:6px;background:var(--reel-blue);color:#fff;font-weight:700}.reels-toolbar{min-height:58px;margin-top:10px;padding:10px 13px;display:flex;align-items:center;gap:10px;overflow:auto}.reels-mode-tabs,.reels-quick-categories{display:flex;gap:8px}.reels-toolbar button,.reels-toolbar select{height:34px;padding:0 12px;white-space:nowrap;border:1px solid var(--reel-line);border-radius:6px;background:#fff;color:var(--reel-text)}.reels-toolbar button.active,.reels-toolbar button:hover{border-color:var(--reel-blue);background:var(--reel-blue);color:#fff}.reels-toolbar select{margin-left:auto}.reels-layout{margin-top:12px;display:grid;grid-template-columns:210px minmax(0,1fr) 285px;gap:14px;align-items:start}.reels-filters{position:sticky;top:88px;max-height:calc(100vh - 105px);overflow:hidden}.reels-filter-title{height:46px;padding:0 13px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--reel-line)}.reels-filter-title strong{font-size:14px}.reels-filter-title button,.reels-show-more{border:0;background:transparent;color:var(--reel-blue);font-size:11px}.reels-filter-scroll{max-height:calc(100vh - 160px);overflow:auto;padding:0 11px}.reels-filter-scroll section{padding:13px 2px;border-bottom:1px solid var(--reel-line)}.reels-filter-scroll h2{margin:0 0 10px;font-size:12px}.reels-filter-search{display:block;margin-bottom:7px}.reels-filter-search input{width:100%;height:30px;padding:0 8px;border:1px solid var(--reel-line);border-radius:5px;font-size:11px}.reels-check{min-height:29px;display:flex;align-items:center;gap:7px;font-size:11px}.reels-check input{margin:0}.reels-check span{min-width:0;flex:1}.reels-check em{padding:2px 5px;border-radius:8px;background:#f0f3f8;color:#59677f;font-style:normal;font-size:9px}.reels-check.is-extra{display:none}.reels-filter-scroll section.is-expanded .reels-check.is-extra{display:flex}.reels-check.is-search-hidden{display:none!important}.reels-filter-close{display:none}.reels-main{max-height:calc(100vh - 225px);padding:0 2px 25px;overflow:auto;scroll-behavior:smooth}.reel-feature{min-height:280px;padding:9px;display:grid;grid-template-columns:46% 1fr;gap:20px;border:1px solid var(--reel-line);border-radius:9px;background:#fff;box-shadow:0 3px 12px rgba(35,53,83,.06)}.reel-feature-media{position:relative;min-height:262px;overflow:hidden;border-radius:7px;background:#0e1724}.reel-feature-media video{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.reel-category-label,.reel-own-label{position:absolute;z-index:3;top:12px;left:12px;padding:5px 8px;border-radius:4px;background:var(--reel-blue);color:#fff;font-size:9px;font-weight:800}.reel-own-label{left:auto;right:12px;background:#5b36cf}.reel-play-button{position:absolute;z-index:4;top:45%;left:50%;width:54px;height:54px;display:grid;place-items:center;border:2px solid #fff;border-radius:50%;background:rgba(0,0,0,.3);color:#fff;transform:translate(-50%,-50%)}.reel-play-button svg{width:27px;height:27px;fill:currentColor}.is-playing>.reel-play-button,.is-playing .reel-play-button{display:none}.reel-duration{position:absolute;z-index:3;right:11px;bottom:10px;padding:4px 6px;border-radius:3px;background:rgba(0,0,0,.72);color:#fff;font-size:10px}.reel-feature-copy{padding:7px 5px}.reel-feature-copy h2{margin:0 0 17px;font-size:20px}.reel-feature-author,.reel-author{display:flex;align-items:center;gap:9px}.reel-avatar{width:36px;height:36px;flex:0 0 auto;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:#263b55;color:#fff;font-size:10px;font-weight:800}.reel-avatar img{width:100%;height:100%;object-fit:cover}.reel-feature-author strong,.reel-author strong{display:block}.reel-feature-author small,.reel-author small{display:block;margin-top:2px;color:var(--reel-muted);font-size:10px}.reel-feature-copy p{margin:17px 0;color:#40506b;line-height:1.55}.reel-tags{display:flex;flex-wrap:wrap;gap:7px}.reel-tags span{padding:5px 8px;border-radius:5px;background:#e4eeff;color:var(--reel-blue);font-size:10px}.reel-feature-actions{margin-top:20px;display:flex;align-items:center;gap:8px}.reel-feature-actions>span,.reel-feature-actions>.reel-like{height:34px;padding:0 10px;display:flex;align-items:center;gap:6px;border:0;border-radius:5px;background:#f2f5f9;color:#31415e}.reel-like{cursor:pointer}.reel-like.is-liked{color:#e22e57}.reel-like.is-liked svg{fill:currentColor}.reel-watch{height:35px;margin-left:auto;padding:0 18px;border:0;border-radius:5px;background:var(--reel-blue);color:#fff}.reel-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:13px}.reel-card{position:relative;height:430px;overflow:hidden;border-radius:9px;background:#0c1622;color:#fff;box-shadow:0 4px 13px rgba(14,25,40,.18)}.reel-card-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#0c1622}.reel-card-shade{position:absolute;inset:38% 0 0;background:linear-gradient(transparent,rgba(3,10,18,.95) 58%);pointer-events:none}.reel-card .reel-duration{right:auto;left:11px;bottom:145px}.reel-card-copy{position:absolute;z-index:3;left:12px;right:12px;bottom:9px}.reel-card-copy h3{min-height:42px;margin:0 0 10px;font-size:15px;line-height:1.3}.reel-author{padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.15)}.reel-author .reel-avatar{width:31px;height:31px}.reel-author strong{font-size:11px}.reel-author small{max-width:155px;overflow:hidden;color:#e3e9f1;text-overflow:ellipsis;white-space:nowrap}.reel-card-stats{height:34px;display:flex;align-items:center;gap:15px}.reel-card-stats>span,.reel-card-stats button{display:flex;align-items:center;gap:5px;border:0;background:transparent;color:#fff;font-size:10px}.reel-card-stats svg{width:15px}.reel-load-more{display:block;height:35px;margin:18px auto 4px;padding:0 25px;border:1px solid var(--reel-blue);border-radius:5px;background:#fff;color:var(--reel-blue)}.reel-lazy-status{text-align:center;color:var(--reel-muted);font-size:11px}.reel-empty{grid-column:1/-1;padding:60px 20px;text-align:center;border:1px solid var(--reel-line);border-radius:8px;background:#fff;color:var(--reel-muted)}.reels-right{position:sticky;top:88px;max-height:calc(100vh - 105px);display:flex;flex-direction:column;gap:12px;overflow:auto}.reels-right .s3-widget{margin:0}.reels-scroll-top{position:fixed;z-index:40;right:315px;bottom:25px;width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:50%;background:var(--reel-blue);color:#fff;box-shadow:0 7px 20px rgba(7,94,233,.3);opacity:0;pointer-events:none;transition:.2s}.reels-scroll-top.is-visible{opacity:1;pointer-events:auto}.reels-mobile-filter,.reels-overlay{display:none}.reel-upload-modal[hidden]{display:none}.reel-upload-modal{position:fixed;z-index:10000;inset:0;display:grid;place-items:center;padding:20px}.reel-upload-backdrop{position:absolute;inset:0;border:0;background:rgba(8,17,31,.66)}.reel-upload-modal>section{position:relative;width:min(650px,100%);max-height:92vh;overflow:auto;border-radius:12px;background:#fff;box-shadow:0 20px 70px rgba(0,0,0,.25)}.reel-upload-modal header{padding:18px 21px;display:flex;justify-content:space-between;border-bottom:1px solid var(--reel-line)}.reel-upload-modal h2{margin:0;font-size:21px}.reel-upload-modal header p{margin:5px 0 0;color:var(--reel-muted)}.reel-upload-modal header button{border:0;background:transparent;font-size:27px}.reel-upload-modal form{padding:19px 21px}.reel-upload-modal form>label{margin-bottom:14px;display:block;font-weight:700}.reel-upload-modal form>label>span,.reel-upload-modal legend span{color:#d32c4c}.reel-upload-modal input[type=text],.reel-upload-modal input[type=file],.reel-upload-modal textarea,.reel-upload-modal select{width:100%;margin-top:6px;padding:9px;border:1px solid #d5deea;border-radius:6px;background:#fff}.reel-upload-modal textarea{resize:vertical}.reel-upload-modal form>small{display:block;margin:-7px 0 14px;color:var(--reel-muted)}.reel-upload-modal fieldset{margin:0 0 14px;padding:12px;border:1px solid var(--reel-line);border-radius:7px}.reel-upload-categories{display:grid;grid-template-columns:1fr 1fr;gap:8px}.reel-upload-message{min-height:20px;margin:6px 0;color:var(--reel-muted)}.reel-upload-message.is-error{color:#c62828}.reel-upload-message.is-success{color:#158247}.reel-upload-modal footer{display:flex;justify-content:flex-end;gap:8px}.reel-upload-modal footer button{height:37px;padding:0 17px;border:1px solid var(--reel-line);border-radius:6px;background:#fff}.reel-upload-modal footer button[type=submit]{border-color:var(--reel-blue);background:var(--reel-blue);color:#fff}.reel-modal-open{overflow:hidden}
@media(max-width:1500px){.reels-layout{grid-template-columns:200px minmax(0,1fr) 260px}.reel-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.reels-scroll-top{right:285px}}
@media(max-width:1180px){.reels-layout{grid-template-columns:200px minmax(0,1fr)}.reels-right{grid-column:1/-1;position:static;max-height:none;display:grid;grid-template-columns:1fr 1fr}.reels-scroll-top{right:25px}.reels-quick-categories{display:none}}
@media(max-width:768px){.reels-app{padding:10px}.reels-heading{min-height:64px}.reels-heading small{display:none}.reels-add{padding:0 11px}.reels-toolbar{display:block}.reels-mode-tabs{overflow:auto}.reels-toolbar select{width:100%;margin:8px 0 0}.reels-layout{display:block}.reels-filters{position:fixed;z-index:9000;top:0;bottom:0;left:0;width:min(330px,88vw);max-height:none;border-radius:0;transform:translateX(-105%);transition:.2s}.reels-filter-open .reels-filters{transform:translateX(0)}.reels-filter-scroll{max-height:calc(100vh - 100px)}.reels-filter-close{width:calc(100% - 20px);height:39px;margin:7px 10px;display:block;border:0;border-radius:6px;background:var(--reel-blue);color:#fff}.reels-mobile-filter{margin:9px 0;display:flex;align-items:center;gap:6px;border:0;background:transparent;color:var(--reel-blue)}.reels-overlay{position:fixed;z-index:8999;inset:0;border:0;background:rgba(0,0,0,.45)}.reels-filter-open .reels-overlay{display:block}.reels-main{max-height:none;overflow:visible}.reel-feature{grid-template-columns:1fr}.reel-feature-media{min-height:240px}.reel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.reel-card{height:390px}.reels-right{display:block}.reels-right .s3-widget{margin-top:12px}.reel-upload-categories{grid-template-columns:1fr}}
@media(max-width:520px){.reel-grid{grid-template-columns:1fr}.reel-card{height:520px}.reel-feature-copy h2{font-size:17px}.reel-feature-actions{flex-wrap:wrap}.reel-watch{margin-left:0}.reels-mode-tabs button{flex:1}.reels-heading-icon{display:none}}

/* One complete featured reel per carousel viewport. */
.reel-feature-shell{position:relative}.reel-feature-carousel{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:6px;scrollbar-width:none}.reel-feature-carousel::-webkit-scrollbar{display:none}.reel-feature-carousel>.reel-feature{min-width:100%;scroll-snap-align:start;scroll-snap-stop:always}.reel-feature-nav{position:absolute;z-index:12;top:50%;width:34px;height:42px;padding:0;border:0;border-radius:7px;background:rgba(8,23,47,.78);color:#fff;font-size:28px;line-height:1;transform:translateY(-50%);box-shadow:0 4px 12px rgba(0,0,0,.2)}.reel-feature-nav--prev{left:8px}.reel-feature-nav--next{right:8px}

/* Reels owns its geometry inside the shared member shell. These selectors
   intentionally outrank legacy Bootstrap/member declarations. */
body.reels-page-shell .reels-app .reels-heading {
    width: 100%;
    height: 76px !important;
    min-height: 76px !important;
    padding: 11px 16px !important;
    display: grid !important;
    grid-template-columns: 48px minmax(0, 1fr) auto !important;
    align-items: center !important;
    justify-items: stretch !important;
    gap: 14px !important;
    overflow: hidden;
}
body.reels-page-shell .reels-app .reels-heading > * { margin-top: 0 !important; margin-bottom: 0 !important; }
body.reels-page-shell .reels-app .reels-heading-icon { grid-column: 1; margin: 0 !important; }
body.reels-page-shell .reels-app .reels-heading > span:nth-child(2) { grid-column: 2; display: block !important; width: auto !important; text-align: left !important; }
body.reels-page-shell .reels-app .reels-heading h1 { margin: 0 0 4px !important; text-align: left !important; line-height: 1.15 !important; }
body.reels-page-shell .reels-app .reels-add { grid-column: 3; position: static !important; float: none !important; margin: 0 !important; }

body.reels-page-shell .reels-app .reels-toolbar {
    width: 100%;
    height: 62px !important;
    min-height: 62px !important;
    padding: 10px 13px !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) 145px !important;
    align-items: center !important;
    gap: 10px !important;
    overflow: visible !important;
}
body.reels-page-shell .reels-mode-tabs,
body.reels-page-shell .reels-quick-categories { min-width: 0; align-items: center; overflow-x: auto; scrollbar-width: thin; }

.reels-sort { grid-column: 3; position: relative; width: 145px; margin-left: auto; }
.reels-sort-toggle { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.reels-sort-toggle svg { width: 14px !important; height: 14px !important; }
.reels-sort-menu {
    position: absolute;
    z-index: 80;
    top: calc(100% + 6px);
    right: 0;
    width: 168px;
    padding: 6px;
    display: none;
    border: 1px solid #dbe3ee;
    border-radius: 8px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(20, 39, 72, .16);
}
.reels-sort-menu.is-open { display: block; }
body.reels-page-shell .reels-app .reels-sort-menu button {
    width: 100%;
    height: 36px;
    padding: 0 10px;
    display: block;
    border: 0;
    text-align: left;
    background: #fff;
    color: #17223a;
}
body.reels-page-shell .reels-app .reels-sort-menu button:hover,
body.reels-page-shell .reels-app .reels-sort-menu button.active { border-radius: 5px; background: #eaf2ff; color: var(--reel-blue); }

body.reels-page-shell .reels-layout {
    height: calc(100vh - 280px);
    min-height: 520px;
    align-items: stretch !important;
}
@media (min-width: 769px) {
    body.reels-page-shell .reels-app[data-is-guest="1"] .reels-layout {
        height: calc(100vh - 218px);
    }
}
body.reels-page-shell .reels-filters,
body.reels-page-shell .reels-main,
body.reels-page-shell .reels-right {
    position: relative;
    top: auto;
    height: 100%;
    max-height: none;
    min-height: 0;
}
body.reels-page-shell .reels-filters { display: flex; flex-direction: column; overflow: hidden; }
body.reels-page-shell .reels-filter-footer {
    flex: 0 0 auto;
    padding: 10px 12px;
    border-top: 1px solid var(--reel-line);
    background: #fff;
}
body.reels-page-shell .reels-filter-reset {
    width: 100%;
    height: 36px;
    border: 1px solid var(--reel-blue);
    border-radius: 6px;
    background: var(--reel-blue);
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}
body.reels-page-shell .reels-filter-title-actions { display: flex; align-items: center; gap: 8px; }
body.reels-page-shell .reels-filter-dismiss { display: none; }
body.reels-page-shell .reels-filter-scroll {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: scroll;
    scrollbar-width: auto;
    scrollbar-color: #9fb3cf #edf2f8;
}
.reels-filter-scroll::-webkit-scrollbar,
body.reels-page-shell .reels-right .s3-widget-scroll::-webkit-scrollbar { display: block !important; width: 9px !important; height: 9px !important; }
.reels-filter-scroll::-webkit-scrollbar-track,
body.reels-page-shell .reels-right .s3-widget-scroll::-webkit-scrollbar-track { background: #edf2f8; border-radius: 10px; }
.reels-filter-scroll::-webkit-scrollbar-thumb,
body.reels-page-shell .reels-right .s3-widget-scroll::-webkit-scrollbar-thumb { background: #9fb3cf; border: 2px solid #edf2f8; border-radius: 10px; }
.reels-filter-scroll::-webkit-scrollbar-thumb:hover,
body.reels-page-shell .reels-right .s3-widget-scroll::-webkit-scrollbar-thumb:hover { background: #718bab; }

.reels-filter-toggle {
    width: 100%;
    min-height: 30px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 0;
    background: transparent;
    color: #11182e;
    font-size: 12px;
    font-weight: 700;
    text-align: left;
}
.reels-filter-toggle svg { width: 14px !important; height: 14px !important; transition: transform .2s ease; }
.reels-filter-content { display: block; padding-top: 6px; }
.reels-filter-scroll section.is-collapsed .reels-filter-content { display: none; }
.reels-filter-scroll section.is-collapsed .reels-filter-toggle svg { transform: rotate(-90deg); }
.reels-filter-empty { display: block; padding: 8px 0; color: #75829a; font-size: 11px; }

body.reels-page-shell .reels-main { padding-right: 7px; overflow-x: hidden; overflow-y: scroll; scrollbar-width: auto; scrollbar-color: #9fb3cf #edf2f8; }
body.reels-page-shell .reels-main::-webkit-scrollbar { display: block; width: 9px; }
body.reels-page-shell .reels-main::-webkit-scrollbar-track { background: #edf2f8; border-radius: 10px; }
body.reels-page-shell .reels-main::-webkit-scrollbar-thumb { background: #9fb3cf; border: 2px solid #edf2f8; border-radius: 10px; }
.reel-load-more[hidden] { display: none !important; }
.reel-empty { min-height: calc(100vh - 335px); display: grid; place-items: center; }

body.reels-page-shell .reels-right {
    width: auto !important;
    max-width: none !important;
    padding-right: 5px;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: repeat(2, minmax(240px, 1fr)) !important;
    align-items: stretch !important;
    overflow: hidden !important;
}
body.reels-page-shell .reels-right > .s3-widget {
    width: 100% !important;
    height: 100% !important;
    min-height: 240px !important;
    max-height: none !important;
    padding: 16px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
}
body.reels-page-shell .reels-right .s3-widget-head { flex: 0 0 auto !important; display: flex !important; margin: 0 0 12px !important; }
body.reels-page-shell .reels-right .s3-widget-head h2 { display: block !important; margin: 0 !important; font-size: 14px !important; color: #11182e !important; }
body.reels-page-shell .reels-right .s3-widget-scroll {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    padding-right: 5px;
    overflow-x: hidden !important;
    overflow-y: scroll !important;
    scrollbar-width: auto !important;
    scrollbar-color: #9fb3cf #edf2f8 !important;
}
body.reels-page-shell .reels-right .s3-panel-link { flex: 0 0 auto !important; margin-top: 10px !important; }

/* Keep every panel scrollable without displaying native scrollbar tracks. */
body.reels-page-shell .reels-filter-scroll,
body.reels-page-shell .reels-main,
body.reels-page-shell .reels-right,
body.reels-page-shell .reels-right .s3-widget-scroll,
body.reels-page-shell .reels-mode-tabs,
body.reels-page-shell .reels-quick-categories {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    scrollbar-gutter: auto !important;
}
body.reels-page-shell .reels-filter-scroll,
body.reels-page-shell .reels-main,
body.reels-page-shell .reels-right .s3-widget-scroll {
    overflow-y: auto !important;
}
body.reels-page-shell .reels-filter-scroll {
    width: auto !important;
    align-self: stretch !important;
    padding-right: 12px !important;
    padding-left: 12px !important;
}
body.reels-page-shell .reels-filter-content {
    width: 100% !important;
    min-width: 0 !important;
    overflow: hidden !important;
}
body.reels-page-shell .reels-filter-search {
    width: 100% !important;
    min-width: 0 !important;
    display: block !important;
}
body.reels-page-shell .reels-filter-search input[type="search"] {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}
body.reels-page-shell .reels-filter-search input[type="search"]:focus {
    outline: 0 !important;
    box-shadow: none !important;
}
body.reels-page-shell .reels-right .s3-widget-scroll {
    padding-right: 0 !important;
}
body.reels-page-shell .reels-filter-scroll::-webkit-scrollbar,
body.reels-page-shell .reels-main::-webkit-scrollbar,
body.reels-page-shell .reels-right::-webkit-scrollbar,
body.reels-page-shell .reels-right .s3-widget-scroll::-webkit-scrollbar,
body.reels-page-shell .reels-mode-tabs::-webkit-scrollbar,
body.reels-page-shell .reels-quick-categories::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}
body.reels-page-shell #sidebar,
body.reels-page-shell #sidebarMobile,
body.reels-page-shell #sidebar .is2-side-nav {
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
}
body.reels-page-shell #sidebar::-webkit-scrollbar,
body.reels-page-shell #sidebarMobile::-webkit-scrollbar,
body.reels-page-shell #sidebar .is2-side-nav::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

@media(max-width:1180px) {
    body.reels-page-shell .reels-layout { height: auto; min-height: 0; }
    body.reels-page-shell .reels-main { height: calc(100vh - 280px); min-height: 520px; }
    body.reels-page-shell .reels-right { height: 360px; display: grid !important; grid-template-columns: 1fr 1fr !important; grid-template-rows: minmax(0, 1fr) !important; }
}
@media(max-width:768px) {
    body.reels-page-shell .reels-app .reels-toolbar { height: auto !important; grid-template-columns: 1fr !important; }
    body.reels-page-shell .reels-app .reels-sort { grid-column: 1; width: 100%; margin-left: 0; }
    body.reels-page-shell .reels-layout { height: auto; }
    body.reels-page-shell .reels-filters { position: fixed; top: 0; bottom: 0; height: auto; max-height: 100dvh; }
    body.reels-page-shell .reels-filter-dismiss {
        width: 30px;
        height: 30px;
        padding: 0;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: #eef3fa;
        color: #53627a;
        font-size: 22px;
        line-height: 1;
    }
    body.reels-page-shell .reels-main { height: auto; max-height: none; min-height: 0; overflow: visible; }
    body.reels-page-shell .reels-right { height: auto; display: block !important; overflow: visible !important; }
    body.reels-page-shell .reels-right > .s3-widget { height: 320px !important; margin-top: 12px !important; }
    .reel-empty { min-height: 320px; }
}

/* Explicit video picker; legacy Bootstrap hides native file controls. */
.reel-video-upload-field { margin-bottom: 16px; }
.reel-file-picker[hidden] { display: none !important; }
.reel-field-label { margin-bottom: 7px; color: #17223a; font-weight: 700; }
.reel-field-label span { color: #d32c4c; }
body.reels-page-shell .reel-file-picker {
    width: 100%;
    min-height: 76px;
    margin: 0 !important;
    padding: 12px 14px;
    display: grid !important;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    box-sizing: border-box !important;
    border: 1px dashed #9eb5d3;
    border-radius: 8px;
    background: #f8fbff;
    cursor: pointer;
}
body.reels-page-shell .reel-file-picker:hover { border-color: var(--reel-blue); background: #f1f6ff; }
body.reels-page-shell .reel-file-picker input[type="file"] {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
    opacity: 0 !important;
}
.reel-file-picker-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 8px; background: #dfebff; color: var(--reel-blue); }
.reel-file-picker-icon svg { width: 21px !important; height: 21px !important; }
.reel-file-picker-copy { min-width: 0; }
.reel-file-picker-copy strong { display: block; color: #17223a; font-size: 13px; }
.reel-file-picker-copy small { display: block; margin-top: 4px; overflow: hidden; color: #6a7890; font-size: 11px; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.reel-file-browse { padding: 7px 12px; border: 1px solid var(--reel-blue); border-radius: 6px; background: #fff; color: var(--reel-blue) !important; font-size: 11px; font-weight: 700; }
.reel-file-help { display: block; margin-top: 6px; color: #68768e; font-size: 11px; }

/* Card proportions and playback presentation. */
@media(max-width:1700px) and (min-width:1181px) {
    body.reels-page-shell .reel-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
body.reels-page-shell .reel-card {
    width: 100%;
    height: auto !important;
    min-height: 390px;
    aspect-ratio: 9 / 16;
    isolation: isolate;
}
body.reels-page-shell .reel-card-video {
    z-index: 0;
    object-fit: cover !important;
    object-position: center center;
    background: #080f19 !important;
    cursor: pointer;
}
.reel-feature-media video { object-fit: cover !important; object-position: center center; cursor: pointer; }
body.reels-page-shell .reel-card.is-playing .reel-card-video,
body.reels-page-shell .reel-feature.is-playing .reel-feature-media video {
    z-index: 6;
    object-fit: cover !important;
    background: #000 !important;
}
body.reels-page-shell .reel-card.is-playing .reel-category-label,
body.reels-page-shell .reel-card.is-playing .reel-duration,
body.reels-page-shell .reel-feature.is-playing .reel-feature-media .reel-category-label,
body.reels-page-shell .reel-feature.is-playing .reel-feature-media .reel-duration {
    opacity: 0;
    pointer-events: none;
}
body.reels-page-shell .reel-card.is-playing .reel-card-copy {
    z-index: 8;
    display: block;
    pointer-events: none;
}
body.reels-page-shell .reel-card.is-playing .reel-card-shade {
    z-index: 7;
    opacity: 1;
    pointer-events: none;
}
body.reels-page-shell .reel-card.is-playing .reel-card-stats {
    z-index: 8;
    bottom: 58px;
    pointer-events: auto;
}
body.reels-page-shell .reel-card.is-playing .reel-card-stats button {
    pointer-events: auto;
}
body.reels-page-shell .reel-card-copy h3,
body.reels-page-shell .reel-card-copy strong,
body.reels-page-shell .reel-card-copy small,
body.reels-page-shell .reel-card-stats,
body.reels-page-shell .reel-card-stats span,
body.reels-page-shell .reel-card-stats button {
    color: #fff !important;
    -webkit-text-fill-color: currentColor !important;
}
body.reels-page-shell .reel-card-copy h3 { text-shadow: 0 1px 4px rgba(0, 0, 0, .7); }
body.reels-page-shell .reel-card-copy { right: 58px; bottom: 13px; }
body.reels-page-shell .reel-card-stats {
    position: absolute;
    z-index: 5;
    right: 9px;
    bottom: 58px;
    width: 42px;
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}
body.reels-page-shell .reel-card-stats > span,
body.reels-page-shell .reel-card-stats > button {
    width: 42px;
    min-height: 42px;
    padding: 2px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #fff;
    text-shadow: 0 1px 3px rgba(0, 0, 0, .8);
    transition: transform .16s ease, background-color .16s ease;
}
body.reels-page-shell .reel-card-stats > button:hover { background: rgba(255, 255, 255, .12); transform: scale(1.06); }
body.reels-page-shell .reel-card-stats svg {
    width: 25px;
    height: 25px;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .9));
}
body.reels-page-shell .reel-card-stats b { font-size: 11px; line-height: 1; }
body.reels-page-shell .reel-card-stats > button.reel-like.is-liked { color: #ff416c !important; }
body.reels-page-shell .reel-card-stats > button.reel-like.is-liked svg { fill: currentColor; }
body.reels-page-shell .reel-fullscreen-toggle,
body.reels-page-shell .reel-progress {
    display: none !important;
}
body.reels-page-shell .reel-card-stats > .reel-sound-toggle { order: 1; }
body.reels-page-shell .reel-card-stats > .reel-like { order: 2; }
body.reels-page-shell .reel-card-stats > span { order: 3; }
body.reels-page-shell .reel-card-stats > .reel-card-share { order: 4; }
body.reels-page-shell .reel-card-stats > .reel-sound-toggle svg { width: 24px; height: 24px; }
body.reels-page-shell .reel-card-share { position: relative; width: 42px; height: 42px; }
body.reels-page-shell .reel-card-share > .reel-share-toggle {
    width: 42px;
    height: 42px;
    padding: 2px;
    display: grid;
    place-items: center;
    border: 0;
    background: transparent;
    color: #fff;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .9));
    transition: transform .16s ease, background-color .16s ease;
}
body.reels-page-shell .reel-card-share > .reel-share-toggle:hover,
body.reels-page-shell .reel-card-share > .reel-share-toggle[aria-expanded="true"] { background: rgba(255, 255, 255, .12); transform: scale(1.06); }
body.reels-page-shell .reel-card-share-menu {
    position: absolute;
    z-index: 12;
    right: calc(100% + 5px);
    bottom: 7px;
    padding: 5px;
    display: flex;
    align-items: center;
    gap: 5px;
    border-radius: 8px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 5px 18px rgba(0, 0, 0, .3);
}
body.reels-page-shell .reel-card-share-menu[hidden] { display: none !important; }
html body.reels-page-shell .reel-card-share-menu > .network-share__button {
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    min-height: 28px !important;
    padding: 2px !important;
}
body.reels-page-shell .reel-card.is-playing .reel-fullscreen-toggle {
    position: absolute;
    z-index: 9;
    top: 11px;
    right: auto;
    left: 11px;
    width: 36px;
    height: 36px;
    padding: 0;
    display: grid !important;
    place-items: center;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, .48);
    color: #fff;
    filter: drop-shadow(0 1px 3px rgba(0, 0, 0, .75));
    transition: transform .16s ease, background-color .16s ease;
}
body.reels-page-shell .reel-card.is-playing .reel-fullscreen-toggle:hover { background: rgba(0, 0, 0, .7); transform: scale(1.06); }
.reel-upload-modal form>label.reel-featured-option{display:flex;align-items:flex-start;gap:10px;padding:12px;border:1px solid var(--reel-line);border-radius:7px;background:#f8faff;cursor:pointer}.reel-featured-option>input,.reel-featured-option>.checker{width:17px;height:17px;flex:0 0 17px;margin:2px 0 0;accent-color:var(--reel-blue)}.reel-featured-option>span{display:flex;min-width:0;flex-direction:column;color:var(--reel-text)}.reel-featured-option>span>strong{font-size:12px}.reel-featured-option>span>small{margin-top:3px;color:var(--reel-muted);font-size:10px;font-weight:400;line-height:1.4}
body.reels-page-shell .reel-fullscreen-toggle svg { width: 19px; height: 19px; }
body.reels-page-shell .reel-card.is-playing.is-paused .reel-play-button {
    z-index: 9;
    display: grid;
    opacity: 1;
}
body.reels-page-shell .reel-card.is-playing .reel-progress {
    --reel-progress: 0%;
    position: absolute;
    z-index: 9;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 4px;
    margin: 0;
    padding: 0;
    display: block !important;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    outline: 0;
    background: transparent;
    cursor: pointer;
}
body.reels-page-shell .reel-progress::-webkit-slider-runnable-track {
    width: 100%;
    height: 2px;
    border: 0;
    background: linear-gradient(to right, #fff 0, #fff var(--reel-progress), rgba(255,255,255,.52) var(--reel-progress), rgba(255,255,255,.52) 100%);
    box-shadow: 0 -1px 3px rgba(0, 0, 0, .45);
}
body.reels-page-shell .reel-progress::-webkit-slider-thumb {
    width: 1px;
    height: 2px;
    margin-top: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    border-radius: 0;
    background: #fff;
}
body.reels-page-shell .reel-progress::-moz-range-track { height: 2px; border: 0; background: rgba(255,255,255,.52); }
body.reels-page-shell .reel-progress::-moz-range-progress { height: 2px; background: #fff; }
body.reels-page-shell .reel-progress::-moz-range-thumb { width: 1px; height: 2px; border: 0; border-radius: 0; background: #fff; }

/* Reel actions and upload validation. */
body.reels-page-shell .reel-card .reel-own-label { right: 48px; }
body.reels-page-shell .reel-card.is-playing .reel-own-label { z-index: 9; opacity: 1; pointer-events: none; }
body.reels-page-shell .reel-card-menu { position: absolute; z-index: 10; top: 8px; right: 8px; }
body.reels-page-shell .reel-card-menu > button {
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, .48);
    color: #fff;
    font-size: 15px;
    letter-spacing: 1px;
}
body.reels-page-shell .reel-card-menu > div {
    position: absolute;
    top: 36px;
    right: 0;
    width: 96px;
    padding: 3px;
    display: none;
    border: 1px solid rgba(255, 255, 255, .15);
    border-radius: 6px;
    background: #fff;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .22);
}
body.reels-page-shell .reel-card-menu.is-open > div { display: block; }
body.reels-page-shell .reel-card-menu a,
body.reels-page-shell .reel-card-menu > div > button {
    width: 100%;
    padding: 6px 7px;
    display: block;
    border: 0;
    border-radius: 4px;
    background: transparent;
    color: #17223a;
    font-family: inherit;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.25;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
}
body.reels-page-shell .reel-card-menu a:hover,
body.reels-page-shell .reel-card-menu > div > button:hover { background: #edf4ff; color: var(--reel-blue); }
body.reels-page-shell .reel-card-menu > div > .reel-menu-delete { color: #c52b3e; }
body.reels-page-shell .reel-card-menu > div > .reel-menu-delete:hover { background: #fff0f2; color: #a51f31; }
body.reels-page-shell .reel-card-menu > div > button:disabled { opacity: .55; cursor: wait; }
body.reels-page-shell .reel-card.is-playing .reel-card-menu { display: block; }

body.reels-page-shell [data-reel-video-field][hidden] { display: none !important; }

body.reels-page-shell .reel-upload-loader[hidden] { display: none !important; }
body.reels-page-shell .reel-upload-loader {
    position: absolute;
    z-index: 20;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 13px;
    border-radius: 12px;
    background: rgba(255, 255, 255, .92);
    color: #17223a;
}
body.reels-page-shell .reel-upload-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid #dce8fa;
    border-top-color: var(--reel-blue);
    border-radius: 50%;
    animation: reel-upload-spin .75s linear infinite;
}
@keyframes reel-upload-spin { to { transform: rotate(360deg); } }

body.reels-page-shell .reel-field-error {
    min-height: 0;
    margin: 5px 0 0 !important;
    display: block !important;
    color: #cf243f !important;
    font-size: 11px;
    font-weight: 600;
}
body.reels-page-shell .reel-file-picker.is-invalid,
body.reels-page-shell .reel-upload-modal input.is-invalid,
body.reels-page-shell .reel-upload-modal fieldset.is-invalid {
    border-color: #cf243f !important;
    background-color: #fff6f7 !important;
    box-shadow: 0 0 0 2px rgba(207, 36, 63, .09);
}
/* Dedicated reel view. */
body.reels-page-shell .reel-view-page { min-height: calc(100vh - 76px); padding: 16px; background: #f7f9fc; color: #11182e; }
body.reels-page-shell .reel-view-header { min-height: 72px; padding: 12px 18px; display: flex; align-items: center; gap: 20px; border-left: 4px solid var(--reel-blue); }
body.reels-page-shell .reel-view-back { padding: 8px 12px; border: 1px solid #dce4ef; border-radius: 6px; color: var(--reel-blue); font-size: 12px; font-weight: 700; text-decoration: none; }
body.reels-page-shell .reel-view-header h1 { margin: 0; font-size: 20px; }
body.reels-page-shell .reel-view-header p { margin: 4px 0 0; color: #6a7890; font-size: 11px; }
body.reels-page-shell .reel-view-layout { width: min(1040px, 100%); min-height: calc(100vh - 190px); margin: 14px auto 0; padding: 18px; display: grid; grid-template-columns: minmax(280px, 430px) minmax(280px, 1fr); gap: 28px; align-items: center; }
body.reels-page-shell .reel-view-media { width: 100%; height: min(72vh, 720px); overflow: hidden; border-radius: 12px; background: #000; box-shadow: 0 12px 35px rgba(9, 20, 38, .18); }
body.reels-page-shell .reel-view-media video { width: 100%; height: 100%; display: block; object-fit: contain; background: #000; }
body.reels-page-shell .reel-view-details { align-self: center; }
body.reels-page-shell .reel-view-author { padding-bottom: 16px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid #e2e8f1; }
body.reels-page-shell .reel-view-author .reel-avatar { width: 46px; height: 46px; }
body.reels-page-shell .reel-view-author strong { display: block; font-size: 14px; }
body.reels-page-shell .reel-view-author small { margin-top: 3px; display: block; color: #66738b; font-size: 11px; }
body.reels-page-shell .reel-view-details h2 { margin: 22px 0 10px; font-size: 24px; line-height: 1.3; }
body.reels-page-shell .reel-view-description { margin: 0 0 18px; color: #42516a; font-size: 13px; line-height: 1.65; }
body.reels-page-shell .reel-view-tags { display: flex; flex-wrap: wrap; gap: 7px; }
body.reels-page-shell .reel-view-tags span { padding: 6px 9px; border-radius: 6px; background: #e8f1ff; color: var(--reel-blue); font-size: 11px; }
body.reels-page-shell .reel-view-actions { margin-top: 22px; display: flex; gap: 10px; }
body.reels-page-shell .reel-view-actions > span,
body.reels-page-shell .reel-view-actions > button { min-height: 40px; padding: 0 13px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #dfe6ef; border-radius: 7px; background: #f7f9fc; color: #25344e; font-size: 12px; }
body.reels-page-shell .reel-view-actions svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; }
body.reels-page-shell .reel-view-actions .is-liked { color: #ef315a; }
body.reels-page-shell .reel-view-actions .is-liked svg { fill: currentColor; }
body.reels-page-shell .reel-view-meta { margin: 22px 0 0; padding-top: 16px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; border-top: 1px solid #e2e8f1; }
body.reels-page-shell .reel-view-meta div { min-width: 0; }
body.reels-page-shell .reel-view-meta dt { color: #7a879b; font-size: 10px; text-transform: uppercase; }
body.reels-page-shell .reel-view-meta dd { margin: 4px 0 0; color: #17223a; font-size: 12px; font-weight: 700; }
body.reels-page-shell .reel-focused-detail { display: grid; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); gap: 16px; align-items: stretch; margin: 0 0 18px; }
body.reels-page-shell .reel-focused-info { box-sizing: border-box; min-width: 0; padding: 18px; border: 1px solid #dfe6ef; border-radius: 8px; background: #fff; }
body.reels-page-shell .reel-focused-eyebrow { margin: 0 0 8px; color: #66738b; font-size: 11px; font-weight: 700; }
body.reels-page-shell .reel-focused-info h2 { margin: 0 0 16px; color: #11182e; font-size: 22px; line-height: 1.35; overflow-wrap: anywhere; }
body.reels-page-shell .reel-focused-author { display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid #e2e8f1; }
body.reels-page-shell .reel-focused-author .reel-avatar { width: 42px; height: 42px; flex: 0 0 auto; }
body.reels-page-shell .reel-focused-author strong,
body.reels-page-shell .reel-focused-author small { display: block; }
body.reels-page-shell .reel-focused-author strong { color: #17223a; font-size: 13px; }
body.reels-page-shell .reel-focused-author small { margin-top: 3px; color: #66738b; font-size: 11px; }
body.reels-page-shell .reel-focused-description { margin: 14px 0; color: #42516a; font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
body.reels-page-shell .reel-focused-description:not(.is-expanded) { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 4; }
body.reels-page-shell .reel-focused-description-toggle { margin: -6px 0 12px; padding: 0; border: 0; background: transparent; color: var(--reel-blue); font-size: 12px; font-weight: 700; cursor: pointer; }
body.reels-page-shell .reel-focused-description-toggle[hidden] { display: none !important; }
body.reels-page-shell .reel-focused-categories { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
body.reels-page-shell .reel-focused-categories span { padding: 5px 8px; border-radius: 5px; background: #e8f1ff; color: var(--reel-blue); font-size: 11px; }
body.reels-page-shell .reel-focused-meta { margin: 14px 0 0; padding-top: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; border-top: 1px solid #e2e8f1; }
body.reels-page-shell .reel-focused-meta div { min-width: 0; }
body.reels-page-shell .reel-focused-meta dt { color: #7a879b; font-size: 10px; text-transform: uppercase; }
body.reels-page-shell .reel-focused-meta dd { margin: 3px 0 0; color: #17223a; font-size: 12px; font-weight: 700; }
body.reels-page-shell .reel-focused-video { width: 100%; max-width: 280px; justify-self: start; }
body.reels-page-shell .reel-focused-video .reel-card { width: 100%; }
body.reels-page-shell .reel-more-heading { margin: 12px 0 0; color: #17223a; font-size: 18px; }
@media(max-width:800px) {
    body.reels-page-shell .reel-view-page { padding: 10px; }
    body.reels-page-shell .reel-view-header { align-items: flex-start; flex-direction: column; gap: 10px; }
    body.reels-page-shell .reel-view-layout { min-height: 0; grid-template-columns: 1fr; }
    body.reels-page-shell .reel-view-media { height: min(70vh, 620px); }
    body.reels-page-shell .reel-focused-detail { grid-template-columns: minmax(0, 1fr); }
    body.reels-page-shell .reel-focused-video { max-width: 330px; justify-self: center; }
}

/* On phones the right-side cards exist only inside the header grid drawer. */
@media(max-width:768px) {
    body.reels-page-shell #reels-right-drawer {
        position: fixed !important;
        z-index: 9100 !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        left: auto !important;
        width: min(360px, 92vw) !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        padding: 0 14px 18px !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border-left: 1px solid #dfe6ef;
        background: #f7f9fc;
        box-shadow: -12px 0 36px rgba(7, 27, 67, .2);
        transform: translateX(105%);
        visibility: hidden;
        pointer-events: none;
        transition: transform .22s ease, visibility 0s linear .22s;
    }
    body.reels-page-shell.wall-right-drawer-open #reels-right-drawer {
        transform: translateX(0);
        visibility: visible;
        pointer-events: auto;
        transition-delay: 0s;
    }
    body.reels-page-shell #reels-right-drawer > .s3-widget {
        flex: 0 0 320px !important;
        width: 100% !important;
        height: 320px !important;
        min-height: 320px !important;
        margin: 0 !important;
    }
    body.reels-page-shell #reels-right-drawer .wall-drawer-header {
        position: sticky;
        z-index: 2;
        top: 0;
        flex: 0 0 auto;
        margin: 0 -14px;
        padding: 14px;
        background: #f7f9fc;
    }
    body.reels-page-shell.wall-right-drawer-open .reels-overlay {
        display: block;
        z-index: 9099;
    }
    body.reels-page-shell.wall-right-drawer-open { overflow: hidden; }
}
/* Video Preview Styles */
.reel-video-preview-field {
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid #d5deea;
    border-radius: 7px;
    background: #f8fafc;
}
.reel-video-preview-field[hidden] { display: none !important; }
.reel-preview-container {
    display: grid;
    grid-template-columns: 180px 1fr;
    gap: 12px;
    align-items: start;
}
.reel-preview-video {
    width: 180px;
    height: 101px;
    border-radius: 5px;
    background: #0c1622;
    object-fit: cover;
}
.reel-preview-video::-webkit-media-controls { display: none; }
.reel-preview-info small {
    display: block;
    margin-top: 8px;
    color: #66738b;
    font-size: 11px;
}
.reel-preview-name {
    font-weight: 600;
    color: #11182e;
    word-break: break-word;
}
.reel-preview-duration {
    margin-top: 6px;
    color: #66738b;
    font-size: 12px;
}
.reel-replace-video-label {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 10px;
    font-weight: 400;
    cursor: pointer;
}
.reel-replace-video-label input[type="checkbox"] {
    margin: 0;
    cursor: pointer;
}
.reel-replace-video-label[hidden] { display: none !important; }
.reel-file-picker[hidden] { display: none !important; }
.reel-video-upload-field.reel-replace-mode .reel-file-picker,
.reel-video-upload-field.reel-replace-mode .reel-file-help {
    opacity: 0.7;
}
.reel-video-upload-field:not(.reel-replace-mode) .reel-file-picker,
.reel-video-upload-field:not(.reel-replace-mode) .reel-file-help {
    opacity: 1;
}

/* Local upload / YouTube source selector. */
.reel-upload-modal [hidden] { display: none !important; }
.reel-upload-modal input[type=url] { width:100%;margin-top:6px;padding:9px;border:1px solid #d5deea;border-radius:6px;background:#fff; }
.reel-source-options { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:7px; }
.reel-source-options label { min-height:58px;padding:10px;display:flex;align-items:flex-start;gap:9px;border:1px solid #d8e0ec;border-radius:8px;background:#fff;cursor:pointer; }
.reel-source-options label:has(input:checked) { border-color:var(--reel-blue);background:#f1f6ff;box-shadow:0 0 0 2px rgba(7,94,233,.08); }
.reel-source-options input { margin-top:3px;accent-color:var(--reel-blue); }
.reel-source-options strong,.reel-source-options small { display:block; }
.reel-source-options strong { color:#17223a;font-size:12px; }
.reel-source-options small { margin-top:3px;color:#68768e;font-size:10px;font-weight:400; }
.reel-youtube-frame { width:100%;height:100%;display:block;border:0;background:#000; }
.reel-youtube-poster { width:100%;height:100%;display:block;object-fit:cover;background:#0c1622; }
.reel-youtube-play { color:#fff;text-decoration:none; }
.reel-feature-media>.reel-youtube-poster { position:absolute;inset:0; }
body.reels-page-shell .reel-card.is-youtube-playing .reel-youtube-frame { position:absolute;z-index:6;inset:0; }
body.reels-page-shell [data-reel-card].is-youtube-playing.is-paused .reel-youtube-frame { visibility:hidden; }
body.reels-page-shell .reel-card.is-youtube-playing .reel-youtube-play { z-index:9;display:grid;opacity:0;transition:opacity .16s ease; }
body.reels-page-shell .reel-card.is-youtube-playing.is-paused .reel-youtube-play { opacity:1; }
body.reels-page-shell .reel-feature.is-youtube-playing .reel-youtube-play { z-index:4;display:grid;opacity:0;transition:opacity .16s ease; }
body.reels-page-shell .reel-feature.is-youtube-playing.is-paused .reel-youtube-play { opacity:1; }
.reel-feature-media>.reel-youtube-frame,
body.reels-page-shell .reel-view-media>.reel-youtube-frame { position:absolute;inset:0; }
.reel-youtube-player-shell{position:absolute;z-index:6;inset:0;overflow:hidden;background:#000;visibility:hidden;opacity:0;pointer-events:none}
.reel-youtube-player,.reel-youtube-player iframe{width:100%;height:100%;display:block;border:0;background:#000;pointer-events:none}
body.reels-page-shell [data-reel-card].is-youtube-playing:not(.is-paused) .reel-youtube-player-shell{visibility:visible;opacity:1}
body.reels-page-shell [data-reel-card].is-youtube-playing.is-paused .reel-youtube-player-shell{visibility:hidden;opacity:0}
.reel-youtube-inspector{position:fixed;left:-2px;bottom:-2px;width:1px;height:1px;overflow:hidden;opacity:.001;pointer-events:none}
body.reels-page-shell .reel-view-media { position:relative; }
.reel-feature-actions a.reel-watch { display:inline-flex;align-items:center;justify-content:center;color:#fff;text-decoration:none; }

@media(max-width:520px){.reel-source-options{grid-template-columns:1fr}}

/* Workspace blue accents for the Reels member page. */
body.reels-page-shell {
    --reel-blue: #1868a0;
    --s3-blue: #1868a0;
    --is2-blue: #1868a0;
}

body.reels-page-shell .reels-heading-icon,
body.reels-page-shell .reel-tags span,
body.reels-page-shell .reel-file-picker-icon,
body.reels-page-shell .reels-right .s3-date {
    background: #e7f2f8;
}

body.reels-page-shell .reels-app .reels-sort-menu button:hover,
body.reels-page-shell .reels-app .reels-sort-menu button.active {
    background: #e7f2f8;
}

body.reels-page-shell .reels-check input {
    accent-color: var(--reel-blue);
}

body.reels-page-shell .reels-scroll-top {
    box-shadow: 0 7px 20px rgba(24, 104, 160, .3);
}

/* Guest previews stay readable without loading a signed-in video player. */
body.reels-page-shell .reel-guest-card {
    display: block;
    color: #fff;
    text-decoration: none;
    background: radial-gradient(circle at 75% 20%, #6241b2, transparent 60%), linear-gradient(145deg, #143a69, #101b32);
}
body.reels-page-shell .reel-guest-card:hover { color: #fff; }
body.reels-page-shell .reel-guest-card:focus-visible { outline: 3px solid var(--reel-blue); outline-offset: 3px; }
body.reels-page-shell .reel-guest-card .reel-card-copy { right: 12px; }
body.reels-page-shell .reel-guest-card .reel-card-copy h3 { overflow-wrap: anywhere; }
body.reels-page-shell .reel-guest-card .reel-author { min-width: 0; }
body.reels-page-shell .reel-guest-card .reel-author > span:last-child { min-width: 0; }
body.reels-page-shell .reel-guest-card .reel-author small { max-width: 100%; }
body.reels-page-shell .reel-guest-card .reel-duration { top: 12px; right: 11px; bottom: auto; left: auto; }
body.reels-page-shell .reel-guest-prompt { display: block; padding-top: 10px; color: #fff; font-size: 12px; font-weight: 600; }

body.reels-page-shell .reel-focused-signin { display: inline-block; margin: 12px 0; padding: 10px 17px; border-radius: 8px; color: #fff; background: linear-gradient(100deg, #d14f9d, #8347f1); font-weight: 700; text-decoration: none; }
body.reels-page-shell .reel-public-player { aspect-ratio: 9 / 16; background: #080f19; }
body.reels-page-shell .reel-public-player video,
body.reels-page-shell .reel-public-player iframe { display: block; width: 100%; height: 100%; border: 0; object-fit: contain; }
body.reels-page-shell .reel-public-player p { padding: 20px; color: #fff; }