:root {
  --xhub-color-bg: #0b0b10;
  --xhub-color-surface: #15151d;
  --xhub-color-elevated: #20202b;
  --xhub-color-text: #f7f7fb;
  --xhub-color-secondary: #c4c4d0;
  --xhub-color-muted: #898998;
  --xhub-color-border: rgba(255,255,255,.12);
  --xhub-color-accent: #f04f78;
  --xhub-color-success: #37c98b;
  --xhub-color-warning: #f2b84b;
  --xhub-color-error: #f36b6b;
  --xhub-color-info: #6ea8fe;
  --xhub-focus: 0 0 0 3px rgba(240,79,120,.42);
  --xhub-radius-sm: 6px;
  --xhub-radius-md: 10px;
  --xhub-radius-lg: 16px;
  --xhub-space-1: 4px;
  --xhub-space-2: 8px;
  --xhub-space-3: 12px;
  --xhub-space-4: 16px;
  --xhub-space-6: 24px;
  --xhub-space-8: 32px;
  --xhub-content-width: 1280px;
  --xhub-header-height: 72px;
  --xhub-bottom-nav-height: 68px;
  --xhub-transition: 160ms ease;
  --xhub-z-header: 100;
  --xhub-z-nav: 110;
}
html { overflow-x: hidden; }
body { max-width: 100%; overflow-x: hidden; }
img, video, iframe { max-width: 100%; }
button, input, select, textarea { font: inherit; }

