.button,button:not(.menu-toggle):not(.button-quiet) {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  padding:13px 22px;
  border-radius:8px;
  background:var(--accent);
  color:var(--on-accent);
  font-weight:750;
  text-decoration:none;
  min-height:46px;
  transition:background .18s,transform .18s
}
.button:hover,button:not(:disabled):hover {
  background:var(--accent-hover);
  text-decoration:none
}
.button-outline {
  background:transparent;
  border:1px solid var(--border);
  color:var(--text)
}
.button-outline:hover {
  background:var(--card);
  color:var(--text)
}
.button-small {
  font-size:.82rem;
  padding:8px 14px;
  min-height:40px
}
.button-quiet {
  background:transparent;
  color:var(--muted);
  padding:8px 0;
  min-height:40px
}
.button-quiet:hover {
  color:var(--text);
  background:transparent
}
.site-header {
  background:var(--bg);
  border-bottom:1px solid var(--border)
}
.header-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding-block:22px
}
.brand {
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--text);
  flex-shrink:0
}
.brand:hover {
  text-decoration:none
}
.brand>.icon {
  color:var(--accent);
  width:44px;
  height:44px
}
.brand strong {
  display:block;
  font-size:.92rem;
  line-height:1.2;
  letter-spacing:.035em
}
.brand strong span {
  color:var(--accent)
}
.brand small {
  display:block;
  font-size:.59rem;
  color:var(--muted);
  margin-top:7px
}
.navigation-panel {
  display:flex;
  align-items:center;
  gap:28px
}
.primary-nav,.header-actions {
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap
}
.primary-nav a,.header-actions>a:not(.button) {
  font-size:.78rem;
  color:var(--muted);
  white-space:nowrap
}
.primary-nav a:hover,.primary-nav a[aria-current] {
  color:var(--accent)
}
.header-actions {
  gap:16px
}
.search-shortcut .icon {
  width:22px;
  height:22px
}
.menu-toggle {
  display:none;
  color:var(--text);
  background:var(--section);
  border:1px solid var(--border);
  border-radius:8px;
  padding:10px;
  align-items:center;
  gap:8px;
  font-size:.75rem
}
.menu-lines {
  display:block;
  width:18px;
  height:12px;
  border-top:2px solid currentColor;
  border-bottom:2px solid currentColor;
  position:relative
}
.menu-lines::after {
  content:"";
  height:2px;
  background:currentColor;
  position:absolute;
  inset:4px 0 auto
}
.site-footer {
  border-top:1px solid var(--border);
  padding:40px 0 24px;
  background:var(--section)
}
.footer-top {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  flex-wrap:wrap
}
.footer-top p {
  font-size:.85rem;
  margin:0
}
.footer-top nav {
  display:flex;
  gap:20px;
  font-size:.78rem;
  flex-wrap:wrap
}
.footer-bottom {
  margin-top:32px;
  padding-top:20px;
  border-top:1px solid var(--border);
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  color:var(--muted)
}
.empty-state {
  grid-column:1/-1;
  width:100%;
  border:1px dashed var(--border);
  border-radius:var(--radius);
  min-height:190px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:28px;
  padding:36px;
  background:var(--bg)
}
.empty-state>.icon {
  width:54px;
  height:54px;
  color:var(--accent);
  opacity:.7
}
.empty-state h3 {
  margin-bottom:10px
}
.empty-state p {
  font-size:.88rem;
  margin:0;
  max-width:620px
}
.video-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:24px
}
.video-card {
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius);
  overflow:hidden;
  min-width:0;
  transition:transform .2s,box-shadow .2s
}
.video-card-link {
  display:block;
  color:var(--text)
}
.video-card-link:hover {
  text-decoration:none
}
.video-thumbnail {
  position:relative;
  aspect-ratio:16/9;
  background:var(--section)
}
.video-thumbnail img {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover
}
.play-badge {
  position:absolute;
  bottom:12px;
  right:12px;
  background:var(--bg);
  padding:4px 10px;
  border-radius:6px
}
.category-tabs a {display:inline-flex;align-items:center;justify-content:center;padding:13px 22px;min-height:46px;border:1px solid var(--border);border-radius:8px;background:var(--section);color:var(--text);font-weight:700;text-decoration:none}
.category-tabs a:hover,.category-tabs a[aria-current="true"] {border-color:var(--accent);color:var(--accent);background:var(--bg)}
a.category-card {color:var(--text);text-decoration:none}
a.category-card:hover {border-color:var(--accent)}
.video-card-body {
  padding:20px
}
.video-card h3 {
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin:12px 0 8px;
  overflow-wrap:anywhere
}
.video-card p {
  font-size:.85rem;
  margin-bottom:6px
}
.video-card small {
  color:var(--muted)
}
.video-meta {
  font-size:.75rem!important
}
@media(hover:hover) {
  .video-card:hover {
    transform:translateY(-4px);
    box-shadow:var(--shadow)
  }
}
@media(max-width:1439px) {
  .header-inner {
    flex-wrap:wrap;
    gap:18px
  }
  .navigation-panel {
    flex:1;
    justify-content:flex-end;
    flex-wrap:wrap;
    gap:16px
  }
  .primary-nav {
    gap:16px
  }
  .header-actions {
    gap:12px
  }
}
@media(max-width:1023px) {
  .header-inner {
    align-items:center
  }
  .menu-toggle:not([hidden]) {
    display:flex
  }
  .navigation-panel {
    width:100%;
    flex-basis:100%;
    align-items:start;
    justify-content:start
  }
  .primary-nav,.header-actions {
    width:100%
  }
  .site-header[data-enhanced] .navigation-panel[data-open="false"] {
    display:none
  }
  .site-header[data-enhanced] .navigation-panel[data-open="true"] {
    display:flex
  }
  .primary-nav {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .primary-nav a {
    padding-block:10px
  }
  .video-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:600px) {
  .header-inner {
    padding-block:16px;
    gap:12px
  }
  .brand {
    gap:8px
  }
  .brand strong {
    font-size:.75rem
  }
  .brand small {
    font-size:.49rem
  }
  .brand>.icon {
    width:34px;
    height:34px
  }
  .primary-nav {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .empty-state {
    padding:28px 20px;
    gap:18px;
    align-items:start
  }
  .empty-state>.icon {
    width:34px;
    height:34px
  }
  .empty-state h3 {
    font-size:1rem
  }
  .empty-state p {
    font-size:.8rem
  }
  .video-grid {
    grid-template-columns:1fr
  }
  .footer-top {
    align-items:start;
    gap:22px
  }
  .header-actions {
    flex-wrap:wrap
  }
  .site-footer {
    padding-top:32px
  }
}

.hero-actions > .button:not(.button-outline),
.header-management > summary.button,
.contribute > .button {
  background:linear-gradient(120deg,#c95016,#c62828);
  color:#fff;
}
.hero-actions > .button:not(.button-outline):hover,
.header-management > summary.button:hover,
.contribute > .button:hover {
  background:linear-gradient(120deg,#ad3d0e,#a51e26);
  color:#fff;
}
.button-registration { background:var(--registration); color:var(--on-accent); }
.policy-document {max-width:900px;margin-inline:auto;line-height:1.9}
.policy-document h2 {font-size:1.25rem;margin-top:2rem}
.policy-document ul {padding-left:1.5rem}
.policy-document a {overflow-wrap:anywhere}
.button-registration:hover { background:var(--registration-hover); color:var(--on-accent); }
.cta-triangle { width:0; height:0; border-top:5px solid transparent; border-bottom:5px solid transparent; border-left:8px solid currentColor; flex-shrink:0; }

/* Management workspace and click-to-load YouTube player */
.admin-heading {display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:24px}
.workspace-nav {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:20px}
.workspace-link {display:flex;flex-direction:column;gap:8px;padding:22px;background:var(--section);border:1px solid var(--border);border-radius:16px;text-decoration:none;min-width:0}
.workspace-link span {font-size:.85rem;color:var(--muted)}
.workspace-link:hover,.workspace-link[aria-current] {border-color:var(--accent);background:var(--card)}
.workspace-settings {margin-bottom:32px;padding:16px;border:1px solid var(--border);border-radius:12px}
.workspace-settings summary {cursor:pointer;font-weight:700}
.workspace-settings-links {display:flex;gap:20px;flex-wrap:wrap;align-items:center;margin-top:18px}
.workspace-settings p {font-size:.85rem}
.video-player {position:relative;aspect-ratio:16/9;overflow:hidden;background:#071923;border-radius:16px;width:100%;margin-bottom:20px}
.video-card .video-player {border-radius:0;margin:0}
.video-player-trigger {position:relative;width:100%;height:100%;padding:0;display:block;border:0;background:transparent;cursor:pointer;color:#fff}
.video-player-trigger img {width:100%;height:100%;object-fit:cover;display:block}
.video-player-trigger .play-badge {position:absolute;right:18px;bottom:18px;background:#d92332;color:#fff}
.video-player-trigger:hover .play-badge {background:#b91827;color:#fff}
.player-caption {position:absolute;left:16px;bottom:16px;background:#071923;padding:5px 10px;border-radius:6px;font-size:.8rem}
.video-player iframe {display:block;width:100%;height:100%;border:0}
.video-player-trigger:focus-visible {outline:3px solid var(--accent);outline-offset:-4px}
@media(max-width:768px) {.workspace-nav {grid-template-columns:repeat(2,minmax(0,1fr))}.workspace-link{padding:16px}}
@media(max-width:390px) {.workspace-nav {grid-template-columns:1fr}}

.header-management {position:relative}
.header-management summary {cursor:pointer;list-style:none}
.header-management summary::-webkit-details-marker {display:none}
.header-management nav {position:absolute;right:0;top:calc(100% + 10px);z-index:50;min-width:230px;display:grid;gap:4px;padding:12px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.header-management nav>a {display:block;padding:12px;border-radius:8px;white-space:nowrap}
.header-management nav>a:hover {background:var(--section)}
@media(max-width:600px){.header-management nav{right:auto;left:0;max-width:calc(100vw - 48px)}}
.creator-avatar { object-fit: cover; }
.submission-pagination {display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-block:24px}
.submission-pagination a,.submission-pagination [aria-current="page"] {display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px 12px;border:1px solid var(--border);border-radius:8px}
.submission-pagination [aria-current="page"] {background:var(--accent);color:#fff}
.featured-order-list {padding-left:2rem}
.featured-order-row {padding:16px;margin-block:12px;background:var(--card);border:1px solid var(--border);border-radius:12px}
.featured-order-title {display:inline-block;margin:8px;overflow-wrap:anywhere}
.featured-drag-handle {touch-action:none;cursor:grab;min-width:44px;min-height:44px}
.featured-order-row.is-dragging {outline:2px solid var(--accent);background:var(--section)}
.featured-order-row button {margin:4px}
.back-to-top {position:fixed;right:24px;bottom:calc(24px + env(safe-area-inset-bottom, 0px));z-index:60;display:grid;place-items:center;width:52px;height:52px;padding:0;border:0;border-radius:50%;background:#c62828;color:#fff;font-size:28px;line-height:1;box-shadow:0 4px 16px #132d3b33;cursor:pointer}
.back-to-top[hidden] {display:none}
.back-to-top:hover {background:#a51f1f}
.back-to-top:focus-visible {outline:3px solid var(--accent);outline-offset:4px}
@media(max-width:600px){.back-to-top{right:16px;bottom:calc(16px + env(safe-area-inset-bottom, 0px));width:48px;height:48px}}
