:root { --ht-accent: #fba924; --ht-muted: #a3a3a3; }
body { width: 100%; overflow-x: hidden; }
body:not(.page-auth) #main-content { padding-bottom: 64px; }
.site-footer { margin-top: auto; flex-shrink: 0; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button, select { cursor: pointer; }
img { max-width: 100%; }
:focus-visible { outline: 3px solid var(--ht-accent); outline-offset: 4px; }
.ht-skip-link { position: fixed; left: 16px; top: -100px; z-index: 10001; padding: 12px 20px; background: #fba924; color: #171717; border-radius: 8px; }
.ht-skip-link:focus { top: 12px; }
.ht-header-shell { position: sticky; top: 0; z-index: 1000; width: 100%; }
.admin-bar .ht-header-shell { top: 32px; }
.site-logo { height: 44px; width: auto; }
.header-primary { gap: 40px; }
.main-navigation .nav-link { gap: 6px; font-size: 18px; }
.main-navigation .nav-link .nav-chevron { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; flex: 0 0 16px; font-size: 16px; line-height: 1; color: #525252; margin-left: 0; }
.main-navigation .nav-link.active .nav-chevron { color: #5f5239; }
.footer-top-left { gap: 40px; }
.footer-navigation { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 60px; max-width: 100%; }
.footer-navigation a { color: #d4d4d4; font-family: "Be Vietnam Pro", sans-serif; font-weight: 500; font-style: normal; font-size: 18px; line-height: 28px; letter-spacing: 0; text-decoration: none; white-space: nowrap; }
.footer-legal { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; width: 100%; gap: 24px; }
.footer-legal-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 24px; max-width: 100%; }
.footer-legal .footer-copyright, .footer-legal .footer-policy-link a { color: #a3a3a3; font-family: "Be Vietnam Pro", sans-serif; font-size: 16px; font-style: normal; line-height: 24px; letter-spacing: 0; }
.footer-legal .footer-copyright { font-weight: 500; }
.footer-legal .footer-policy-link a { font-weight: 400; text-align: right; }
.account-label { display: block; max-width: 180px; overflow: hidden; text-overflow: ellipsis; }
.account-area--logged-in { justify-content: center; width: 40px; height: 40px; }
.account-area--logged-in .account-icon { width: 20px; height: 20px; font-size: 20px; line-height: 1; color: #fff; }
.section-heading { justify-content: space-between; }
.ht-section-link { color: var(--ht-accent); text-decoration: none; font-size: 14px; }
.ht-section-link:hover { text-decoration: underline; }
.featured-news-card, .small-news-card, .news-result-card, .leaderboard-entry, .competition-card-title a, .ranking-item a { text-decoration: none; color: inherit; }
.news-result-card:hover h3, .small-news-card:hover h3, .competition-card-title a:hover { color: var(--ht-accent); }
.ranking-header { display: flex; justify-content: space-between; align-items: center; }
.ranking-item > a { display: flex; align-items: center; gap: 16px; width: 100%; }
.ranking-game-list button[aria-pressed="true"] { outline: 2px solid var(--ht-accent); outline-offset: -2px; }
.upcoming-competition-cards > .competition-card:nth-child(n + 3), .active-finished-competition-cards > .competition-card:nth-child(n + 3) { display: block; }
.ht-empty { padding: 24px; color: #d4d4d4; grid-column: 1 / -1; line-height: 1.7; }
.ht-notice { padding: 16px; margin: 16px 0; border: 1px solid #7c581e; border-radius: 8px; background: #302517; color: #ffcf80; line-height: 1.6; width: 100%; }
.ht-muted { color: #a3a3a3; line-height: 1.7; }
.ht-button { display: inline-flex; align-items: center; justify-content: center; padding: 12px 18px; gap: 8px; border: 0; border-radius: 8px; background: var(--ht-accent); color: #171717; font-weight: 700; text-decoration: none; cursor: pointer; }
.ht-button:hover { background: #ffbd51; }
.ht-filters { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 16px; margin: 24px 0; }
.ht-filters label { display: flex; flex-direction: column; gap: 8px; color: #d4d4d4; font-size: 14px; }
.ht-filters select { padding: 12px; border: 1px solid #404040; border-radius: 8px; background: #171717; color: #fff; max-width: 100%; }
.news-search-row { align-items: center; flex-wrap: wrap; gap: 16px; }
.news-search { flex: 1; min-width: 220px; }
.ht-browser-title { margin-bottom: 24px; }
.ht-pagination { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; padding-top: 32px; }
.ht-pagination a, .ht-pagination span { min-width: 40px; padding: 10px 14px; border-radius: 8px; background: #242424; text-align: center; text-decoration: none; color: #fff; }
.ht-pagination .current, .ht-pagination a:hover { background: var(--ht-accent); color: #171717; }
.ht-page-main { width: 100%; max-width: 1100px; margin: 0 auto; padding: 48px 24px 80px; }
.ht-article { padding: 32px; border: 1px solid #2e2e2e; border-radius: 16px; background: #171717; }
.ht-article h1 { font-size: clamp(28px, 3vw, 44px); line-height: 1.35; margin: 24px 0; }
.ht-article h2 { margin: 32px 0 20px; font-size: 24px; }
.ht-article-meta { color: #a3a3a3; margin-bottom: 24px; }
.ht-article-image { width: 100%; max-height: 540px; object-fit: cover; border-radius: 12px; margin-bottom: 32px; }
.ht-prose { color: #d4d4d4; font-size: 16px; line-height: 1.85; overflow-wrap: anywhere; }
.ht-prose > * + * { margin-top: 20px; }
.ht-prose h2, .ht-prose h3, .ht-prose h4 { color: #fff; line-height: 1.4; }
.ht-prose a { color: #fba924; }
.ht-prose ul, .ht-prose ol { padding-left: 24px; }
.ht-prose figure, .ht-prose iframe { max-width: 100%; }
.ht-prose img { height: auto; border-radius: 8px; }
.ht-prose blockquote { border-left: 3px solid #fba924; padding: 12px 20px; background: #242424; }
.ht-prose table { border-collapse: collapse; width: 100%; }
.ht-prose td, .ht-prose th { border: 1px solid #404040; padding: 12px; }
.ht-prose pre { padding: 16px; background: #0a0a0a; overflow: auto; }
.ht-prose .alignwide, .ht-prose .alignfull { max-width: 100%; }
.tournament-registration-button { display: flex; align-items: center; justify-content: center; width: 100%; min-height: 64px; padding: 0 20px; border-radius: 16px; background: #fba924; color: #000; font-family: "Be Vietnam Pro", sans-serif; font-size: 20px; font-weight: 700; text-align: center; text-decoration: none; }
.tournament-registration-message { color: #d4d4d4; font-size: 16px; line-height: 24px; }
.tournament-registration-action button:disabled { cursor: not-allowed; }
.tournament-introduction-copy > * { max-width: 100%; overflow-wrap: anywhere; }
.tournament-introduction-copy img { height: auto; }
.tournament-prize-detail p { margin: 0; }
.leaderboard-profile-avatar { object-fit: cover; }
.leaderboard-search { position: relative; }
.leaderboard-entry[role="link"] { cursor: pointer; }
.ht-player-card { padding: 24px; border: 1px solid #2e2e2e; background: #171717; border-radius: 16px; }
.ht-player-card h1 { font-size: 26px; line-height: 1.4; margin: 20px 0 8px; }
.ht-player-avatar { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 12px; }
.ht-player-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 24px; }
.ht-player-stats > div { padding: 16px; background: #242424; border-radius: 12px; }
.ht-player-stats span { display: block; font-size: 13px; color: #a3a3a3; }
.ht-player-stats strong { display: block; color: #fba924; font-size: 28px; margin-top: 8px; }
.ht-account-entries { padding-left: 20px; line-height: 2; margin-bottom: 32px; }
.page-auth { height: auto; min-height: 100vh; color: #fff; }
.input-caption { color: #d4d4d4; font-size: 12px; line-height: 16px; }
.auth-panel { height: auto; min-height: 100vh; padding: 60px 24px; gap: 28px; }
.auth-title { width: auto; height: auto; font-size: clamp(26px, 3vw, 36px); }
.auth-visual { position: sticky; top: 0; }
.signup-content { max-width: 100%; gap: 24px; }
.signup-form, .login-inputs, .login-options { max-width: 100%; }
.signup-form input:not([type="checkbox"]), .password-field, .signup-action button { width: 100%; }
.signup-form input[type="hidden"] { display: none; }
.signup-fields .login-inputs { gap: 8px; }
.signup-form .input-caption { margin-top: 8px; }
.signup-action button { cursor: pointer; background: #fba924; color: #171717; }
.password-icon { background: transparent; border: 0; cursor: pointer; }
.signup-form .remember-login input:checked { appearance: auto; accent-color: #fba924; }
.account-switch { line-height: 1.6; text-align: center; }
@media (min-width: 961px) {
    .leaderboard-main { padding: 0 16px; }
    .leaderboard-list { padding-top: 43px; }
    .leaderboard-player-profile { margin-top: 0; top: 81px; }
    .admin-bar .leaderboard-player-profile { top: 113px; min-height: calc(100vh - 113px); }
}
@media (max-width: 1100px) {
    .nav-link { padding: 6px 12px; }
    .tournament-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 960px) {
    .leaderboard-layout { grid-template-columns: minmax(0, 1fr); }
    .leaderboard-profile-identity { width: auto; margin-right: 16px; margin-left: 16px; }
}
@media (max-width: 782px) {
    .single-ht_tournament .tournament-banner { height: auto; aspect-ratio: 1200 / 450; }
    .single-ht_tournament .tournament-overview-header { min-height: 0; padding: 20px; }
    .single-ht_tournament .tournament-overview-header h1 { font-size: 28px; line-height: 42px; }
    .single-ht_tournament .tournament-registration-status { flex-wrap: wrap; }
    .single-ht_tournament .tournament-overview-format, .single-ht_tournament .tournament-overview-details { padding: 20px 12px; gap: 12px; }
    .single-ht_tournament .tournament-stat-copy > strong { font-size: 14px; overflow-wrap: anywhere; }
    .single-ht_tournament .tournament-sponsors { grid-template-columns: minmax(0, 1fr); }
    .single-ht_tournament .tournament-sponsor-card { max-width: 100%; }
    .single-ht_tournament .tournament-support-card { flex-wrap: wrap; }
    .single-ht_tournament .tournament-support-copy { white-space: normal; }
    .admin-bar .ht-header-shell { top: 46px; }
    .site-header { height: auto; }
    .header-content { padding: 16px; flex-wrap: wrap; gap: 12px; position: relative; }
    .header-primary { width: 100%; flex-wrap: wrap; }
    .main-navigation { width: 100%; overflow-x: auto; }
    .main-navigation ul { width: max-content; min-height: 44px; }
    .account-area { position: absolute; right: 16px; top: 16px; }
    .account-label { max-width: 150px; font-size: 12px; }
    .auth-panel { width: 100%; flex: 1 1 100%; }
    .auth-visual { display: none; }
    .auth-title { max-width: 100%; white-space: normal; }
    .login-options { flex-wrap: wrap; gap: 12px; }
    .ht-page-main { padding: 24px 16px 48px; }
    .ht-article { padding: 20px; }
    .footer-top, .footer-bottom { flex-direction: column; gap: 24px; }
    .footer-bottom-right { align-items: flex-start; text-align: left; }
    .footer-policy-link a { text-align: left; }
    .homepage-slider { height: auto; aspect-ratio: 1200 / 514; }
    .slider-bottom { height: 100%; }
    .slider-top { height: 87.55%; }
    .slider-slide { height: 100%; background-size: contain; }
    .slider-controls { right: 8px; bottom: 8px; }
    .slider-pagination { height: 24px; padding: 6px 8px; gap: 8px; }
    .slider-dot { width: 4px; height: 4px; }
    .slider-dot.active { width: 24px; }
    .homepage-competitions { grid-template-columns: minmax(0, 1fr); }
    .competition-schedule, .competition-sidebar { width: 100%; }
    .competition-sidebar { min-width: 0; }
    .upcoming-competition-cards, .active-finished-competition-cards { display: grid; grid-template-columns: 1fr; }
    .competition-card { width: 100%; max-width: none; }
    .news-section { flex-direction: column; }
    .news-section-left, .news-section-right { width: 100%; min-width: 0; flex: 1 1 auto; }
    .section-heading h2, .competition-section-header h2 { font-size: 24px; line-height: 1.5; }
    .competition-section-header { align-items: flex-start; gap: 12px; }
    .tournament-card-grid { grid-template-columns: minmax(0, 1fr); }
    .tournament-section-header h1, .tournament-section-header h2, .leaderboard-heading h1 { font-size: 24px; line-height: 1.5; }
    .leaderboard-heading, .leaderboard-board-heading { flex-direction: column; align-items: stretch; gap: 16px; }
    .leaderboard-search { width: 100%; flex: 0 1 auto; }
    .leaderboard-status-row { flex-wrap: wrap; gap: 8px; font-size: 14px; }
    .leaderboard-board { padding: 16px 12px 0; }
    .leaderboard-game-title h2 { font-size: 22px; }
    .leaderboard-mode-toggle { width: 100%; flex: 0 1 auto; }
    .leaderboard-mode-toggle::before { display: none; }
    .leaderboard-mode-toggle button { width: auto; min-width: 0; flex: 1 1 0; }
    .leaderboard-mode-toggle button[aria-pressed="true"] { background: #171717; }
    .leaderboard-entry { gap: 8px; }
    .leaderboard-entry-rank { width: 24px; flex-basis: 24px; font-size: 16px; }
    .leaderboard-entry-player { gap: 8px; }
    .leaderboard-entry-avatar { width: 36px; height: 36px; flex-basis: 36px; }
    .leaderboard-entry-identity strong { font-size: 14px; }
    .leaderboard-entry-identity span { font-size: 12px; }
    .leaderboard-entry-score { font-size: 16px; }
    .leaderboard-entry-open { width: 16px; flex-basis: 16px; padding: 0; }
    .leaderboard-player-profile { min-height: 0; padding-bottom: 24px; }
    .leaderboard-profile-avatar { margin-top: 40px; }
    .leaderboard-profile-badges { width: auto; max-width: none; height: auto; margin-right: 16px; margin-left: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .leaderboard-profile-badge, .leaderboard-profile-badge--duel { padding-right: 8px; padding-left: 8px; }
    .leaderboard-profile-badge-copy span { white-space: normal; font-size: 12px; }
    .ht-player-stats { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; }
}