/* #gc-ai-content-css */ .gc-ai-badge{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box; font:700 11px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; letter-spacing:.04em;color:#fff;background:#7c3aed;border-radius:6px;padding:3px 6px; text-transform:uppercase;vertical-align:middle;white-space:nowrap;} /* Clip card: pair the chip with the bottom-right duration badge (ManyVids order: AI then time). */ .gc-clip-card__media .gc-ai-badge--card{position:absolute;bottom:0;right:0;z-index:3;} .gc-ai-badge--profile{font-size:12px;padding:3px 7px;margin-left:8px;} .gc-ai-badge--page{font-size:13px;padding:4px 8px;margin-left:10px;} .gc-ai-badge--feed{font-size:10px;padding:2px 6px;} /* Duration+AI pairing wrapper (added on cards where we control markup). */ .gc-clip-card__br-badges{position:absolute;bottom:0;right:0;z-index:3;display:flex;gap:6px;align-items:flex-end;} .gc-clip-card__br-badges .gc-clip-card__duration-badge, .gc-clip-card__br-badges .gc-ai-badge--card{position:static;bottom:auto;right:auto;} .gc-clip-card__br-badges .gc-ai-badge--card{margin-bottom:2px;} /* Creator my-profile toggle card + per-clip fieldset. */ .gc-ai-flag-card{margin:18px 0;padding:16px 18px;border:1px solid #2a2f3a;border-radius:12px;background:#151a24;} .gc-ai-flag-card h3{margin:0 0 6px;font-size:15px;color:#e9ecf3;} .gc-ai-flag-card p{margin:0 0 12px;font-size:13px;color:#aab3c5;} .gc-ai-switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:14px;color:#e9ecf3;} .gc-ai-switch input{width:18px;height:18px;accent-color:#7c3aed;} .gc-ai-flag-card[data-locked="1"]{opacity:.85;} .gc-ai-flag-card .gc-ai-lock-note{color:#f0b429;font-size:12px;margin-top:8px;} .gc-ai-clip-field{margin:12px 0;} .gc-ai-clip-field>label{display:block;font-weight:600;margin-bottom:6px;} .gc-ai-clip-field .gc-ai-clip-opts{display:flex;gap:16px;flex-wrap:wrap;} .gc-ai-clip-field .gc-ai-clip-opts label{display:inline-flex;align-items:center;gap:6px;font-weight:400;} /* #gc-mbadge-css */ .gc-clip-card__badges .gc-mbadge{display:inline-block;align-self:flex-start;font-size:10.5px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;padding:3px 7px;border-radius:6px;line-height:1.15;color:#fff;box-shadow:0 1px 3px rgba(0,0,0,.35);margin:0 6px 6px 0}.gc-clip-card__badges .gc-mbadge--new{background:#1b7a42}.gc-clip-card__badges .gc-mbadge--free{background:#2b6cb0}.gc-clip-card__badges .gc-mbadge--bestseller{background:#caa23a;color:#161a22}.gc-clip-card__badges .gc-mbadge--trending{background:#bf4a2f} /* #gc-clipv-css */ .gc-clipv-strip__row{display:flex;gap:16px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:4px 2px 14px;scrollbar-width:thin;}.gc-clipv-strip__row>.gc-clip-card{flex:0 0 244px;max-width:244px;scroll-snap-align:start;}.gc-clipv-strip__row::-webkit-scrollbar{height:8px;}.gc-clipv-strip__row::-webkit-scrollbar-thumb{background:var(--gc-border,#334155);border-radius:8px;}.gc-clipv-strip__more{color:var(--gc-text,#eef2f8);text-decoration:underline;text-underline-offset:2px;font-weight:700;white-space:nowrap;}@media(max-width:600px){.gc-clipv-strip__row>.gc-clip-card{flex-basis:72vw;max-width:72vw;}} /* #gc-media-fit */ /* gc_media_fit_utility_v1 */ .gc-media-fit-on .gc-media-fit { position: relative; overflow: hidden; } .gc-media-fit-on .gc-media-fit.is-portrait::before, .gc-media-fit-on .gc-media-fit.is-square::before { content: ""; position: absolute; inset: 0; background-image: var(--gc-fit-bg, none); background-size: cover; background-position: center; background-repeat: no-repeat; /* Dark enough that white overlay text keeps the contrast it was designed for, whatever the clip's own brightness is. Measured per fixture, not eyeballed. */ filter: blur(30px) brightness(.40) saturate(1.05); transform: scale(1.18); z-index: 0; } .gc-media-fit-on .gc-media-fit.is-portrait > img, .gc-media-fit-on .gc-media-fit.is-portrait > video, .gc-media-fit-on .gc-media-fit.is-square > img, .gc-media-fit-on .gc-media-fit.is-square > video { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; } /* Fixed pixel boxes (64x36, 80x45, 44x44, 54x72, 72x96, fixed heights) get contain on the brand dark only -- a 30px blur behind a 44px thumbnail is pure GPU cost for no legibility. */ .gc-media-fit-on .gc-media-fit--flat.is-portrait::before, .gc-media-fit-on .gc-media-fit--flat.is-square::before { display: none; } .gc-media-fit-on .gc-media-fit--flat.is-portrait, .gc-media-fit-on .gc-media-fit--flat.is-square { background-color: var(--gc-deep, #0b1220); } /* gc_media_watch_fit_v1 -- the clip WATCH player. The theme pins .gc-clip-watch-player__media to aspect-ratio:16/9 with object-fit:cover, so a 1080x1920 trailer is scaled to the box WIDTH and ~69% of the frame is cropped away above and below. Portrait/square media gets a height-capped box instead; the shared contain + ::before rules above then do the rest, so the watch page looks like the cards rather than like a second, separate treatment. Height, not aspect-ratio: a 9/16 box at panel width would be ~1400px tall on desktop and push the title and buybox entirely below the fold. */ /* gc_watch_player_height_65vh_v1 -- 65vh, not 78vh, and the reason is measured: at 78vh the player is 702px on a 1440x900 desktop and "Add to cart" lands at y=977, i.e. 77px BELOW the fold, so the only buying path needs a scroll. At 65vh the player is 585px and the button sits at y=860, visible on load. The landscape control on the same page renders at 586px and never had the problem, which is what pins the cause to the player height rather than to the page. The film stays fully visible either way -- this trades 117px of picture for the buy button. */ .gc-media-fit-on .gc-clip-watch-player__media.gc-media-fit.is-portrait, .gc-media-fit-on .gc-clip-watch-player__media.gc-media-fit.is-square { aspect-ratio: auto; height: min(65vh, 760px); } /* The video must be SIZED to its own shape, not stretched to the box with object-fit:contain. Measured on staging 2026-08-07: with width:100% + contain, a PLAYING