.xhub-skip-link { position: fixed; left: 12px; top: -100px; z-index: 1000; padding: 10px 14px; border-radius: var(--xhub-radius-sm); background: var(--xhub-color-accent); color: #fff; }
.xhub-skip-link:focus { top: 12px; box-shadow: var(--xhub-focus); }
.xhub-header { position: sticky; top: 0; z-index: var(--xhub-z-header); min-height: var(--xhub-header-height); background: rgba(11,11,16,.94); border-bottom: 1px solid var(--xhub-color-border); }
.xhub-header .header__top { min-height: var(--xhub-header-height); }
.xhub-ui-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--xhub-space-2); min-height: 44px; padding: 0 var(--xhub-space-4); border: 1px solid transparent; border-radius: 999px; color: var(--xhub-color-text); font-weight: 600; text-decoration: none; transition: background var(--xhub-transition), border-color var(--xhub-transition), transform var(--xhub-transition); }
.xhub-ui-button:hover { transform: translateY(-1px); }
.xhub-ui-button:focus-visible, .xhub-mobile-nav__item:focus-visible { outline: none; box-shadow: var(--xhub-focus); }
.xhub-ui-button--primary { background: var(--xhub-color-accent); }
.xhub-ui-button--ghost { background: transparent; border-color: var(--xhub-color-border); }
.xhub-ui-button--ghost:hover { background: var(--xhub-color-elevated); }
body { background: var(--xhub-color-bg); color: var(--xhub-color-text); }
body.admin-bar .xhub-header { top: 32px; }
.xhub-mobile-nav { z-index: var(--xhub-z-nav); padding-bottom: env(safe-area-inset-bottom, 0px); }
.xhub-mobile-nav__item { min-height: 44px; }
@media (max-width: 782px) { body.admin-bar .xhub-header { top: 46px; } body { padding-bottom: calc(var(--xhub-bottom-nav-height) + env(safe-area-inset-bottom, 0px)); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }

.xhub-home-premium { width: min(100% - 32px, var(--xhub-content-width)); margin: 0 auto; padding: 24px 0 64px; }
.xhub-hero { min-height: 390px; display: flex; align-items: end; border-radius: var(--xhub-radius-lg); overflow: hidden; background: linear-gradient(90deg, rgba(11,11,16,.98) 0%, rgba(11,11,16,.62) 52%, rgba(11,11,16,.18)), var(--xhub-hero-image) center/cover; }
.xhub-hero__content { max-width: 560px; padding: clamp(24px, 5vw, 56px); }
.xhub-eyebrow { color: var(--xhub-color-accent); font-size: 12px; font-weight: 800; letter-spacing: .14em; }
.xhub-hero h1 { margin: 10px 0; font-size: clamp(28px, 5vw, 54px); line-height: 1.04; }
.xhub-hero p { color: var(--xhub-color-secondary); max-width: 48ch; }
.xhub-hero__actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 20px 0 14px; }
.xhub-hero__meta { color: var(--xhub-color-muted); font-size: 13px; }
.xhub-home-section { margin-top: 40px; }
.xhub-home-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:16px; }
.xhub-home-heading h2 { margin:0; color:#fff; font-size: clamp(20px, 2.5vw, 28px); font-weight:800; }
.xhub-home-heading a { color: var(--xhub-color-secondary); font-size: 14px; }
.xhub-card-scroller { display:grid; grid-auto-flow:column; grid-auto-columns: calc((100% - 80px)/6); gap:16px; overflow-x:auto; padding: 2px 2px 12px; scroll-snap-type:x mandatory; scrollbar-width:thin; }
.xhub-card-scroller > * { scroll-snap-align:start; }
.xhub-video-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px 16px; }
.xhub-video-card { min-width:0; }
.xhub-video-card__link { color:inherit; display:block; text-decoration:none; }
.xhub-video-card__media { display:block; position:relative; aspect-ratio:16/10; overflow:hidden; border-radius:var(--xhub-radius-md); background:var(--xhub-color-surface); }
.xhub-video-card__media img { width:100%; height:100%; object-fit:cover; transition:transform var(--xhub-transition); }
.xhub-video-card__media img.xhub-video-card__fallback { box-sizing:border-box; object-fit:contain; padding:12%; background:#09090b; }
.xhub-video-card__link:hover .xhub-video-card__media img { transform:scale(1.04); }
.xhub-video-card__badges { position:absolute; inset:auto 8px 8px 8px; display:flex; justify-content:space-between; font-size:11px; }
.xhub-video-card__badges b { border-radius:4px; padding:3px 5px; background:rgba(0,0,0,.72); }
.xhub-video-card__title { display:block; margin-top:9px; color:#fff; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.xhub-video-card__meta { display:block; margin-top:4px; color:rgba(255,255,255,.68); font-size:12px; }
.xhub-chip-grid { display:flex; flex-wrap:wrap; gap:10px; }
.xhub-category-chip { padding:11px 16px; border:1px solid var(--xhub-color-border); border-radius:999px; color:var(--xhub-color-secondary); text-decoration:none; background:var(--xhub-color-surface); }
.xhub-category-chip:hover { border-color:var(--xhub-color-accent); color:var(--xhub-color-text); }
.xhub-empty-state { padding:28px; border:1px dashed var(--xhub-color-border); border-radius:var(--xhub-radius-md); color:var(--xhub-color-muted); text-align:center; }
@media (max-width: 1100px) { .xhub-card-scroller { grid-auto-columns: calc((100% - 48px)/4); } .xhub-video-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width: 700px) { .xhub-home-premium { width:min(100% - 24px, var(--xhub-content-width)); padding-top:12px; } .xhub-hero { min-height:340px; } .xhub-card-scroller { grid-auto-columns:44%; gap:12px; } .xhub-video-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 10px; } .xhub-video-card__title { font-size:13px; } }
.xhub-discover__hero { padding:32px 0 24px; }
.xhub-discover__hero h1 { margin:8px 0; font-size:clamp(30px,5vw,52px); }
.xhub-discover__hero p { color:var(--xhub-color-secondary); }
.xhub-discover__layout { display:grid; grid-template-columns:240px minmax(0,1fr); gap:28px; }
.xhub-filter-panel { padding:18px; border:1px solid var(--xhub-color-border); border-radius:var(--xhub-radius-md); background:var(--xhub-color-surface); }
.xhub-filter-panel h2 { margin-top:0; }.xhub-filter-panel label,.xhub-filter-panel legend { color:var(--xhub-color-secondary); font-size:13px; }
.xhub-filter-panel select { width:100%; margin:8px 0 18px; padding:10px; border-radius:var(--xhub-radius-sm); background:var(--xhub-color-elevated); color:var(--xhub-color-text); border:1px solid var(--xhub-color-border); }
.xhub-filter-panel fieldset { border:0; padding:0; margin:0 0 18px; display:flex; flex-wrap:wrap; gap:7px; }.xhub-filter-panel fieldset a { color:var(--xhub-color-muted); font-size:12px; }.xhub-filter-panel fieldset a:hover { color:var(--xhub-color-accent); }
.xhub-search-form { position:relative; display:flex; gap:10px; max-width:720px; }.xhub-search-form input { flex:1; min-height:46px; padding:0 14px; border-radius:var(--xhub-radius-md); border:1px solid var(--xhub-color-border); background:var(--xhub-color-surface); color:var(--xhub-color-text); }.xhub-search-suggestions { position:absolute; top:54px; left:0; right:120px; z-index:20; }.xhub-search-suggestions:empty { display:none; }.xhub-search-suggestions a { display:block; padding:10px 14px; color:var(--xhub-color-text); background:var(--xhub-color-elevated); border-bottom:1px solid var(--xhub-color-border); }.xhub-search-history { display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; }.xhub-search-history button { border:1px solid var(--xhub-color-border); border-radius:999px; background:transparent; color:var(--xhub-color-muted); padding:6px 10px; }
@media (max-width: 760px) { .xhub-discover__layout { display:block; }.xhub-filter-panel { display:none; margin-bottom:18px; }.xhub-filter-panel.is-open { display:block; }.xhub-search-form { flex-wrap:wrap; }.xhub-search-form input { flex-basis:100%; }.xhub-search-suggestions { top:54px; right:0; } }
.xhub-creator-hero { padding:28px; border-radius:var(--xhub-radius-lg); background:linear-gradient(90deg,rgba(11,11,16,.97),rgba(11,11,16,.58)),var(--xhub-creator-cover) center/cover; display:flex; justify-content:space-between; align-items:end; gap:20px; }
.xhub-creator-identity { display:flex; align-items:center; gap:20px; }.xhub-creator-identity img { width:112px; height:112px; object-fit:cover; border-radius:50%; border:3px solid var(--xhub-color-accent); }.xhub-creator-identity h1 { margin:6px 0; }.xhub-creator-identity p { margin:4px 0; color:var(--xhub-color-secondary); }.xhub-creator-bio { max-width:55ch; }.xhub-verified { color:var(--xhub-color-accent); font-size:16px; }.xhub-creator-actions { display:flex; gap:10px; }.xhub-creator-tabs { display:flex; gap:24px; overflow:auto; border-bottom:1px solid var(--xhub-color-border); margin-top:20px; }.xhub-creator-tabs a { padding:14px 2px; color:var(--xhub-color-muted); text-decoration:none; white-space:nowrap; }.xhub-creator-tabs a.is-active,.xhub-creator-tabs a:hover { color:var(--xhub-color-text); border-bottom:2px solid var(--xhub-color-accent); }
@media (max-width:700px) { .xhub-creator-hero { display:block; padding:20px; }.xhub-creator-identity { align-items:flex-start; gap:14px; }.xhub-creator-identity img { width:80px; height:80px; }.xhub-creator-identity h1 { font-size:22px; }.xhub-creator-actions { margin-top:18px; } }
.xhub-video-detail { width:min(100% - 24px,var(--xhub-content-width)); margin:0 auto; padding-bottom:calc(var(--xhub-bottom-nav-height) + env(safe-area-inset-bottom,0px)); }.xhub-breadcrumbs { display:flex; gap:8px; padding:18px 0 12px; color:var(--xhub-color-muted); font-size:13px; }.xhub-breadcrumbs a { color:var(--xhub-color-secondary); }.xhub-player-shell { border-radius:var(--xhub-radius-md); overflow:hidden; background:#000; }.xhub-player-loading { display:grid; place-items:center; height:100%; color:var(--xhub-color-muted); }.xhub-related-videos .list-videos .margin-fix { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }.xhub-report-dialog { max-width:420px; width:calc(100% - 32px); border:1px solid var(--xhub-color-border); border-radius:var(--xhub-radius-md); background:var(--xhub-color-surface); color:var(--xhub-color-text); }.xhub-report-dialog::backdrop { background:rgba(0,0,0,.72); }.xhub-report-dialog select { display:block; width:100%; margin:12px 0 18px; padding:10px; background:var(--xhub-color-elevated); color:var(--xhub-color-text); border:1px solid var(--xhub-color-border); }.xhub-report-dialog button { cursor:pointer; }.xhub-report-dialog form { display:grid; gap:10px; }.xhub-report-dialog h2 { margin-top:0; }
@media (max-width:700px) { .xhub-related-videos .list-videos .margin-fix { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } }
.xhub-forum-content { padding-top:32px; }.xhub-forum-heading { max-width:680px; margin:0 auto 28px; text-align:center; }.xhub-forum-heading h1 { font-size:clamp(28px,5vw,50px); margin:8px 0; }.xhub-forum-heading p,.xhub-forum-grid p { color:var(--xhub-color-secondary); }.xhub-forum-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }.xhub-forum-grid article { padding:22px; border:1px solid var(--xhub-color-border); border-radius:var(--xhub-radius-md); background:var(--xhub-color-surface); }.xhub-forum-grid article > span { color:var(--xhub-color-accent); font-size:24px; }.xhub-forum-grid h2 { margin:12px 0 6px; font-size:20px; }.xhub-forum-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:28px 0; }.xhub-forum-stats div { padding:18px; text-align:center; border:1px solid var(--xhub-color-border); border-radius:var(--xhub-radius-md); }.xhub-forum-stats strong,.xhub-forum-stats span { display:block; }.xhub-forum-stats strong { font-size:26px; color:var(--xhub-color-accent); }.xhub-forum-stats span { color:var(--xhub-color-muted); font-size:13px; }.xhub-forum-cta { padding:32px; text-align:center; border-radius:var(--xhub-radius-lg); background:linear-gradient(135deg,var(--xhub-color-elevated),var(--xhub-color-surface)); }.xhub-forum-cta h2 { margin-top:0; }
@media (max-width:700px) { .xhub-forum-grid { grid-template-columns:1fr; }.xhub-forum-stats { grid-template-columns:repeat(2,1fr); }.xhub-forum-cta { padding:24px 16px; } }
.reel-page { background:var(--xhub-color-bg); }.reel-feed:focus-visible { outline:none; box-shadow:var(--xhub-focus); }.reel-action:focus-visible,.reel-fallback-link:focus-visible,.reel-play-link:focus-visible { outline:none; box-shadow:var(--xhub-focus); }.reel-item { scroll-snap-align:start; }.reel-video,.reel-poster { background:#050508; }.reel-comments-sheet { padding-bottom:env(safe-area-inset-bottom,0px); }
@media (min-width:768px) { .reel-feed { max-width:680px; margin:0 auto; }.reel-item { border-radius:var(--xhub-radius-lg); overflow:hidden; } }
.reel-item,.reel-media { min-height: min(100svh, 900px); }
@media (max-width:700px) { .reel-item,.reel-media { min-height: calc(100svh - var(--xhub-header-height)); } }
.xhub-account-center { width:min(100% - 24px,var(--xhub-content-width)); margin:0 auto; padding:28px 0 calc(var(--xhub-bottom-nav-height) + env(safe-area-inset-bottom,0px)); }.xhub-account-center .xporn-rbac-account { color:var(--xhub-color-text); }.xhub-account-center .xporn-rbac-account-tabs { display:flex; gap:8px; overflow:auto; border-bottom:1px solid var(--xhub-color-border); margin-bottom:22px; }.xhub-account-center .xporn-rbac-account-tabs button { min-height:44px; padding:0 16px; border:0; border-bottom:2px solid transparent; background:transparent; color:var(--xhub-color-muted); white-space:nowrap; }.xhub-account-center .xporn-rbac-account-tabs button.is-active,.xhub-account-center .xporn-rbac-account-tabs button:focus-visible { color:var(--xhub-color-text); border-bottom-color:var(--xhub-color-accent); outline:none; box-shadow:var(--xhub-focus); }.xhub-account-center .xporn-rbac-account-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }.xhub-account-center .xporn-rbac-account-card,.xhub-account-center .xporn-rbac-account-panel { padding:20px; border:1px solid var(--xhub-color-border); border-radius:var(--xhub-radius-md); background:var(--xhub-color-surface); }.xhub-account-center input,.xhub-account-center textarea,.xhub-account-center select { max-width:100%; border-radius:var(--xhub-radius-sm); border:1px solid var(--xhub-color-border); background:var(--xhub-color-elevated); color:var(--xhub-color-text); }.xhub-account-center a,.xhub-account-center button { transition:color var(--xhub-transition),background var(--xhub-transition); }.xhub-account-center .xporn-rbac-account-panel:not(.is-active) { display:none; }
@media (max-width:700px) { .xhub-account-center .xporn-rbac-account-grid { grid-template-columns:1fr; }.xhub-account-center { padding-top:16px; } }
/* UI-012 presentation layer */`n:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--xhub-color-accent);outline-offset:3px;box-shadow:var(--xhub-focus)}`n:where(button,.btn,.xhub-ui-button):disabled,[aria-disabled="true"]{cursor:not-allowed;opacity:.48;transform:none}`n:where(.btn,.xhub-ui-button):active{transform:scale(.98)}`n.xhub-media-fallback{display:grid;place-items:center;width:100%;height:100%;min-height:120px;border-radius:inherit;background:var(--xhub-color-surface);color:var(--xhub-color-muted)}`n.xhub-card,.xhub-review-card,.xhub-product-card,.xhub-stat-card{border:1px solid var(--xhub-color-border);border-radius:var(--xhub-radius-md);background:var(--xhub-color-surface);overflow:hidden}`n.xhub-status-chip,.xhub-badge{display:inline-flex;align-items:center;min-height:24px;padding:2px 8px;border-radius:999px;background:var(--xhub-color-elevated);color:var(--xhub-color-secondary);font-size:12px;font-weight:700}`n.xhub-skeleton{border-radius:var(--xhub-radius-sm);background:var(--xhub-color-elevated)}`n.thumb-404__desc p{max-width:48ch;margin:10px auto 20px;color:var(--xhub-color-secondary)}
[data-xhub-like].is-active,
[data-xhub-like][aria-pressed="true"] {
  color: #ff4f91;
}

[data-xhub-like]:disabled {
  cursor: wait;
  opacity: .65;
}