:root {
    --bg-dark: #030303;
    --interface-surface: #101419;
    --interface-surface-raised: #1a1e23;
    --interface-control: #202429;
    --panel-bg: var(--interface-surface);
    --panel-border: #3e444b;
    --brand-red: #8a0b0b;
    --brand-red-glow: rgba(138, 11, 11, 0.5);
    --text-main: #ffffff;
    --text-muted: #aaaaaa;
    --font-stack: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { min-height: 100%; }
body { background-color: var(--bg-dark); font-family: var(--font-stack); color: var(--text-main); overflow-x: hidden; overflow-y: auto; }

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--bg-dark); }
::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--brand-red); }

#app-wrapper { max-width: 1680px; margin: 0 auto; padding: 1.25rem; animation: fadeIn 0.5s ease-out; }
.account-status-container { display: flex; justify-content: flex-end; align-items: center; min-height: 2rem; margin: 0 0 .55rem; }
.account-status-container:empty { display: none; }
.account-status-badge { display: inline-flex; align-items: center; gap: .5rem; padding: .38rem .5rem .38rem .65rem; border: 1px solid var(--panel-border); border-radius: 999px; background: var(--interface-surface); color: #d7dbe0; box-shadow: 0 4px 16px rgba(0,0,0,.32); font-size: .78rem; font-weight: 600; line-height: 1; }
.account-status-indicator { width: .5rem; height: .5rem; flex: 0 0 auto; border-radius: 50%; background: #3ba55d; box-shadow: 0 0 8px rgba(59,165,93,.65); }
.account-role-badge { padding: .3rem .55rem; border-radius: 999px; background: rgba(138,11,11,.9); color: #fff; font-size: .72rem; letter-spacing: .02em; text-transform: uppercase; }
.app-header { display: grid; grid-template-columns: 112px minmax(0, 1fr) 112px; align-items: center; gap: 1rem; margin-bottom: 2rem; border-bottom: 1px solid var(--panel-border); padding-bottom: 1.5rem; text-align: center; }
.header-dgg-mark { width: 112px; height: 112px; object-fit: cover; border: 1px solid rgba(213,161,161,.4); border-radius: 10px; box-shadow: 0 0 18px rgba(138,11,11,.24); }
.glow-title { font-size: 2.5rem; letter-spacing: -0.5px; font-weight: 900; text-transform: uppercase; }
.glow-title span { color: var(--brand-red); text-shadow: 0 0 15px var(--brand-red-glow); }
.app-quote { color: var(--text-muted); font-size: 1rem; margin-top: 0.5rem; font-style: italic; }

.header-ad-slots { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .6rem; margin: 0 auto 1rem; }
.hub-nav-bar { display: flex; justify-content: space-between; align-items: center; gap: .75rem; background: rgba(255, 255, 255, 0.02); border: 1px solid var(--panel-border); border-radius: 6px; padding: .6rem 1rem; margin-bottom: 1.25rem; width: 100%; }
.nav-links-group, .nav-admin-group { display: flex; flex-wrap: wrap; gap: .5rem; }
.nav-links-group { flex: 1; }
.nav-overflow { position: relative; }
.nav-overflow summary { list-style: none; }
.nav-overflow summary::-webkit-details-marker { display: none; }
.nav-overflow-menu { position: absolute; top: calc(100% + .45rem); left: 0; z-index: 30; display: grid; gap: .35rem; min-width: 170px; padding: .45rem; border: 1px solid var(--panel-border); border-radius: 6px; background: #111; box-shadow: 0 10px 30px rgba(0,0,0,.5); }
.nav-overflow-menu .nav-btn { text-align: left; }
.nav-btn { background: transparent; border: 1px solid var(--panel-border); color: var(--text-muted); padding: 0.4rem 1rem; font-size: 0.85rem; font-weight: 600; border-radius: 4px; cursor: pointer; transition: all 0.2s ease; }
.nav-btn:hover, .nav-btn.active { background: var(--brand-red); color: #fff; border-color: var(--brand-red); box-shadow: 0 0 10px var(--brand-red-glow); }
.support-dgg-nav { margin-left: auto; border-color: #ad8b45; background: rgba(173,139,69,.12); color: #f2d99c; white-space: nowrap; }
.support-dgg-nav:hover, .support-dgg-nav:focus-visible { border-color: #d8b86c; background: #7a591c; color: #fff8df; box-shadow: 0 0 12px rgba(216,184,108,.28); }

.app-view { display: none; }
.app-view.active { display: block; animation: fadeIn 0.3s ease-out; }
.content-panel { background: var(--panel-bg); border: 1px solid var(--panel-border); border-radius: 8px; padding: 2rem; }
.panel-header-row { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--panel-border); padding-bottom: 1rem; }

.directory-layout { display: grid; grid-template-columns: minmax(125px, 12vw) minmax(0, 1fr) minmax(125px, 12vw); gap: 1rem; align-items: start; }
.directory-layout--no-side-ads { grid-template-columns: minmax(0, 1fr); }
.directory-layout--community-page { grid-template-columns: minmax(0, 1fr); }
.directory-layout--community-page .side-rail { display: none; }
.directory-layout--community-page .tiles-container { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tiles-container { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; width: 100%; }
.tiles-container > div { transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s ease, border-color 0.2s ease !important; }
.tiles-container > div:hover { transform: translateY(-4px); box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5); border-color: var(--brand-red) !important; }

.modal-backdrop { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); display: flex; justify-content: center; align-items: center; z-index: 1000; }
.modal-window { position: relative; background: #0a0a0a; border: 1px solid var(--brand-red); border-radius: 8px; padding: 2rem; width: min(720px, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); overflow-y: auto; box-shadow: 0 0 30px var(--brand-red-glow); }
.modal-close { position: sticky; top: -.85rem; float: right; z-index: 2; width: 2rem; height: 2rem; margin: -.7rem -.7rem .4rem .8rem; border: 1px solid var(--panel-border); border-radius: 999px; background: #151515; color: #fff; cursor: pointer; font-size: 1.35rem; line-height: 1; }
.modal-close:hover { border-color: #d5a1a1; background: var(--brand-red); }
.ad-slot { min-height: 94px; display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 6px; color: var(--text-muted); text-align: center; font: inherit; font-size: .78rem; }
.ad-slot--link { width: 100%; border: 1px solid transparent; cursor: pointer; background: transparent; }
.ad-slot--link:hover { border-color: rgba(213,161,161,.66); }
.ad-slot-placeholder { background: rgba(255,255,255,.025); border: 1px dashed rgba(255,255,255,.2); }
.ad-slot-placeholder { cursor: pointer; }
.ad-slot__text { display: grid; gap: .3rem; padding: .7rem; }
.ad-slot__text strong { color: #fff; font-size: .9rem; }
.ad-slot__text small { color: var(--text-muted); line-height: 1.3; }
.ad-slot__image-fallback { display: grid; gap: .35rem; padding: .8rem; }
.ad-slot__image-fallback[hidden] { display: none; }
.ad-slot__image-fallback strong { color: #fff; }
.ad-slot__image-fallback small { color: var(--text-muted); line-height: 1.35; }
.ad-slot img { width: 100%; height: 100%; min-height: 94px; object-fit: cover; display: block; }
.is-empty { display: none !important; }
.side-rail { position: sticky; top: 1rem; display: grid; grid-template-rows: auto auto; align-content: start; gap: 1rem; align-self: start; isolation: isolate; }
.side-rail > .side-ad-slot { position: relative; z-index: 0; overflow: hidden; }
.side-ad-slot { height: 440px; min-height: 440px; }
.side-ad-slot .ad-slot { height: 440px; min-height: 440px; }
.side-ad-slot--advertisement { height: 220px; min-height: 220px; }
.side-ad-slot--advertisement .ad-slot { height: 220px; min-height: 220px; }
.player-promotion-card { position: relative; width: 100%; height: 440px; min-height: 440px; overflow: hidden; border: 1px solid rgba(213,161,161,.55); border-radius: 6px; background: var(--interface-surface-raised); color: #fff; outline: none; }
.player-promotion-card:hover, .player-promotion-card:focus-visible { border-color: #d5a1a1; box-shadow: 0 0 20px rgba(138,11,11,.32); }
.player-promotion-card--link { cursor: pointer; }
.player-promotion-card__image { display: block; width: 100%; height: 100%; min-height: 440px; object-fit: cover; }
.player-promotion-card__details { position: absolute; inset: auto 0 0; display: grid; gap: .42rem; max-height: 88%; overflow-y: auto; padding: 1rem .8rem .8rem; background: linear-gradient(180deg, transparent, rgba(0,0,0,.96) 18%); transform: translateY(calc(100% - 3.1rem)); transition: transform .22s ease; }
.player-promotion-card:hover .player-promotion-card__details, .player-promotion-card:focus-within .player-promotion-card__details { transform: translateY(0); }
.player-promotion-card__title { font-size: 1rem; }
.player-promotion-card__headline { color: #f3d6d6; font-size: .86rem; font-weight: 800; }
.player-promotion-card__details p { color: #d7dbe0; font-size: .78rem; line-height: 1.42; white-space: pre-wrap; }
.player-promotion-card__communities { display: grid; gap: .12rem; color: #d5a1a1; font-size: .75rem; line-height: 1.35; }
.player-promotion-card__details small { color: #9da3aa; font-size: .68rem; line-height: 1.3; }
.player-spotlight-navigation { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .45rem; margin-top: .55rem; }
.player-spotlight-navigation > span { color: var(--text-muted); font-size: .7rem; text-align: center; white-space: nowrap; }
.player-spotlight-navigation .nav-btn { min-width: 0; padding: .42rem .5rem; font-size: .68rem; }
.theme-gradient-grid, .theme-schedule-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.theme-gradient-grid label:last-child { grid-column: 1 / -1; }
.promotion-manager-choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .8rem; margin: 1rem 0; }
.promotion-workflow-label { display: grid; gap: .25rem; padding: .75rem; border: 1px solid var(--panel-border); border-radius: 5px; background: rgba(255,255,255,.025); }
.promotion-workflow-label span { color: var(--text-muted); font-size: .78rem; }
.promotion-manager-choice { display: grid; gap: .4rem; min-height: 110px; padding: 1rem; border: 1px solid var(--panel-border); border-radius: 6px; color: #fff; background: var(--interface-surface-raised); text-align: left; cursor: pointer; }
.promotion-manager-choice:hover, .promotion-manager-choice:focus-visible { border-color: #c64b4b; box-shadow: 0 0 14px rgba(138,11,11,.25); }
.promotion-manager-choice span { color: var(--text-muted); font-size: .8rem; line-height: 1.45; }
.player-promotion-card__identity, .player-promotion-card__schedule { color: #cfd3d7; font-size: .76rem; }
.spotlight-recovery-list { display: grid; gap: .8rem; max-height: 60vh; overflow-y: auto; }
.spotlight-recovery-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; padding: .9rem; border: 1px solid var(--panel-border); border-radius: 6px; background: var(--interface-surface-raised); }
.spotlight-recovery-actions { display: grid; align-content: start; gap: .45rem; }
.spotlight-recovery-confirmation:not(:empty) { margin-top: .9rem; padding: .8rem; border: 1px solid rgba(213,161,161,.55); border-radius: 6px; background: rgba(0,0,0,.32); }
.spotlight-recovery-form { display: grid; gap: .7rem; }
.spotlight-recovery-form h4 { margin: 0; }
.spotlight-recovery-form label { display: grid; gap: .35rem; }
.spotlight-recovery-form textarea, .spotlight-recovery-form input { width: 100%; color: #fff; background: #111; border: 1px solid var(--panel-border); border-radius: 4px; padding: .65rem; font: inherit; }
.spotlight-vote-report { margin-top: .8rem; padding: .6rem; border: 1px solid var(--panel-border); border-radius: 5px; }
.spotlight-vote-report summary { cursor: pointer; font-weight: 700; }
.table-scroll { margin-top: .6rem; overflow-x: auto; }
.table-scroll table { width: 100%; border-collapse: collapse; font-size: .75rem; }
.table-scroll th, .table-scroll td { padding: .45rem; border-bottom: 1px solid var(--panel-border); text-align: left; }
.review-status-note { padding: .5rem .65rem; border-left: 3px solid #d29a45; color: #e5c998; background: rgba(210,154,69,.08); }
@media (max-width: 720px) { .promotion-manager-choices, .theme-gradient-grid, .theme-schedule-grid, .spotlight-recovery-item { grid-template-columns: 1fr; } }
.site-theme--animated { animation: dgg-theme-drift var(--site-theme-animation-speed, 24s) ease-in-out infinite alternate; }
.site-theme--chromatic { animation-name: dgg-theme-drift; animation-timing-function: linear; }
@keyframes dgg-theme-drift { from { background-position: 0% 45%; } to { background-position: 100% 55%; } }
.discord-activity-runtime { background-attachment: scroll !important; }
.discord-activity-runtime.site-theme--animated, .discord-activity-runtime.site-theme--chromatic { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .site-theme--animated, .site-theme--chromatic { animation: none !important; } }
.editor-preview { display: grid; gap: .6rem; min-height: 120px; padding: .8rem; border: 1px dashed #5c626a; border-radius: 6px; background: #080a0c; }
.editor-preview[hidden] { display: none; }
.editor-preview > .ad-slot, .editor-preview > .player-promotion-card { width: min(100%, 600px); min-height: 150px; margin-inline: auto; }
.theme-preview { min-height: 180px; padding: 1rem; border: 1px solid var(--panel-border); border-radius: 8px; background-color: #030303; background-position: center; background-size: cover; overflow: hidden; }
.theme-preview::after { content: "Live preview"; display: grid; place-items: center; min-height: 148px; border: 1px solid rgba(255,255,255,.18); border-radius: 6px; color: #fff; font-weight: 700; letter-spacing: .04em; text-shadow: 0 2px 5px #000; background: rgba(0,0,0,.18); }
.theme-schedule-summary { padding: .75rem; border: 1px solid var(--panel-border); border-radius: 6px; background: var(--interface-surface-raised); }
.theme-schedule-summary summary { cursor: pointer; font-weight: 700; }
.community-directory-heading { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.community-tile { display: grid; grid-template-columns: minmax(110px, .3fr) minmax(0, 1fr) minmax(110px, .3fr); gap: .75rem; padding: .75rem; background: rgba(255,255,255,.02); border: 1px solid var(--panel-border); border-radius: 10px; align-self: start; }
.community-tile--no-side-ads { grid-template-columns: minmax(0, 1fr); }
.community-tile--no-side-ads .community-main { grid-column: 1; }
.community-top-ads { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .6rem; }
.community-top-ads .ad-slot { min-height: 130px; }
.community-side-ad .ad-slot { min-height: 100%; height: 100%; }
.community-main { min-width: 0; display: grid; gap: .75rem; }
.community-brand { display: grid; grid-template-columns: 120px minmax(0, 1fr) 72px; gap: .6rem; align-items: stretch; }
.community-logo, .dgg-logo { background: #080808; border: 1px solid var(--panel-border); min-height: 100px; display: grid; place-items: center; overflow: hidden; border-radius: 6px; color: var(--text-muted); font-size: .72rem; text-align: center; }
.community-logo img, .dgg-logo img { width: 100%; height: 100%; object-fit: cover; }
.community-title { background: #080808; border: 1px solid var(--panel-border); border-radius: 6px; display: flex; align-items: center; padding: 1rem; }
.community-title h2 { font-size: clamp(1.2rem, 2.4vw, 2rem); }
.community-details { display: grid; grid-template-columns: 1.1fr .9fr; gap: .75rem; }
.community-panel { border: 1px solid var(--panel-border); border-radius: 6px; padding: 1rem; background: #080808; min-height: 210px; }
.community-panel p { color: var(--text-muted); line-height: 1.55; white-space: pre-wrap; }
.rich-content { color: var(--text-muted); line-height: 1.6; }
.rich-content p + p, .rich-content p + ul, .rich-content ul + p, .rich-content h3 + p { margin-top: .7rem; }
.rich-content h3 { color: #fff; font-size: 1rem; margin-top: .75rem; }
.rich-content ul { margin: .65rem 0 0 1.2rem; }
.rich-content li + li { margin-top: .3rem; }
.rich-content a { color: #f0c76a; text-decoration: underline; }
.rich-content code { padding: .08rem .25rem; border-radius: 3px; background: rgba(255,255,255,.09); color: #f5e5b1; }
.community-editor-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1rem; }
.community-panel dl { margin-top: 1rem; display: grid; gap: .45rem; color: var(--text-muted); font-size: .88rem; }
.community-panel dt { color: #fff; font-weight: 700; }
.community-actions { display: grid; gap: .65rem; margin-top: 1rem; }
.community-actions a, .community-actions button { display: block; width: 100%; padding: .65rem .8rem; border: 0; border-radius: 4px; background: var(--brand-red); color: #fff; cursor: pointer; font: inherit; font-weight: 700; text-align: center; text-decoration: none; }
.community-actions a:hover, .community-actions button:hover { background: #ad1010; }
.field-hint { display: block; margin: .35rem 0 .5rem; color: var(--text-muted); font-size: .78rem; font-weight: 400; line-height: 1.35; }
.privacy-data-controls { margin-top: 1.5rem; padding-top: 1.25rem; border-top: 1px solid var(--panel-border); }
.privacy-data-controls h3 { margin-bottom: .5rem; }
.privacy-data-controls p { max-width: 760px; margin-bottom: .85rem; line-height: 1.5; }
.danger-btn { border-color: #c94b4b; color: #ffd7d7; }
.danger-btn:hover { background: #8a0b0b; border-color: #d86060; color: #fff; }
.community-highlights { grid-column: 1 / -1; min-height: 120px; border: 1px solid var(--panel-border); border-radius: 6px; padding: 1rem; background: #080808; }
.community-highlights h3 { margin-bottom: .5rem; }
.directory-tile { min-height: 190px; padding: 1.25rem; background: rgba(255,255,255,.02); color: var(--text-main); text-align: left; border: 1px solid var(--panel-border); border-radius: 8px; cursor: pointer; font: inherit; }
.directory-tile h3 { margin: .65rem 0; font-size: 1.2rem; }
.directory-tile p { color: var(--text-muted); line-height: 1.45; }
.directory-tile strong { display: block; margin-top: 1rem; color: #d5a1a1; }
.directory-tile img { width: 52px; height: 52px; object-fit: cover; border-radius: 6px; }
.directory-tile--game { display: grid; align-content: start; gap: .1rem; }
.directory-tile--game .game-tile-thumbnail { display: block; width: 100%; height: auto; max-height: 175px; aspect-ratio: 16 / 7; object-fit: cover; border: 1px solid rgba(255,255,255,.18); border-radius: 6px; }
.game-tile-thumbnail-placeholder { display: grid; place-items: center; min-height: 112px; padding: .8rem; border: 1px dashed rgba(255,255,255,.26); border-radius: 6px; color: var(--text-muted); font-size: .82rem; text-align: center; }
.request-review { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--panel-border); }
.request-review h3 { margin-bottom: .35rem; }
.request-review > div:last-child { display: flex; flex-wrap: wrap; gap: .5rem; }
.request-search-panel, .review-queue, .selected-game-panel, .game-request-support-board { margin-top: 1rem; padding: 1rem; border: 1px solid var(--panel-border); border-radius: 6px; background: rgba(255,255,255,.015); }
.game-request-support-board > .text-muted { margin-top: .55rem; }
.launch-readiness-explainer { max-width: 860px; margin-top: .55rem; color: #d6c7a6; font-size: .82rem; line-height: 1.5; }
.game-request-support-controls { display: grid; grid-template-columns: minmax(220px, 1fr) minmax(180px, .35fr); gap: .8rem; margin-top: 1rem; }
.game-request-support-controls label { display: grid; gap: .35rem; color: var(--text-muted); font-size: .78rem; }
.game-request-support-controls input, .game-request-support-controls select { width: 100%; padding: .65rem .7rem; border: 1px solid var(--panel-border); border-radius: 4px; color: #fff; background: #0b0b0b; font: inherit; }
#game-request-support-summary { margin-top: .75rem; }
.game-request-pagination { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding-top: 1rem; border-top: 1px solid var(--panel-border); }
.game-request-pagination__navigation { display: flex; align-items: center; gap: .8rem; }
.game-request-pagination span { color: var(--text-muted); font-size: .82rem; font-weight: 700; }
.game-request-page-size { display: flex; align-items: center; gap: .5rem; color: var(--text-muted); font-size: .78rem; }
.game-request-page-size select { padding: .48rem .65rem; border: 1px solid var(--panel-border); border-radius: 4px; color: #fff; background: #0b0b0b; font: inherit; }
.game-request-support { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .9rem 0; border-top: 1px solid var(--panel-border); }
.game-request-support:first-child { margin-top: .8rem; }
.game-request-support__details { flex: 1 1 auto; min-width: 0; }
.game-request-support__title { padding: 0; border: 0; background: transparent; color: #f0c76a; cursor: pointer; font: inherit; font-size: 1.05rem; font-weight: 800; text-align: left; text-decoration: underline; }
.game-request-support__title:disabled { color: #fff; cursor: default; text-decoration: none; }
.game-request-support__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: .7rem; white-space: nowrap; }
.launch-readiness { max-width: 760px; margin-top: .7rem; padding: .65rem .75rem; border: 1px solid rgba(240,199,106,.22); border-radius: 5px; background: rgba(0,0,0,.36); }
.launch-readiness__heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: #f0c76a; font-size: .8rem; }
.launch-readiness__track { height: 8px; margin-top: .45rem; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 999px; background: #111; }
.launch-readiness__track > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7b0909, #d4382f, #f0c76a); transition: width .25s ease; }
.launch-readiness__status { margin-top: .45rem; color: #fff; font-size: .78rem; font-weight: 700; }
.launch-readiness__inputs { margin-top: .25rem; font-size: .72rem; line-height: 1.4; }
.game-request-support--ready { margin-inline: -.6rem; padding-inline: .6rem; border-left: 3px solid #6bd28d; background: linear-gradient(90deg, rgba(39,117,67,.18), transparent 70%); }
.game-request-support--ready .launch-readiness { border-color: rgba(107,210,141,.48); }
.game-request-support--ready .launch-readiness__status { color: #8ee7aa; }
.inline-form { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: .9rem; }
.inline-form input { flex: 1 1 260px; color: #fff; background: #151515; border: 1px solid var(--panel-border); border-radius: 4px; padding: .65rem; font: inherit; }
.store-search-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .6rem; margin-top: 1rem; }
.store-result { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: .5rem; align-items: center; color: #fff; text-align: left; background: #111; border: 1px solid var(--panel-border); border-radius: 5px; padding: .45rem; cursor: pointer; font: inherit; transition: border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.store-result:hover { border-color: #b88282; transform: translateY(-1px); }
.store-result--selected { border: 2px solid #f0c76a; background: linear-gradient(135deg, rgba(158,111,12,.34), rgba(17,17,17,.96)); box-shadow: 0 0 0 2px rgba(240,199,106,.17), 0 0 18px rgba(240,199,106,.18); }
.store-result--selected:focus-visible { outline-color: #f0c76a; }
.store-result img { width: 48px; height: 28px; object-fit: cover; }
.store-image-placeholder { display: grid; width: 48px; height: 28px; place-items: center; border: 1px solid var(--panel-border); color: var(--text-muted); font-size: .62rem; }
.store-result small { grid-column: 2; color: var(--text-muted); }
.store-result__selection { color: #f0c76a !important; font-weight: 700; }
.store-result--selected .store-result__selection { color: #fff0bd !important; }
.submission-status:empty { display: none; }
.submission-status { margin: .85rem 0; }
.error-message { color: #ffaaa4; }
.nav-btn:disabled { cursor: wait; opacity: .7; }
.success-message { color: #92d093; }
.form-grid { display: grid; gap: .8rem; }
.form-grid label { display: grid; gap: .35rem; color: var(--text-muted); font-size: .85rem; }
.form-grid input, .form-grid textarea, .form-grid select, .inline-form select { width: 100%; color: #fff; background: #151515; border: 1px solid var(--panel-border); border-radius: 4px; padding: .65rem; font: inherit; }
.form-grid input[type="color"] { min-height: 2.75rem; padding: .2rem; cursor: pointer; }
.form-grid input[type="range"] { padding: 0; accent-color: var(--brand-red); }
.form-grid output { color: #f0c76a; font-weight: 800; }
.retained-upload { display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: .75rem; align-items: center; padding: .65rem; border: 1px solid var(--panel-border); border-radius: 6px; background: rgba(255,255,255,.025); }
.retained-upload[hidden] { display: none; }
.retained-upload img { width: 76px; height: 62px; object-fit: cover; border: 1px solid var(--panel-border); border-radius: 4px; }
.retained-upload > div { display: grid; gap: .3rem; }
.retained-upload strong { color: #fff; }
.retained-upload span { color: var(--text-muted); font-size: .78rem; line-height: 1.35; }
.retained-upload .nav-btn { justify-self: start; margin-top: .15rem; }
.retained-upload--removing { border-color: #c65a5a; background: rgba(138,11,11,.12); }
.rich-toolbar { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .25rem; }
.rich-toolbar .nav-btn { padding: .3rem .55rem; font-size: .74rem; }
.modal-actions { display: flex; justify-content: flex-end; gap: .6rem; margin-top: 1rem; }
.modal-actions--start { justify-content: flex-start; }
.discord-connection-instructions, .discord-connection-overview, .discord-connection-summary, .discord-connection-confirmation { margin-top: 1rem; padding: .9rem; border: 1px solid var(--panel-border); border-radius: 6px; background: rgba(255,255,255,.025); }
.discord-connection-instructions ol { margin: .65rem 0 .85rem 1.25rem; color: var(--text-muted); line-height: 1.55; }
.discord-connection-overview > label { display: grid; gap: .35rem; margin-top: .75rem; color: var(--text-muted); font-size: .82rem; }
.discord-connection-overview input { width: 100%; padding: .65rem; border: 1px solid var(--panel-border); border-radius: 4px; color: #fff; background: #151515; font: inherit; }
.discord-connection-list { display: grid; gap: .4rem; max-height: 220px; margin-top: .65rem; overflow-y: auto; }
.discord-connection-list-item { display: flex; justify-content: space-between; align-items: center; gap: .75rem; width: 100%; padding: .65rem .75rem; border: 1px solid var(--panel-border); border-radius: 5px; color: #fff; background: #101010; text-align: left; cursor: pointer; }
.discord-connection-list-item:hover, .discord-connection-list-item:focus-visible { border-color: #c64b4b; background: rgba(138,11,11,.14); }
.discord-connection-list-item > span:first-child { display: grid; gap: .2rem; min-width: 0; }
.discord-connection-list-item small { overflow: hidden; color: var(--text-muted); text-overflow: ellipsis; }
.discord-connection-state { color: #f0c76a; font-size: .75rem; font-weight: 800; }
.discord-connection-summary > div:first-child { display: flex; justify-content: space-between; gap: .75rem; }
.discord-connection-summary dl { display: grid; grid-template-columns: minmax(150px, .7fr) minmax(0, 1fr); gap: .35rem .75rem; margin-top: .75rem; font-size: .8rem; }
.discord-connection-summary dt { color: var(--text-muted); }
.discord-connection-summary dd { overflow-wrap: anywhere; color: #fff; }
.discord-connection-confirmation { border-color: #c94b4b; background: rgba(138,11,11,.12); }
.directory-heading-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }
.leader-center-panel { border: 1px solid var(--panel-border); border-radius: 8px; padding: 1.2rem; background: rgba(255,255,255,.015); }
.leader-center-panel > h3 { margin-bottom: .5rem; }
.advertisement-manager-list { display: grid; gap: .55rem; margin-top: 1rem; }
.advertisement-manager-item { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem; border: 1px solid var(--panel-border); border-radius: 6px; background: rgba(255,255,255,.02); }
.advertisement-manager-item .text-muted { margin-top: .25rem; font-size: .82rem; }
.premium-offers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.25rem; }
.premium-offer, .premium-activation { border: 1px solid var(--panel-border); border-radius: 8px; padding: 1.2rem; background: rgba(255,255,255,.02); }
.premium-offer--owned { border-color: rgba(213,161,161,.75); box-shadow: inset 0 0 0 1px rgba(138,11,11,.22); }
.premium-offer h3, .premium-activation h3 { margin-bottom: .55rem; }
.premium-offer p { color: var(--text-muted); line-height: 1.5; margin-bottom: .65rem; }
.premium-offer .premium-price { color: #fff; font-size: 1.3rem; font-weight: 800; }
.premium-offer .premium-owned { color: #a9e1aa; font-weight: 700; }
.premium-offer .nav-btn { margin-top: .4rem; }
.premium-activation { margin-top: 1rem; }
.premium-activation .inline-form { align-items: center; }
.premium-activation select { flex: 1 1 240px; color: #fff; background: #151515; border: 1px solid var(--panel-border); border-radius: 4px; padding: .65rem; font: inherit; }
.community-badges { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }
.community-badge { display: inline-flex; align-items: center; border: 1px solid rgba(213,161,161,.7); border-radius: 999px; padding: .2rem .55rem; color: #f3d6d6; background: rgba(138,11,11,.25); font-size: .72rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.community-badge--spotlight { color: #ffec99; border-color: #c9a227; background: rgba(201,162,39,.16); }
.community-feature-slot { grid-column: 1 / -1; border: 1px solid rgba(213,161,161,.46); border-radius: 10px; padding: .8rem; background: linear-gradient(90deg, rgba(138,11,11,.19), rgba(255,255,255,.025)); }
.community-feature-slot--spotlight { border-color: rgba(201,162,39,.62); background: linear-gradient(90deg, rgba(201,162,39,.15), rgba(255,255,255,.025)); }
.community-feature-slot__label { color: #f3d6d6; font-size: .75rem; font-weight: 900; letter-spacing: .12em; margin: 0 0 .55rem .2rem; text-transform: uppercase; }
.community-feature-slot--spotlight .community-feature-slot__label { color: #ffec99; }
.community-feature-card { display: block; width: 100%; color: #fff; text-align: left; font: inherit; cursor: pointer; border: 1px solid var(--panel-border); border-radius: 7px; overflow: hidden; background: #080808; transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.community-feature-card:hover { border-color: #d5a1a1; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(0,0,0,.35); }
.community-feature-card--spotlight:hover { border-color: #c9a227; }
.community-feature-card__eyebrow { padding: .35rem .7rem; background: rgba(138,11,11,.46); color: #fff; font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.community-feature-card--spotlight .community-feature-card__eyebrow { background: rgba(201,162,39,.44); color: #fff6c5; }
.community-feature-card__content { display: grid; grid-template-columns: 94px minmax(0, 1fr); gap: .85rem; align-items: center; padding: .85rem; }
.community-feature-card__content img, .community-feature-card__logo { width: 94px; height: 64px; object-fit: cover; border: 1px solid var(--panel-border); border-radius: 4px; }
.community-feature-card__logo { display: grid; place-items: center; color: var(--text-muted); font-size: .75rem; }
.community-feature-card h2 { font-size: clamp(1.1rem, 2vw, 1.65rem); }
.community-feature-card p { color: var(--text-muted); margin-top: .25rem; }
.community-feature-card span { display: inline-block; color: #f3d6d6; font-size: .82rem; font-weight: 800; margin-top: .55rem; }
.community-feature-card--spotlight span { color: #ffec99; }
.player-spotlight-card { display: grid; align-content: start; gap: .55rem; width: 100%; min-height: 440px; color: #fff; text-align: left; font: inherit; cursor: default; border: 1px solid rgba(213,161,161,.55); border-radius: 6px; padding: .7rem; background: linear-gradient(180deg, rgba(138,11,11,.26), #080808 42%); }
.player-spotlight-card:hover { border-color: #d5a1a1; box-shadow: 0 0 18px rgba(138,11,11,.25); }
.player-spotlight-card__eyebrow { color: #f3d6d6; font-size: .72rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.player-spotlight-card__image { width: 100%; height: 132px; object-fit: cover; border: 1px solid var(--panel-border); border-radius: 4px; }
.player-spotlight-card__image--empty { display: grid; place-items: center; color: var(--text-muted); background: rgba(255,255,255,.03); }
.player-spotlight-card__gamertag, .player-spotlight-card__community, .player-spotlight-card__bio { color: var(--text-muted); font-size: .8rem; line-height: 1.4; }
.player-spotlight-card__community { color: #d5a1a1; font-weight: 700; }
.player-spotlight-card__comments { display: block; overflow: hidden; min-height: 78px; border: 1px solid var(--panel-border); border-radius: 4px; }
.player-spotlight-card__comments img { display: block; width: 100%; height: 78px; object-fit: cover; }
.player-spotlight-card__comments--empty { display: grid; place-items: center; color: #777; font-size: .72rem; }
.player-spotlight-card__action { color: #f3d6d6; font-size: .8rem; font-weight: 800; }
.player-ballot { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--panel-border); }
.player-ballot__header, .player-nominee__title, .player-nominee__footer { display: flex; justify-content: space-between; align-items: center; gap: .75rem; }
.player-ballot__header h3, .player-nominee h3 { margin-bottom: .2rem; }
.player-ballot__header > span { color: var(--text-muted); font-size: .8rem; }
.player-nominee-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: .75rem; }
.player-nominee { display: grid; gap: .6rem; border: 1px solid var(--panel-border); border-radius: 6px; padding: .75rem; background: rgba(255,255,255,.02); }
.player-nominee__title { justify-content: flex-start; }
.player-nominee__title img { width: 48px; height: 48px; object-fit: cover; border-radius: 4px; }
.player-nominee p { color: var(--text-muted); line-height: 1.45; white-space: pre-wrap; }
.player-nominee__comments { overflow: hidden; border: 1px solid var(--panel-border); border-radius: 4px; }
.player-nominee__comments img { display: block; width: 100%; height: 90px; object-fit: cover; }
.player-nominee__footer { margin-top: auto; color: var(--text-muted); font-size: .82rem; }
.application-panel { padding: 1rem; border: 1px solid var(--panel-border); border-radius: 6px; background: rgba(255,255,255,.015); }
.application-panel h3 { margin-bottom: .45rem; }
.application-panel > p { color: var(--text-muted); line-height: 1.5; margin-bottom: 1rem; }
.agreement-check { grid-template-columns: 1.25rem 1fr !important; align-items: start; }
.agreement-check input { width: auto !important; margin-top: .15rem; }
.agreement-check--warning { padding: .75rem; border: 1px solid #8f6518; border-radius: 5px; background: rgba(143,101,24,.14); color: #f2d99c; }
.promotion-community-picker { padding: .8rem; border: 1px solid var(--panel-border); border-radius: 5px; }
.promotion-community-picker legend { padding: 0 .35rem; color: #fff; font-weight: 800; }
.promotion-community-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .45rem .75rem; margin-top: .6rem; }
.promotion-community-option { display: grid !important; grid-template-columns: 1.15rem minmax(0, 1fr) !important; align-items: start; gap: .45rem; }
.promotion-community-option input { width: auto !important; margin-top: .15rem; }
.site-footer { max-width: 1680px; margin: 0 auto; padding: 0 1.25rem 1.25rem; color: var(--text-muted); font-size: .85rem; text-align: center; }
.site-footer a { color: #ddd; }
.footer-link { border: 0; padding: 0; color: #ddd; background: transparent; cursor: pointer; font: inherit; text-decoration: underline; }
.support-summary { display: grid; gap: 1rem; }
.support-introduction { color: #d4d8dc; line-height: 1.55; }
.support-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
.support-metric { display: grid; gap: .25rem; padding: .85rem; border: 1px solid var(--panel-border); border-radius: 6px; background: var(--interface-surface-raised); }
.support-metric span { color: var(--text-muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; }
.support-metric strong { color: #fff; font-size: 1.2rem; }
.support-goal { display: grid; gap: .5rem; }
.support-goal__copy { display: flex; justify-content: space-between; gap: 1rem; color: #e8e8e8; font-size: .82rem; }
.support-progress { width: 100%; height: .8rem; overflow: hidden; border: 1px solid var(--panel-border); border-radius: 999px; background: #050505; }
.support-progress > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #7c1111, #d3a849); }
.support-use-list, .support-management-list { display: grid; gap: .65rem; }
.support-use { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .75rem; padding: .8rem; border: 1px solid var(--panel-border); border-radius: 6px; background: rgba(255,255,255,.025); }
.support-use h3 { margin-bottom: .25rem; font-size: .95rem; }
.support-use p { color: var(--text-muted); font-size: .8rem; line-height: 1.45; }
.support-use time { color: #c9cdd1; font-size: .72rem; }
.support-use > strong { color: #f1d58a; white-space: nowrap; }
.support-notice { padding: .8rem; border-left: 3px solid #ad8b45; background: rgba(173,139,69,.08); color: #d8d1bd; font-size: .78rem; line-height: 1.5; }
.support-donate-button { min-width: 190px; border-color: #d8b86c; background: #7a591c; color: #fff8df; }
.support-donate-button:hover { border-color: #f0d892; background: #94702b; box-shadow: 0 0 14px rgba(216,184,108,.3); }
.support-management-list article { display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .75rem; border: 1px solid var(--panel-border); border-radius: 6px; background: var(--interface-surface-raised); }
.support-management-list p { margin-top: .2rem; color: var(--text-muted); font-size: .75rem; }
@media (max-width: 720px) {
    .support-dgg-nav { margin-left: 0; }
    .support-metrics { grid-template-columns: 1fr; }
    .support-use { grid-template-columns: 1fr; }
}

/* Owner-managed interface color: opaque by default so site artwork never
   makes the application's controls or uncustomized tiles disappear. */
.hub-nav-bar,
.content-panel,
.directory-tile,
.community-tile,
.community-logo,
.dgg-logo,
.community-title,
.community-panel,
.community-highlights,
.request-search-panel,
.review-queue,
.selected-game-panel,
.game-request-support-board,
.leader-center-panel,
.advertisement-manager-item,
.premium-offer,
.premium-activation,
.application-panel,
.player-nominee,
.community-feature-card,
.store-result {
    background: var(--interface-surface);
}

.nav-btn,
.nav-overflow-menu,
.ad-slot-placeholder,
.game-tile-thumbnail-placeholder,
.store-image-placeholder {
    background: var(--interface-control);
}

.player-spotlight-card,
.player-spotlight-card__image--empty {
    background: var(--interface-surface-raised);
}

.section-kicker { margin: 0 0 .2rem; color: #d5a1a1; font-size: .72rem; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.theatre-shell, .community-news-shell { padding: clamp(1rem, 2vw, 2rem); }
.theatre-container { display: grid; gap: 1rem; margin-top: 1.2rem; }
.theatre-main-stage { position: relative; min-height: min(62vh, 720px); aspect-ratio: 16 / 8; overflow: hidden; border: 1px solid rgba(213,161,161,.55); border-radius: 10px; background: #030303; box-shadow: 0 18px 50px rgba(0,0,0,.42); }
.theatre-main-stage iframe, .theatre-main-stage > img, .theatre-main-card, .theatre-news-feature > img, .theatre-streamer-feature > iframe, .theatre-streamer-feature > img { width: 100%; height: 100%; border: 0; object-fit: cover; }
.theatre-persistent-player-slot, .theatre-persistent-player { width: 100%; height: 100%; min-height: 300px; }
.theatre-persistent-player { display: grid; grid-template-rows: minmax(300px, 1fr) auto; overflow: hidden; background: #000; }
.theatre-twitch-player-host { width: 100%; min-width: 400px; min-height: 300px; background: #000; }
.theatre-twitch-player-host iframe { display: block; width: 100%; height: 100%; min-height: 300px; border: 0; }
.theatre-player-controls { display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .65rem .8rem; border-top: 1px solid var(--panel-border); background: #0b0b0b; }
.theatre-player-controls > div { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.theatre-player-controls > div:first-child { min-width: 0; display: grid; gap: .12rem; }
.theatre-player-controls strong { overflow: hidden; color: #fff; text-overflow: ellipsis; white-space: nowrap; }
.theatre-player-controls span { color: var(--text-muted); font-size: .74rem; line-height: 1.3; }
.theatre-persistent-player:not(.theatre-persistent-player--docked) [data-theatre-player-return] { display: none; }
.theatre-playback-note { margin: 0; padding: .7rem .85rem; border: 1px solid var(--panel-border); border-radius: 7px; color: var(--text-muted); background: rgba(0,0,0,.52); font-size: .8rem; line-height: 1.45; }
.theatre-playback-note strong { color: #fff; }
.theatre-player-dock[hidden] { display: none; }
.theatre-player-dock { position: fixed; right: 1rem; bottom: 1rem; z-index: 80; width: min(460px, calc(100vw - 2rem)); overflow: hidden; border: 1px solid rgba(213,161,161,.75); border-radius: 10px; background: #050505; box-shadow: 0 20px 65px rgba(0,0,0,.78), 0 0 28px rgba(138,11,11,.28); }
.theatre-player-dock__header { display: flex; justify-content: space-between; align-items: center; gap: .7rem; padding: .55rem .7rem; border-bottom: 1px solid var(--panel-border); background: #111; }
.theatre-player-dock__header strong { color: #fff; font-size: .8rem; }
.theatre-player-dock .theatre-persistent-player { height: auto; }
.theatre-player-dock .theatre-twitch-player-host { height: 300px; }
.theatre-player-dock .theatre-player-controls { align-items: stretch; flex-direction: column; }
.theatre-player-dock .theatre-player-controls > div:last-child { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.theatre-main-card { position: relative; display: block; padding: 0; overflow: hidden; color: #fff; background: #020202; text-align: left; cursor: pointer; }
.theatre-main-card__scrim { position: absolute; inset: auto 0 0; z-index: 2; width: 100%; display: grid; gap: .45rem; padding: clamp(1rem, 4vw, 3rem); border: 0; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.97) 32%); text-align: left; cursor: pointer; }
.theatre-main-card__scrim span, .theatre-live-indicator { color: #f0b3b3; font-size: .74rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.theatre-main-card__scrim h3 { max-width: 980px; font-size: clamp(1.45rem, 4vw, 3rem); }
.theatre-main-card__scrim p { max-width: 880px; color: #d7dbe0; line-height: 1.55; }
.theatre-main-card__scrim strong { color: #fff; }
.theatre-streamer-feature--interactive { display: grid; grid-template-rows: minmax(300px, 1fr) auto; cursor: default; }
.theatre-streamer-feature--interactive > iframe { min-height: 300px; pointer-events: auto; }
.theatre-streamer-feature__link { display: flex; justify-content: space-between; align-items: center; gap: .8rem; padding: .7rem 1rem; border: 0; border-top: 1px solid var(--panel-border); color: #fff; background: #0b0b0b; cursor: pointer; font: inherit; text-align: left; }
.theatre-streamer-feature__link span { color: #f0b3b3; font-size: .72rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.theatre-news-feature__brand { display: grid; place-items: center; height: 100%; color: rgba(255,255,255,.18); font-size: clamp(2rem, 8vw, 7rem); font-weight: 950; letter-spacing: .08em; background: radial-gradient(circle at 50% 30%, #4a1014, #050505 66%); }
.theatre-sponsor-banner { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .8rem; align-items: stretch; }
.theatre-sponsor-banner > div { min-height: 92px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--panel-border); border-radius: 7px; background: var(--interface-surface-raised); color: var(--text-muted); }
.theatre-sponsor-banner img { width: 100%; height: 100%; max-height: 150px; object-fit: cover; }
.theatre-sponsor-banner h2 { align-self: center; color: #fff; font-size: clamp(.95rem, 2.2vw, 1.55rem); text-align: center; white-space: nowrap; }
.theatre-online-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.theatre-streamer-card { display: grid; grid-template-columns: minmax(180px, .7fr) minmax(240px, 1.3fr); min-height: 250px; overflow: hidden; border: 1px solid var(--panel-border); border-radius: 8px; background: var(--interface-surface-raised); cursor: pointer; }
.theatre-streamer-card:hover, .theatre-streamer-card:focus-visible { border-color: #d5a1a1; box-shadow: 0 0 22px rgba(138,11,11,.28); outline: none; }
.theatre-streamer-card__copy { display: grid; align-content: center; gap: .5rem; padding: 1.2rem; }
.theatre-streamer-card__copy p { color: var(--text-muted); }
.theatre-streamer-card__open { color: #fff; font-size: .82rem; font-weight: 800; }
.theatre-streamer-preview { position: relative; min-height: 250px; overflow: hidden; background: #000; }
.theatre-streamer-preview img, .theatre-streamer-preview iframe { width: 100%; height: 100%; min-height: 250px; border: 0; object-fit: cover; }
.theatre-preview-button { position: absolute; inset: auto 1rem 1rem; padding: .55rem .8rem; border: 1px solid rgba(255,255,255,.55); border-radius: 5px; color: #fff; background: rgba(0,0,0,.78); cursor: pointer; }
.theatre-media-fallback, .theatre-empty, .theatre-event-fallback { min-height: inherit; display: grid; place-items: center; gap: .7rem; padding: 2rem; color: var(--text-muted); text-align: center; }
.theatre-empty { height: 100%; align-content: center; }
.theatre-empty img { width: 120px; height: 120px; border-radius: 12px; }
.theatre-offline-note { padding: 1rem; border: 1px dashed var(--panel-border); border-radius: 7px; color: var(--text-muted); text-align: center; background: rgba(0,0,0,.32); }
.theatre-event-fallback { position: relative; height: 100%; }
.theatre-event-fallback > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .35; }
.theatre-event-fallback > div { position: relative; z-index: 1; max-width: 720px; display: grid; gap: .75rem; justify-items: center; }
.theatre-event-fallback h3 { color: #fff; font-size: clamp(1.6rem, 4vw, 3.2rem); }
.theatre-management-list, .theatre-news-source-list { display: grid; gap: .6rem; margin: .8rem 0 1.2rem; }
.theatre-management-list > article { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .75rem; border: 1px solid var(--panel-border); border-radius: 6px; background: var(--interface-surface-raised); }
.theatre-news-source { display: grid; grid-template-columns: minmax(200px, 1fr) repeat(3, auto) auto; align-items: center; gap: .8rem; padding: .75rem; border: 1px solid var(--panel-border); border-radius: 6px; background: var(--interface-surface-raised); }
.theatre-news-source label { display: flex; align-items: center; gap: .35rem; font-size: .75rem; }
.theatre-manager-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .5rem; }

.community-news-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(240px, .75fr); gap: 1.25rem; margin-top: 1.25rem; align-items: start; }
.community-news-article { overflow: hidden; border: 1px solid var(--panel-border); border-radius: 9px; background: var(--interface-surface-raised); }
.community-news-hero { width: 100%; max-height: 480px; aspect-ratio: 16 / 8; object-fit: cover; }
.community-news-article > header { display: grid; gap: .55rem; padding: clamp(1.2rem, 3vw, 2.4rem); border-bottom: 1px solid var(--panel-border); }
.community-news-article > header span { color: #d5a1a1; font-size: .75rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.community-news-article > header h1 { max-width: 900px; font-size: clamp(1.8rem, 4vw, 3.6rem); line-height: 1.08; }
.community-news-article > header time { color: var(--text-muted); font-size: .8rem; }
.community-news-body { padding: clamp(1.2rem, 3vw, 2.4rem); font-size: 1rem; }
.community-news-body p { max-width: 820px; }
.community-news-footer { padding: 1rem clamp(1.2rem, 3vw, 2.4rem); border-top: 1px solid var(--panel-border); background: rgba(0,0,0,.26); font-size: .85rem; }
.community-news-sidebar { position: sticky; top: 1rem; display: grid; gap: .75rem; }
.community-news-sidebar > article, .community-news-sidebar > button { overflow: hidden; display: grid; gap: .6rem; padding: 0; border: 1px solid var(--panel-border); border-radius: 7px; color: #fff; background: var(--interface-surface-raised); text-align: left; font: inherit; }
.community-news-sidebar > button { cursor: pointer; }
.community-news-sidebar img { width: 100%; max-height: 170px; object-fit: cover; }
.community-news-sidebar article > div, .community-news-sidebar button > div { padding: .8rem; }
.community-news-empty { grid-column: 1 / -1; padding: 4rem 2rem; border: 1px dashed var(--panel-border); border-radius: 8px; color: var(--text-muted); text-align: center; }

@media (max-width: 1100px) { .theatre-online-grid { grid-template-columns: 1fr; } .theatre-news-source { grid-template-columns: 1fr 1fr; } }
@media (max-width: 980px) { .directory-layout { grid-template-columns: 1fr; } .directory-layout > .tiles-container { order: 1; } .side-rail { position: static; display: none; order: 2; } .side-rail:not(.is-empty) { display: grid; } #left-ad-slot:not(.is-empty), #right-ad-slot:not(.is-empty) { display: block; min-height: 300px; max-height: 520px; } #left-ad-slot .player-promotion-card, #left-ad-slot .player-promotion-card__image, #left-ad-slot .player-spotlight-card, #right-ad-slot .player-promotion-card, #right-ad-slot .player-promotion-card__image { height: 420px; min-height: 300px; max-height: 520px; } .side-ad-slot--advertisement:not(.is-empty) { display: block; } .community-tile { grid-template-columns: 1fr; } .community-top-ads, .community-highlights { grid-column: 1; } .community-side-ad { display: none; } .header-ad-slots { grid-template-columns: repeat(3, 1fr); } .community-news-layout { grid-template-columns: 1fr; } .community-news-sidebar { position: static; grid-template-columns: repeat(2, minmax(0, 1fr)); } .community-news-sidebar > h2 { grid-column: 1 / -1; } }
@media (max-width: 760px) { .tiles-container, .premium-offers, .player-nominee-grid, .game-request-support-controls { grid-template-columns: 1fr; } .app-header { grid-template-columns: 72px minmax(0, 1fr) 72px; gap: .5rem; } .header-dgg-mark { width: 72px; height: 72px; } .game-request-support, .advertisement-manager-item { align-items: flex-start; flex-direction: column; } .game-request-support__actions { justify-content: flex-start; white-space: normal; } }
@media (max-width: 520px) { .game-request-pagination { align-items: stretch; flex-direction: column; } .game-request-pagination__navigation { justify-content: space-between; } .game-request-page-size { justify-content: flex-end; } }
@media (max-width: 640px) { #app-wrapper { padding: .75rem; } .hub-nav-bar { align-items: flex-start; flex-direction: column; } .header-ad-slots { grid-template-columns: repeat(2, 1fr); } .header-ad-slots > :last-child { grid-column: 1 / -1; } .community-brand { grid-template-columns: 88px minmax(0, 1fr); } .dgg-logo { display: none; } .community-details { grid-template-columns: 1fr; } .content-panel, .modal-window { padding: 1rem; } .app-header { grid-template-columns: 1fr; } .header-dgg-mark { display: none; } .promotion-community-options { grid-template-columns: 1fr; } .theatre-main-stage { min-height: 360px; aspect-ratio: auto; } .theatre-twitch-player-host { min-width: 0; } .theatre-player-controls { align-items: stretch; flex-direction: column; } .theatre-player-controls > div:last-child { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); } .theatre-player-dock { right: .5rem; bottom: .5rem; width: calc(100vw - 1rem); } .theatre-sponsor-banner { grid-template-columns: 1fr; } .theatre-sponsor-banner h2 { grid-row: 1; white-space: normal; } .theatre-streamer-card { grid-template-columns: 1fr; } .theatre-streamer-preview { min-height: 210px; } .community-news-sidebar { grid-template-columns: 1fr; } }

@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }