@font-face{font-family:'Ragbet Reference Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url('inter-variable.woff2') format('woff2')}
/* Exact mixed-media gallery rules extracted from the local preview's final base.css + components.css cascade.
 * Internal tm35pc classes are intentionally retained; every rule is isolated to the live gallery root.
 * The JSON/script mount owns markup. No theme or prototype application code is required. */
.ragbet-reference-media {
  --yc-font-body:"Ragbet Reference Inter",Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --yc-font-heading:var(--yc-font-body);
  --pc-purple:#5e2cfa;--pc-ink:#221d35;--pc-muted:#716a82;--pc-line:#eae7f1;--pc-soft:#f7f5fc;--pc-radius:22px;
  --section-gap:32px;--card-inset:24px;--card-radius:16px;--card-line:#e9e6ef;
  box-sizing:border-box;display:block;min-width:0;width:100%;max-width:100%;margin:0 0 var(--section-gap);
  padding:var(--card-inset);border:1px solid var(--card-line);border-radius:var(--card-radius);background:#fff;
  color:var(--pc-ink);font-family:"Ragbet Reference Inter",Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15px;line-height:1.6;font-style:normal;text-align:left;-webkit-font-smoothing:antialiased;
  scroll-margin-top:110px;
}
.ragbet-reference-media *, .ragbet-reference-media *::before, .ragbet-reference-media *::after {box-sizing:border-box}
.ragbet-reference-media[hidden], .ragbet-reference-media [hidden] {display:none!important}
.ragbet-reference-media button {appearance:none;font:inherit;letter-spacing:normal;text-transform:none;text-decoration:none;margin:0;min-height:0;min-width:0;color:inherit;cursor:pointer;border:0;-webkit-tap-highlight-color:transparent}
.ragbet-reference-media button:hover {filter:brightness(.98)}
.ragbet-reference-media button:disabled {cursor:default;opacity:.55}
.ragbet-reference-media button:focus-visible {outline:3px solid #bdaaff;outline-offset:4px}
.ragbet-reference-media img {max-width:100%;display:block}
.ragbet-reference-media h2,.ragbet-reference-media h3,.ragbet-reference-media p,.ragbet-reference-media figure,.ragbet-reference-media figcaption {margin:0;padding:0;font:inherit;letter-spacing:normal;text-transform:none}
.ragbet-reference-media .ragbet-reference-lightbox {position:fixed;inset:0;margin:auto;font:inherit;letter-spacing:normal;text-transform:none;text-align:left}
.ragbet-reference-media svg {display:block;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}

/* Base gallery and lightbox. */
.ragbet-reference-media .tm35pc-media-heading { display:flex;align-items:center;gap:9px;font-size:14px;font-weight:750;line-height:1.3;color:#453a57 }
.ragbet-reference-media .tm35pc-media-heading>span { color:#95899f;font-size:11px;font-weight:550 }
.ragbet-reference-media .tm35pc-media-heading svg { width:17px;height:17px;color:var(--pc-purple) }
.ragbet-reference-media .tm35pc-gallery { position:relative;min-width:0 }
.ragbet-reference-media .tm35pc-media-track { display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px)/4);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:0;scrollbar-width:none;padding:2px 2px 8px;overscroll-behavior-x:contain }
.ragbet-reference-media .tm35pc-media-track::-webkit-scrollbar { display:none }
.ragbet-reference-media .tm35pc-photo-card,
.ragbet-reference-media .tm35pc-video-card { display:flex;flex-direction:column;min-width:0;scroll-snap-align:start;margin:0;border:1px solid var(--pc-line);border-radius:17px;background:#fff;overflow:hidden;box-shadow:0 5px 14px #29203704 }
.ragbet-reference-media button.tm35pc-photo-card { padding:0;text-align:left;color:var(--pc-ink);font:inherit }
.ragbet-reference-media button.tm35pc-photo-card:hover .tm35pc-media-image { transform:scale(1.035) }
.ragbet-reference-media .tm35pc-media-frame { position:relative;display:block;aspect-ratio:4/5;overflow:hidden;background:#f1eef5;width:100% }
.ragbet-reference-media .tm35pc-media-image { display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease }
.ragbet-reference-media .tm35pc-photo-expand { position:absolute;bottom:11px;right:11px;display:flex;align-items:center;justify-content:center;width:31px;height:31px;border-radius:50%;background:#fffefb;color:#443752;box-shadow:0 2px 10px #221d3520 }
.ragbet-reference-media .tm35pc-photo-expand svg { width:15px;height:15px }
.ragbet-reference-media .tm35pc-media-caption { display:block;font-size:12px;line-height:1.55;color:#6f647d;padding:12px 14px;overflow-wrap:anywhere }
.ragbet-reference-media .tm35pc-gallery-footer { display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:10px;padding-inline:2px }
.ragbet-reference-media .tm35pc-gallery-hint { font-size:11px;color:#a094ac;margin:0 }
.ragbet-reference-media .tm35pc-gallery-controls { display:flex;align-items:center;gap:9px }
.ragbet-reference-media .tm35pc-gallery-counter { min-width:45px;text-align:center;font-size:11px;color:#83748e;font-variant-numeric:tabular-nums }
.ragbet-reference-media .tm35pc-round-button { display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;flex:none;border:1px solid #e8e1ef;border-radius:50%;background:#fff;color:#68517f }
.ragbet-reference-media .tm35pc-round-button svg { width:15px;height:15px }
.ragbet-reference-media .tm35pc-round-button:disabled { opacity:.3 }
.ragbet-reference-media .tm35pc-round-button:hover:not(:disabled) { border-color:#c5b3ec;background:#f6f2ff;color:var(--pc-purple) }
.ragbet-reference-media .tm35pc-video-frame { position:relative;width:100%;aspect-ratio:9/14;background:#24202e;overflow:hidden }
.ragbet-reference-media .tm35pc-video-launch { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:11px;width:100%;height:100%;padding:18px;border:0;background:linear-gradient(145deg,#393043,#211a2b);color:#fff }
.ragbet-reference-media .tm35pc-video-launch::after { position:absolute;inset:0;content:"";background:linear-gradient(180deg,#0000,#100b1b38);pointer-events:none }
.ragbet-reference-media .tm35pc-video-launch>img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover }
.ragbet-reference-media .tm35pc-play { z-index:1;width:49px;height:49px;border:1px solid #fff8;border-radius:50%;background:#ffffffed;color:var(--pc-purple);display:flex;align-items:center;justify-content:center;box-shadow:0 5px 22px #0002 }
.ragbet-reference-media .tm35pc-play svg { width:20px;height:20px;margin-left:3px }
.ragbet-reference-media .tm35pc-video-launch-label { position:relative;z-index:1;font-size:11px;font-weight:650;color:#fff;text-shadow:0 1px 5px #0008 }
.ragbet-reference-media .tm35pc-video-frame video { width:100%;height:100%;display:block;object-fit:contain;background:#16121e }
.ragbet-reference-media .tm35pc-video-error { position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:13px;padding:20px;color:#fff;font-size:12px;text-align:center;background:#24202e }
.ragbet-reference-media .tm35pc-video-error button { background:#fff;color:#4c267b;border:0;border-radius:9px;padding:8px 13px;font-size:12px;font-weight:750 }
.ragbet-reference-media .tm35pc-lightbox { color:#fff;background:#17121fd9;border:1px solid #ffffff20;border-radius:22px;padding:18px;width:min(1040px,calc(100vw - 40px));max-width:1040px;max-height:calc(100dvh - 32px);overflow:hidden;box-shadow:0 30px 100px #0008 }
.ragbet-reference-media .tm35pc-lightbox::backdrop { background:#100b18d9;backdrop-filter:blur(8px) }
.ragbet-reference-media .tm35pc-lightbox-top { display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:13px;padding-left:5px }
.ragbet-reference-media .tm35pc-lightbox-title { font-size:13px;font-weight:650;color:#e3dcec;margin:0 }
.ragbet-reference-media .tm35pc-lightbox button { color:#eee7f6;border-color:#ffffff30;background:#ffffff0c }
.ragbet-reference-media .tm35pc-lightbox button:hover:not(:disabled) { background:#ffffff20;border-color:#ffffff70;color:#fff }
.ragbet-reference-media .tm35pc-lightbox figure { margin:0 }
.ragbet-reference-media .tm35pc-lightbox-image { display:block;width:100%;height:min(68dvh,730px);max-height:calc(100dvh - 180px);object-fit:contain;border-radius:12px;touch-action:pan-y pinch-zoom;user-select:none }
.ragbet-reference-media .tm35pc-lightbox-caption { font-size:12px;color:#bfb0cc;line-height:1.5;text-align:center;padding:12px 30px 0;min-height:24px }
.ragbet-reference-media .tm35pc-lightbox-controls { display:flex;align-items:center;justify-content:center;gap:16px;margin-top:12px }
.ragbet-reference-media .tm35pc-lightbox-counter { font-size:12px;color:#cbbbd9;min-width:50px;text-align:center;font-variant-numeric:tabular-nums }
body.ragbet-reference-lightbox-open { overflow:hidden }
@media (max-width:1050px) {
.ragbet-reference-media .tm35pc-media-track { grid-auto-columns:calc((100% - 32px)/3) }
}
@media (max-width:760px) {
.ragbet-reference-media .tm35pc-media-track { grid-auto-columns:calc((100% - 14px)/2.25);gap:14px;padding-bottom:6px }
.ragbet-reference-media .tm35pc-media-caption { font-size:11px;padding:10px 11px }
.ragbet-reference-media .tm35pc-photo-card,
.ragbet-reference-media .tm35pc-video-card { border-radius:14px }
.ragbet-reference-media .tm35pc-gallery-hint { font-size:10px }
.ragbet-reference-media .tm35pc-play { width:43px;height:43px }
.ragbet-reference-media .tm35pc-lightbox { padding:12px;border-radius:16px;width:calc(100vw - 20px);max-height:calc(100dvh - 20px) }
.ragbet-reference-media .tm35pc-lightbox-image { height:65dvh;max-height:calc(100dvh - 170px) }
.ragbet-reference-media .tm35pc-lightbox-caption { padding-inline:5px }
.ragbet-reference-media .tm35pc-lightbox-title { font-size:12px }
}
.ragbet-reference-media .tm35pc-video-card { scroll-snap-align:start;min-width:0 }
.ragbet-reference-media .tm35pc-video-frame { aspect-ratio:9/14 }
.ragbet-reference-media .tm35pc-gallery-footer { justify-content:flex-end }
.ragbet-reference-media .tm35pc-media-heading { margin-top:23px }
.ragbet-reference-media .tm35pc-video-frame,
.ragbet-reference-media .tm35pc-video-launch { background:#f8f8fa!important;box-shadow:none!important }
.ragbet-reference-media .tm35pc-video-launch::before,
.ragbet-reference-media .tm35pc-video-launch::after { display:none!important }
.ragbet-reference-media .tm35pc-video-launch-label { color:#756584!important;text-shadow:none!important }
.ragbet-reference-media .tm35pc-play { background:#5e2cfa!important;color:#fff!important;box-shadow:none!important }
.ragbet-reference-media .tm35pc-video-card { box-shadow:none!important;border:1px solid #e8e3ed!important }

/* Final preview component overrides, kept in source order. */
.ragbet-reference-media .tm35pc-media-heading { margin:16px 0 12px }
.ragbet-reference-media .tm35pc-media-heading { margin:0 0 12px;font-size:16px;line-height:1.4;letter-spacing:-.2px }
.ragbet-reference-media .tm35pc-mixed-track { grid-auto-columns:calc((100% - 48px)/4);gap:16px;align-items:stretch }
.ragbet-reference-media .tm35pc-mixed-track>.tm35pc-photo-card,
.ragbet-reference-media .tm35pc-mixed-track>.tm35pc-video-card { width:100%;height:100%;border-radius:12px;box-shadow:none }
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-media-frame,
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-video-frame { aspect-ratio:4/5;flex:none;background:#f8f8fa }
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-media-image,
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-video-launch>img { width:100%;height:100%;object-fit:cover }
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-video-frame video { object-fit:contain }
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-video-launch { background:#f8f8fa!important;box-shadow:none }
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-video-launch::before,
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-video-launch::after { display:none }
.ragbet-reference-media .tm35pc-gallery-footer { justify-content:flex-end;margin-top:10px }
@media(max-width:1050px) {
.ragbet-reference-media .tm35pc-mixed-track { grid-auto-columns:calc((100% - 32px)/3) }
}
@media(max-width:600px) {
.ragbet-reference-media .tm35pc-media-heading { font-size:15px;margin-bottom:10px }
.ragbet-reference-media .tm35pc-mixed-track { grid-auto-columns:calc((100% - 14px)/2.25);gap:14px }
.ragbet-reference-media .tm35pc-mixed-track>.tm35pc-photo-card,
.ragbet-reference-media .tm35pc-mixed-track>.tm35pc-video-card { border-radius:10px }
}
.ragbet-reference-media .tm35pc-video-metadata { position:absolute;inset:12px 12px auto;display:flex;align-items:center;justify-content:space-between;gap:8px;z-index:2;pointer-events:none }
.ragbet-reference-media .tm35pc-video-metadata>span { display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border-radius:5px;background:#17131dc9;color:#fff;font-size:11px;font-weight:600;line-height:1.4;font-variant-numeric:tabular-nums }
.ragbet-reference-media .tm35pc-video-launch.has-poster .tm35pc-play { width:54px;height:54px;border:0;background:#fff!important;color:#352742!important;box-shadow:0 2px 12px #0002!important }
.ragbet-reference-media .tm35pc-video-launch.has-poster .tm35pc-video-launch-label { color:#fff!important;background:#17131dc9;padding:5px 10px;border-radius:5px;text-shadow:none!important;font-size:12px }
@media(max-width:600px) {
.ragbet-reference-media .tm35pc-video-metadata { inset:8px 8px auto }
.ragbet-reference-media .tm35pc-video-metadata>span { font-size:10px;padding:3px 6px;min-height:23px }
.ragbet-reference-media .tm35pc-video-launch.has-poster .tm35pc-play { width:44px;height:44px }
.ragbet-reference-media .tm35pc-video-launch.has-poster .tm35pc-video-launch-label { font-size:10px;padding:4px 7px }
}
.ragbet-reference-media .tm35pc-mixed-track .tm35pc-video-launch>img { object-position:center top }
.ragbet-reference-media .tm35pc-gallery--side-controls { position:relative }
.ragbet-reference-media .tm35pc-gallery--side-controls>.tm35pc-gallery-controls--sides { position:absolute; inset:0; z-index:4; display:block; pointer-events:none; }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button { position:absolute; top:50%; width:44px; height:44px; min-width:44px; min-height:44px; padding:0; transform:translateY(-50%); border:1px solid #e0dce5; border-radius:50%; background:#fff; color:#49404f; box-shadow:0 2px 9px #21162e1f; pointer-events:auto; }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:first-child { left:10px }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:last-child { right:10px }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button svg { width:18px;height:18px }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:hover:not(:disabled) { background:#fff;border-color:#aa99c1;color:#5e2cfa }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:focus-visible { outline:3px solid #9172d0;outline-offset:3px }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:disabled { opacity:.4;cursor:default }
.ragbet-reference-media .tm35pc-gallery--side-controls .tm35pc-gallery-counter--sr { position:absolute; width:1px; height:1px; min-width:0; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); clip-path:inset(50%); border:0; white-space:nowrap; }
.ragbet-reference-media .tm35pc-gallery--side-controls>.tm35pc-gallery-footer { display:none }
@media(max-width:760px) {
/* A quiet 32px visible circle inside the existing 44px touch target. */
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button { border:0;background:transparent;box-shadow:none }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button::before { content:"";position:absolute;inset:6px;border:1px solid #e0dce5;border-radius:50%;background:rgb(255 255 255 / 94%);pointer-events:none }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button svg { position:relative;width:15px;height:15px }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:hover:not(:disabled) { background:transparent }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:hover:not(:disabled)::before { border-color:#aa99c1 }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:first-child { left:0 }
.ragbet-reference-media .tm35pc-gallery-controls--sides>.tm35pc-round-button:last-child { right:0 }
}

/* Self-contained section geometry; prototype variables originally came from :root. */
.ragbet-reference-media {padding:var(--card-inset);border:1px solid var(--card-line);border-radius:var(--card-radius);background:#fff}
@media(max-width:1100px) and (min-width:801px) {.ragbet-reference-media {--card-inset:18px}}
@media(max-width:800px) {.ragbet-reference-media {--card-inset:20px;--section-gap:24px}}
@media(max-width:600px) {.ragbet-reference-media {--card-inset:16px;--card-radius:14px}}
@media(prefers-reduced-motion:reduce) {
  .ragbet-reference-media *, .ragbet-reference-media *::before, .ragbet-reference-media *::after {scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
/* The live theme sets height:auto on #main-content media; preserve the copied frame geometry. */
.ragbet-reference-media .tm35pc-media-image,
.ragbet-reference-media .tm35pc-video-launch>img,
.ragbet-reference-media .tm35pc-video-frame video{height:100%!important}
.ragbet-reference-media .tm35pc-lightbox-image{height:min(68dvh,730px)!important}
@media(max-width:760px){.ragbet-reference-media .tm35pc-lightbox-image{height:65dvh!important}}