:root {
            --sz-bg: #090d0b;
            --sz-bg-soft: #101512;
            --sz-panel: rgba(14, 22, 19, 0.88);
            --sz-panel-strong: rgba(14, 22, 19, 0.96);
            --sz-border: rgba(148, 163, 184, 0.12);
            --sz-border-strong: rgba(52, 211, 153, 0.34);
            --sz-text: #e5e7eb;
            --sz-muted: #8b9b92;
            --sz-faint: #5d6b64;
            --sz-accent: #34d399;
            --sz-accent-dark: #071a12;
            --sz-radius: 10px;
            --font-base: -apple-system, BlinkMacSystemFont, "PingFang SC", "Helvetica Neue", STHeiti, "Microsoft YaHei", Tahoma, sans-serif;
            --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
        }
        * { font-family: var(--font-base); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
        .font-mono { font-family: var(--font-mono); }
        html {
            background: var(--sz-bg);
            -webkit-text-size-adjust: 100%;
            text-size-adjust: 100%;
        }
        body {
            background:
                radial-gradient(circle at 18% -8%, rgba(16,185,129,0.08), transparent 34%),
                radial-gradient(circle at 88% 6%, rgba(234,179,8,0.035), transparent 28%),
                linear-gradient(180deg, #101512 0%, #090d0b 44%, #0d1110 100%);
        }
        body::before {
            content: "";
            position: fixed;
            inset: 0;
            pointer-events: none;
            z-index: 0;
            opacity: 0.075;
            background-image:
                linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
                radial-gradient(circle at 30% 20%, rgba(255,255,255,0.11) 0 1px, transparent 1.5px);
            background-size: 100% 3px, 9px 9px;
            mix-blend-mode: overlay;
        }
        ::selection {
            background: rgba(52,211,153,0.28);
            color: #d1fae5;
        }
        body > * { position: relative; z-index: 1; }
        .home-hero {
            min-height: 206px;
            padding: 2rem 1rem 1.4rem;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .hero-blur-bg {
            position: absolute;
            inset: -4px;
            background-image:
                url('/uploads/polaroids/polaroid_1783179807494_89.jpg'),
                url('/img/home-live-crowd.jpg?v=1');
            background-size: cover;
            background-position: center 46%;
            filter: blur(2px) brightness(0.44) saturate(0.82);
            opacity: 0.9;
            z-index: 0;
        }
        .hero-blur-bg::after {
            content: "";
            position: absolute;
            inset: 0;
            background:
                linear-gradient(180deg, rgba(7,11,9,0.08), rgba(7,11,9,0.84)),
                linear-gradient(90deg, rgba(7,11,9,0.67), rgba(7,11,9,0.08) 48%, rgba(7,11,9,0.5));
        }
        .home-hero-copy {
            width: min(100%, 680px);
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1.1rem;
            text-align: center;
        }
        .home-wordmark {
            font-family: "Arial Black", "Helvetica Neue", Arial, sans-serif;
            font-size: clamp(3.05rem, 11vw, 5.4rem);
            font-weight: 900;
            line-height: 0.94;
            letter-spacing: -0.035em;
            text-shadow:
                0 0 16px rgba(52,211,153,0.18),
                0 14px 26px rgba(0,0,0,0.6);
        }
        .home-tagline {
            color: rgba(226, 232, 240, 0.72);
            max-width: 38rem;
            letter-spacing: 0.08em;
        }
        #status-toggle { width: min(100%, 36rem); }
        .signal-toggle {
            min-height: 48px;
            height: 48px;
            border: 1px solid rgba(52,211,153,0.24);
            background: rgba(5, 12, 9, 0.62);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.035), 0 12px 22px rgba(0,0,0,0.24);
        }
        .signal-toggle[data-active-mode="fans"] {
            border-color: rgba(148,163,184,0.16);
        }
        .signal-toggle[data-active-mode="fans"] #toggle-slider {
            opacity: 0;
        }
        .signal-toggle[data-active-mode="past"] {
            border-color: rgba(148,163,184,0.22);
        }
        .signal-toggle-option {
            font-size: 16px;
            letter-spacing: normal;
            min-height: 44px;
            border: 0;
            background: transparent;
            color: #b7c4ba;
            transition: color .22s;
        }
        .signal-toggle-option:focus { outline: none; }
        .signal-toggle-option:focus-visible {
            outline: 1px solid rgba(52,211,153,0.46);
            outline-offset: 3px;
        }
        .signal-toggle-option.is-active { color: #020403; }
        .signal-toggle-option.is-muted-active { color: #f8fafc; }
        .home-tool {
            height: 44px;
            min-width: 0;
            border: 1px solid rgba(148,163,184,0.1);
            background: rgba(12,19,16,0.72);
            border-radius: 12px;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.02);
            overflow: hidden;
            transition: border-color .18s, background .18s, transform .18s;
        }
        .home-tool:hover {
            border-color: rgba(148,163,184,0.22);
            background: var(--sz-panel-strong);
        }
        .home-tool:focus-within {
            border-color: rgba(52,211,153,0.38);
            background: var(--sz-panel-strong);
        }
        .home-tool:active { transform: translateY(1px); }
        .home-tool.is-disabled {
            opacity: 0.36;
            pointer-events: none;
        }
        .home-tool--show-only {
            display: flex;
        }
        .home-tool-label {
            color: var(--sz-faint);
            font-size: 9px;
            letter-spacing: 0.12em;
            font-family: var(--font-mono);
            font-weight: 800;
        }
        .home-tool span,
        .home-tool select {
            min-width: 0;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        #search-input { font-size: 16px; }
        #search-input::placeholder { color: rgba(139,155,146,0.68); font-size: 14px; letter-spacing: 0; }
        .no-scrollbar::-webkit-scrollbar { display: none; }
        .home-toolbar {
            border: 0;
            background: transparent;
            border-radius: 0;
            padding: 0;
        }
        .home-toolbar-grid {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }
        .home-toolbar-primary {
            display: grid;
            grid-template-columns: minmax(0, 1fr);
            gap: 0.5rem;
        }
        .home-toolbar-secondary {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            gap: 0.5rem;
        }
        .home-tool-icon {
            width: 14px;
            flex: 0 0 14px;
            color: rgba(138,148,143,0.78);
            text-align: center;
        }
        .home-filter-select {
            font-family: var(--font-base);
            font-size: 14px !important;
            font-weight: 400;
            line-height: 1.25;
            letter-spacing: 0;
        }
        .home-toolbar.is-fan-mode {
            border-color: transparent;
            background: transparent;
            border-radius: 0;
            padding: 0;
        }
        .home-toolbar.is-fan-mode .home-toolbar-grid {
            display: block;
        }
        .home-toolbar.is-fan-mode .home-toolbar-primary {
            display: flex;
            justify-content: flex-end;
        }
        .home-toolbar.is-fan-mode .home-toolbar-secondary {
            display: none;
        }
        .home-toolbar.is-fan-mode .home-tool--search {
            display: none;
        }
        .home-toolbar.is-fan-mode .home-tool--show-only {
            display: none;
        }
        .home-toolbar.is-fan-mode .home-tool {
            height: 44px;
            border-color: rgba(148,163,184,0.1);
            background: rgba(6,12,10,0.58);
            border-radius: 12px;
            box-shadow: none;
        }
        .home-toolbar.is-fan-mode .home-tool--profile {
            width: 44px;
            min-width: 44px;
            max-width: 44px;
        }
        .home-section-title {
            color: var(--sz-text);
            letter-spacing: 0.14em;
            text-transform: uppercase;
            font-family: var(--font-mono);
            text-shadow: 0 8px 18px rgba(0,0,0,0.34);
        }
        .home-section-kicker {
            color: var(--sz-muted);
            letter-spacing: 0.12em;
        }
        .sound-discovery {
            min-width: 0;
            height: 80px;
            margin-top: 8px;
            margin-bottom: 8px;
        }
        .sound-discovery.is-hidden { display: none; }
        .sound-discovery.is-hidden + #concert-list-container { margin-top: 1rem; }
        .sound-filter {
            display: flex;
            align-items: stretch;
            gap: 8px;
            width: 100%;
            height: 80px;
            min-width: 0;
            overflow-x: auto;
            overflow-y: hidden;
            overscroll-behavior-x: contain;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
        }
        .sound-filter::-webkit-scrollbar { display: none; }
        .sound-filter-btn {
            position: relative;
            flex: 0 0 auto;
            width: 100px;
            height: 80px;
            min-height: 80px;
            padding: 0;
            overflow: hidden;
            isolation: isolate;
            border: 1px solid rgba(148,163,184,0.13);
            border-radius: 11px;
            background:
                linear-gradient(180deg, rgba(9,30,23,0.18), rgba(2,8,6,0.88)),
                repeating-linear-gradient(105deg, rgba(62,115,91,0.10) 0 1px, transparent 1px 12px),
                #09100d;
            color: rgba(226,232,240,0.88);
            font-family: var(--font-base);
            text-align: left;
            transition: border-color .18s, color .18s;
        }
        .sound-filter-btn::after {
            content: '';
            position: absolute;
            inset: 0;
            z-index: 1;
            pointer-events: none;
            background: linear-gradient(180deg, rgba(2,6,5,0.12) 0%, rgba(2,7,5,0.46) 52%, rgba(1,4,3,0.94) 100%);
        }
        .sound-filter-cover {
            position: absolute;
            inset: 0;
            z-index: 0;
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            opacity: .92;
        }
        .sound-filter-btn.is-cover-failed .sound-filter-cover { display: none; }
        .sound-filter-copy {
            position: absolute;
            inset: auto 8px 7px;
            z-index: 2;
            display: flex;
            flex-direction: column;
            min-width: 0;
            line-height: 1.15;
        }
        .sound-filter-name {
            overflow: hidden;
            color: rgba(241,245,249,0.94);
            font-size: 12px;
            font-weight: 700;
            white-space: nowrap;
            text-overflow: ellipsis;
            text-shadow: 0 1px 7px rgba(0,0,0,0.78);
        }
        .sound-filter-count {
            margin-top: 3px;
            color: rgba(192,204,198,0.70);
            font-family: var(--font-mono);
            font-size: 9px;
            font-weight: 600;
            letter-spacing: normal;
        }

        .sound-filter-btn.is-empty:not(.is-active) {
            opacity: 0.58;
        }
        .sound-filter-signal {
            position: absolute;
            top: 7px;
            right: 7px;
            z-index: 2;
            width: 6px;
            height: 6px;
            border-radius: 999px;
            background: #41d9aa;
            box-shadow: 0 0 0 2px rgba(4,13,10,0.60), 0 0 10px rgba(65,217,170,0.28);
            opacity: 0;
        }
        .sound-filter-btn:hover {
            border-color: rgba(148,163,184,0.30);
        }
        .sound-filter-btn:focus { outline: none; }
        .sound-filter-btn:focus-visible {
            outline: 1px solid rgba(52,211,153,0.46);
            outline-offset: 2px;
        }
        .sound-filter-btn.is-active {
            border-color: rgba(65,217,170,0.74);
            color: rgba(209,250,229,0.98);
        }
        .sound-filter-btn.is-active .sound-filter-signal { opacity: 1; }
        .sound-filter-btn.is-active .sound-filter-name { color: rgba(209,250,229,0.98); }
        .home-search-icon,
        .home-tool-chevron {
            color: rgba(138,148,143,0.78);
        }
        .home-search-input,
        .home-filter-select {
            color: rgba(201,209,205,0.92);
        }
        .home-tool--profile {
            color: rgba(201,209,205,0.82);
        }
        .home-tool--profile:hover {
            color: rgba(226,232,240,0.94);
        }
        .show-card {
            height: auto;
            min-height: 140px;
            position: relative;
            display: grid;
            grid-template-columns: minmax(0, 1fr) 108px;
            background: rgba(12, 20, 17, 0.88);
            border: 1px solid rgba(148,163,184,0.11);
            border-radius: 10px;
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.02);
            overflow: hidden;
            transition: none;
        }
        .show-card::before {
            display: none;
        }
        .show-card-content {
            min-width: 0;
            min-height: 0;
            overflow: hidden;
        }
        .show-card-title {
            overflow-wrap: anywhere;
            transition: none !important;
        }
        .show-card-poster {
            min-width: 0;
            min-height: 0;
            height: 100%;
        }
        .show-card-poster img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
            object-position: center;
            filter: saturate(0.88) contrast(0.96) brightness(0.92);
        }
        .show-card-poster.is-missing img {
            filter: none;
            transform: none !important;
        }
        .show-card-poster::before {
            content: "";
            position: absolute;
            inset-y: 0;
            left: 0;
            width: 0.65rem;
            background: linear-gradient(90deg, rgba(10,15,13,0.72), transparent);
            z-index: 2;
            pointer-events: none;
        }
        .show-time-pill {
            display: inline-flex;
            align-items: center;
            gap: 0.35rem;
            border-radius: 10px;
            border: 1px solid rgba(148,163,184,0.12);
            background: rgba(8,13,11,0.48);
            color: rgba(203,213,225,0.72);
            padding: 0.18rem 0.45rem;
            font-size: 10px;
            line-height: 1;
            font-family: var(--font-mono);
            white-space: nowrap;
        }
        .show-time-pill.is-weekend {
            border-color: rgba(52,211,153,0.18);
            background: rgba(16,185,129,0.045);
            color: rgba(209,250,229,0.78);
        }
        .show-time-pill.is-weekend i {
            color: rgba(52,211,153,0.58);
        }
        .show-chip {
            border: 1px solid rgba(52,211,153,0.22);
            background: rgba(16,185,129,0.08);
            color: #6ee7b7;
            border-radius: 999px;
            padding: 0.1rem 0.42rem;
            font-size: 10px;
            font-family: var(--font-mono);
            font-weight: 800;
            white-space: nowrap;
        }
        .show-chip.is-past {
            border-color: rgba(148,163,184,0.18);
            background: rgba(51,65,85,0.28);
            color: rgba(203,213,225,0.76);
        }
        .fan-card {
            min-height: 0;
            display: flex;
            flex-direction: column;
            gap: 0.72rem;
            padding: 0.88rem 0.9rem 0.82rem;
            border: 1px solid rgba(52,211,153,0.12);
            border-radius: 10px;
            background:
                radial-gradient(circle at 8% 4%, rgba(52,211,153,0.09), transparent 32%),
                linear-gradient(120deg, rgba(15,23,20,0.98), rgba(7,12,10,0.94));
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.025);
            overflow: hidden;
            transition: border-color .2s, background .2s, transform .2s;
        }
        .fan-card:hover {
            border-color: rgba(52,211,153,0.34);
            background:
                radial-gradient(circle at 8% 4%, rgba(52,211,153,0.12), transparent 34%),
                linear-gradient(120deg, rgba(18,30,25,0.98), rgba(8,14,12,0.96));
            transform: translateY(-1px);
        }
        .fan-avatar,
        .fan-avatar-fallback {
            width: 44px;
            height: 44px;
            border-radius: 12px;
            border: 1px solid rgba(52,211,153,0.22);
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.04);
        }
        .fan-avatar {
            background: rgba(4,9,8,0.9);
            object-fit: cover;
        }
        .fan-avatar-fallback {
            background:
                linear-gradient(135deg, rgba(52,211,153,0.18), rgba(15,23,20,0.95)),
                #07100d;
            color: rgba(167,243,208,0.88);
            display: inline-flex;
            align-items: center;
            justify-content: center;
            font-family: var(--font-mono);
            font-weight: 900;
            font-size: 18px;
        }
        .fan-stat {
            display: inline-flex;
            align-items: baseline;
            gap: 0.25rem;
            color: rgba(203,213,225,0.72);
            font-family: var(--font-mono);
            font-size: 10px;
            white-space: nowrap;
        }
        .fan-stat strong {
            color: rgba(209,250,229,0.94);
            font-size: 13px;
        }
        .fan-moment-strip {
            display: grid;
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 0.42rem;
            min-height: 56px;
        }
        .fan-moment-thumb,
        .fan-moment-empty {
            aspect-ratio: 4 / 3;
            min-height: 0;
            border-radius: 7px;
            border: 1px solid rgba(148,163,184,0.1);
            background: rgba(4,9,8,0.64);
            overflow: hidden;
        }
        .fan-moment-thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            filter: saturate(0.82) contrast(0.96) brightness(0.86);
        }
        .fan-moment-empty {
            display: flex;
            align-items: center;
            justify-content: center;
            color: rgba(93,107,100,0.82);
            font-family: var(--font-mono);
            font-size: 9px;
            line-height: 1.2;
            text-align: center;
            padding: 0.45rem;
        }
        .fan-moment-note {
            grid-column: 1 / -1;
            min-height: 42px;
            display: flex;
            align-items: center;
            border-top: 1px solid rgba(148,163,184,0.08);
            color: rgba(100,116,109,0.78);
            font-family: var(--font-mono);
            font-size: 10px;
            letter-spacing: 0.04em;
        }
        #concert-list-container.is-fan-archive {
            gap: 0.85rem;
        }
        @media (min-width: 1024px) {
            #concert-list-container.is-fan-archive {
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        }
        .signal-dj {
            position: fixed;
            right: max(14px, env(safe-area-inset-right));
            top: clamp(164px, 23vh, 220px);
            bottom: auto;
            z-index: 30;
            width: 68px;
            height: 74px;
            overflow: visible;
            user-select: none;
        }
        .signal-dj[hidden] {
            display: none !important;
        }
        .signal-dj-panel {
            position: absolute;
            right: 0;
            bottom: 76px;
            width: min(322px, calc(100vw - 28px));
            border: 1px solid rgba(148,163,184,0.12);
            border-radius: 12px;
            background: linear-gradient(180deg, rgba(12,19,16,0.98), rgba(6,10,9,0.98));
            box-shadow: inset 0 1px 0 rgba(255,255,255,0.03), 0 8px 14px rgba(0,0,0,0.32);
            overflow: hidden;
        }
        .signal-dj.is-panel-below .signal-dj-panel {
            top: 72px;
            bottom: auto;
        }
        .signal-dj.is-panel-left .signal-dj-panel {
            left: 0;
            right: auto;
        }
        .signal-dj-panel[hidden] { display: none; }
        .signal-dj-head {
            display: flex;
            align-items: flex-start;
            justify-content: space-between;
            gap: 0.75rem;
            padding: 0.9rem 0.9rem 0.7rem;
            border-bottom: 1px solid rgba(148,163,184,0.1);
        }
        .signal-dj-kicker {
            color: rgba(52,211,153,0.68);
            font-family: var(--font-mono);
            font-size: 9px;
            font-weight: 800;
            letter-spacing: 0.18em;
        }
        .signal-dj-title {
            margin-top: 0.22rem;
            color: rgba(241,245,249,0.94);
            font-size: 14px;
            font-weight: 900;
            line-height: 1.25;
        }
        .signal-dj-close {
            width: 2rem;
            height: 2rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 1px solid rgba(148,163,184,0.12);
            border-radius: 10px;
            color: rgba(203,213,225,0.62);
            background: rgba(2,6,5,0.46);
        }
        .signal-dj-close { touch-action: manipulation; }
        .signal-dj-body {
            padding: 0.85rem 0.9rem 0.95rem;
        }
        .signal-dj-status {
            min-height: 18px;
            color: rgba(139,155,146,0.88);
            font-family: var(--font-mono);
            font-size: 10px;
            letter-spacing: 0.06em;
            line-height: 1.5;
        }
        .signal-dj-now {
            margin-top: 0.65rem;
            padding: 0.75rem;
            border: 1px solid rgba(148,163,184,0.1);
            border-radius: 12px;
            background: rgba(4,9,8,0.5);
        }
        .signal-dj-track {
            color: rgba(241,245,249,0.96);
            font-size: 13px;
            font-weight: 900;
            line-height: 1.4;
        }
        .signal-dj-show,
        .signal-dj-meta {
            margin-top: 0.32rem;
            color: rgba(203,213,225,0.62);
            font-size: 11px;
            line-height: 1.35;
        }
        .signal-dj-meta {
            color: rgba(139,155,146,0.82);
            font-family: var(--font-mono);
        }
        .signal-dj-audio {
            width: 100%;
            height: 34px;
            margin-top: 0.75rem;
            filter: saturate(0.75);
        }
        .signal-dj-actions {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0.55rem;
            margin-top: 0.75rem;
        }
        .signal-dj-btn,
        .signal-dj-link {
            height: 2.25rem;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            gap: 0.35rem;
            border-radius: 10px;
            border: 1px solid rgba(148,163,184,0.14);
            background: rgba(8,13,11,0.76);
            color: rgba(226,232,240,0.82);
            font-family: var(--font-mono);
            font-size: 11px;
            font-weight: 800;
            touch-action: manipulation;
            transition: none;
        }
        @media (hover: hover) and (pointer: fine) {
        .signal-dj-btn, .signal-dj-link { transition: border-color .18s, background .18s, color .18s, transform .18s; }
        .signal-dj-btn:hover,
        .signal-dj-link:hover {
            border-color: rgba(52,211,153,0.26);
            background: rgba(16,185,129,0.08);
            color: rgba(209,250,229,0.92);
        }
        .signal-dj-btn:active,
        .signal-dj-link:active, .signal-dj-close:active { transform: translateY(1px); }
        }
        .signal-dj-btn:disabled { opacity: 0.58; cursor: wait; }
        .signal-dj-link.is-disabled {
            pointer-events: none;
            opacity: 0.42;
        }
        .signal-dj-trigger {
            width: 68px;
            height: 74px;
            position: relative;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border: 0;
            padding: 0;
            background: transparent;
            box-shadow: none;
            overflow: visible;
            cursor: grab;
            touch-action: none;
            filter: drop-shadow(0 10px 9px rgba(0,0,0,0.42));
            transition: filter .18s, transform .18s;
        }
        .signal-dj-trigger::after {
            content: "";
            position: absolute;
            left: 18px;
            right: 12px;
            bottom: 3px;
            height: 8px;
            border-radius: 999px;
            background: rgba(0,0,0,0.38);
            filter: blur(3px);
            z-index: -1;
        }
        .signal-dj.is-open .signal-dj-trigger {
            filter: drop-shadow(0 12px 10px rgba(0,0,0,0.46)) drop-shadow(0 0 8px rgba(52,211,153,0.16));
        }
        @media (hover: hover) and (pointer: fine) {
            .signal-dj-trigger:hover { filter: drop-shadow(0 12px 10px rgba(0,0,0,0.46)) drop-shadow(0 0 8px rgba(52,211,153,0.16)); }
            .signal-dj-trigger:active { transform: translateY(1px); }
        }
        .signal-dj.is-dragging .signal-dj-trigger {
            cursor: grabbing;
            transform: scale(1.03);
        }
        .signal-bot {
            position: relative;
            width: 56px;
            height: 62px;
            image-rendering: pixelated;
        }
        .signal-bot::before {
            content: "";
            position: absolute;
            right: 2px;
            bottom: 12px;
            width: 16px;
            height: 18px;
            border-right: 4px solid #020403;
            border-bottom: 4px solid #020403;
            border-radius: 0 0 12px 0;
            transform: rotate(-7deg);
            z-index: 1;
        }
        .signal-bot-body {
            position: absolute;
            left: 5px;
            top: 8px;
            width: 46px;
            height: 45px;
            border-radius: 0;
            background: #020403;
            clip-path: polygon(
                0 34%, 9% 24%, 12% 8%, 18% 0,
                33% 18%, 67% 18%,
                82% 0, 88% 8%, 91% 24%, 100% 34%,
                100% 78%, 90% 100%, 10% 100%, 0 78%
            );
            z-index: 2;
        }
        .signal-bot-body::before {
            content: "";
            position: absolute;
            left: 5px;
            top: 6px;
            width: 36px;
            height: 35px;
            clip-path: polygon(
                0 34%, 10% 26%, 13% 13%, 18% 7%,
                33% 22%, 67% 22%,
                82% 7%, 87% 13%, 90% 26%, 100% 34%,
                100% 78%, 90% 100%, 10% 100%, 0 78%
            );
            background:
                linear-gradient(145deg, rgba(255,255,255,0.055), transparent 34%),
                radial-gradient(circle at 48% 82%, rgba(17,63,48,0.16), transparent 30%),
                linear-gradient(180deg, #171c1a, #070908);
        }
        .signal-bot-body::after {
            content: "";
            position: absolute;
            right: 9px;
            bottom: 10px;
            width: 3px;
            height: 3px;
            background: rgba(52,211,153,0.34);
            box-shadow: 4px 1px 0 rgba(52,211,153,0.22);
        }
        .signal-bot-eye {
            position: absolute;
            top: 28px;
            width: 4px;
            height: 11px;
            border-radius: 1px;
            background: rgba(52,211,153,0.96);
            box-shadow: 0 0 0 1px rgba(5,8,7,0.66);
            transform: translateX(-50%);
            animation: signal-eye 4.2s steps(1, end) infinite;
            z-index: 3;
        }
        .signal-bot-eye.left { left: 22px; }
        .signal-bot-eye.right { left: 34px; }
        .signal-bot-pack {
            display: none;
        }
        .signal-bot-pack::after {
            content: none;
        }
        .signal-bot-leg {
            display: none;
        }
        .signal-bot-leg.left { left: 18px; }
        .signal-bot-leg.right { left: 31px; }
        .signal-dj.is-loading .signal-bot-pack::after {
            animation: signal-wave 0.75s steps(3, end) infinite;
        }
        .signal-dj.is-playing .signal-bot {
            animation: signal-nod 1.15s steps(2, end) infinite;
        }
        .signal-dj.motion-hop .signal-dj-trigger {
            animation: mascot-hop 0.62s cubic-bezier(0.25, 1, 0.5, 1);
        }
        .signal-dj.motion-step-left .signal-dj-trigger {
            animation: mascot-step-left 0.86s steps(4, end);
        }
        .signal-dj.motion-step-right .signal-dj-trigger {
            animation: mascot-step-right 0.86s steps(4, end);
        }
        .signal-dj.motion-stretch .signal-bot {
            animation: mascot-stretch 0.7s cubic-bezier(0.25, 1, 0.5, 1);
        }
        .signal-dj.motion-tail .signal-bot::before {
            animation: mascot-tail-flick 0.54s steps(3, end);
        }
        .signal-dj.motion-look .signal-bot-eye {
            animation:
                signal-eye 4.2s steps(1, end) infinite,
                mascot-look 0.76s steps(2, end);
        }
        @keyframes signal-eye {
            0%, 78%, 100% { width: 4px; height: 11px; top: 28px; border-radius: 1px; }
            84%, 90% { width: 9px; height: 2px; top: 33px; border-radius: 999px; }
            94%, 96% { width: 4px; height: 1px; top: 33px; border-radius: 999px; }
        }
        @keyframes signal-wave {
            0% { opacity: 0.42; }
            50% { opacity: 1; }
            100% { opacity: 0.58; }
        }
        @keyframes signal-nod {
            0%, 100% { transform: translateY(0); }
            50% { transform: translateY(1px); }
        }
        @keyframes mascot-hop {
            0%, 100% { transform: translateY(0); }
            34% { transform: translateY(-9px); }
            64% { transform: translateY(2px); }
        }
        @keyframes mascot-step-left {
            0%, 100% { transform: translateX(0); }
            25% { transform: translateX(-4px) rotate(-2deg); }
            50% { transform: translateX(-10px) rotate(0deg); }
            75% { transform: translateX(-5px) rotate(1deg); }
        }
        @keyframes mascot-step-right {
            0%, 100% { transform: translateX(0); }
            25% { transform: translateX(4px) rotate(2deg); }
            50% { transform: translateX(10px) rotate(0deg); }
            75% { transform: translateX(5px) rotate(-1deg); }
        }
        @keyframes mascot-stretch {
            0%, 100% { transform: scaleX(1) scaleY(1) translateY(0); }
            38% { transform: scaleX(1.08) scaleY(0.88) translateY(4px); }
            68% { transform: scaleX(0.96) scaleY(1.04) translateY(-1px); }
        }
        @keyframes mascot-tail-flick {
            0%, 100% { transform: rotate(-7deg); }
            34% { transform: rotate(12deg); }
            68% { transform: rotate(-14deg); }
        }
        @keyframes mascot-look {
            0%, 100% { transform: translateX(-50%); }
            35%, 65% { transform: translateX(calc(-50% + 2px)); }
        }
        .signal-bot.sz-mascot-sprite {
            width: 64px;
            height: 64px;
            display: block;
            background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAsAAAABACAYAAAAUAMEeAAAEfUlEQVR4nO3dL48dVRjA4bcEQZqKBoEgpIIgEBUEzQfgExAkEkuCRWFJsJVIwifgA6AJAoFoEBtSgSCIpsEtojnpdrq3M3PvzPkz7/O4m2bvzG/nttnzztlpBAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOvcaX0CAACwh8+vvr+++frHB1/diYh4o83pAABAG2+2PgEAANhTmfwWJsAAAKSyeg/w+x99eB0R8edvf3S1f7jWeenXX+M4a+nXH6G/t/OCFj754cuX9rz+8sWj1H8v7AEGAIA4Yw/wf0+fRUQ/K+5yHuW89qZf/83j6tdf5cAn6K/bn10v133KHZDbz2vrye9o/cV0729hAgwAQCpnPwXin7/+jogXP3kXtVZg0/O4e//enod9hX79t52Pfv17Hld/2/5RJ2BbyX4HYLT+shd4q0nwaP1zTIABAEhl8U/v5SftsuI+5e333omI7VcGju/4ju/4ju/4LY5fvPvBg+uIiLfu3d31OEtNJ2BPHl/tej6l/9m/TyPixfe7aH0HQL/+Ne9nAgwAQCqL9wAv3WMx3Rt26Ypg6cq/2GsvkH79S+jXH6H/aP1T2fZAn7oO09d77Q2d+xyUiWTt4+sfu98EGACAVM5+CsScSycBa1f+vdGvP0K/fv0R4/cfdQK2VPY7APqP2W8CDABAKrtNgItTe6WWft2lau/RmtKv/7bzWPp1l9Kv/+Zr/ef1H3UCtpej3QFYS/8Y/SbAAACksvsEuGi1kikr4r33SM3Rr78F/foj9NfuH2UCtrej3AE4l/6++02AAQBIZXYCPNpK9NRKv/wPJmv3SOnXH6Ffv/4RbN1/qd4nYLVkuwMwpb/PfhNgAABSmZ0Ar10xf/rrNy+9/vnjb9ed0UbvM115n/s/5vTyW7Vr1erv5XpPuf599Lf6fPTS30qr/l7+Pdiqfyu9TsDmZL8DoP/Y/SbAAACkUu0pEK1MV/5PHl812QPViv59+3uZeJ3i+rftb/35aN3f2qX9R5+AzXEHRP+IlvabAAMAkMrhJ8C1PPzus9f++e9f/1T1fQC4jD3Q6/TSX7gDoj/idL8JMAAAqRx+Alxr5bPVZHbrCW/WlV+hX3+Efv05+7NPAGvJfgd41H4TYAAAUjnsBDj7ild/nf6tntaw1fsUrn8f/a0+H730t5K9n+dqfw6mE8q5iebe76P/9f0mwAAApDK7KijPDyzPFxzFVisf/foj9OvXP5JW/b09BeHS74Prrz/iuP0mwAAApHLYPcAAkJE90DDPBBgAgFQWrw5H2Quy18pXv/4I/fr192zr/lG6p+wB1R+h3x5gAAC4wR5gAOAVZYI2yiRw6zsA+o/dbwIMAEAqiyfAva8E9v6tV/36I/Tr1x+Rp7/37ilPf4DlTIABAEjl4lViq5VxLytd/foj9OvXX1PtfhPg53r9PtT6POg/Vr8JMAAAqdgnBAALHG0CdqksdwBO0T92vwkwAACpmAADwBlGn4BBZibAAAAAAAAAAAAAAAAAAAAAAAAAQGX/AxxPrYebe+OFAAAAAElFTkSuQmCC') no-repeat;
            background-position: calc(var(--sz-mascot-frame, 0) * -64px) 0;
            background-size: 704px 64px;
            image-rendering: pixelated;
            animation: none !important;
            transform: none !important;
        }
        .signal-bot.sz-mascot-sprite::before,
        .signal-bot.sz-mascot-sprite::after {
            display: none !important;
            content: none !important;
        }
        @media (min-width: 768px) {
            .home-toolbar-grid {
                grid-template-columns: minmax(220px, 1.7fr) minmax(130px, 0.58fr) minmax(180px, 1fr) minmax(160px, 0.9fr);
            }
            .show-card {
                height: 174px;
                grid-template-columns: minmax(0, 1fr) 116px;
            }
        }
        .home-state {
            border: 1px solid rgba(148,163,184,0.1);
            border-radius: 14px;
            background: rgba(8,13,11,0.5);
        }
        .home-skeleton-card {
            min-height: 148px;
            border: 1px solid rgba(148,163,184,0.09);
            border-radius: 12px;
            background: rgba(14,22,19,0.62);
            overflow: hidden;
        }
        .skeleton-line {
            height: 10px;
            border-radius: 999px;
            background: linear-gradient(90deg, rgba(148,163,184,0.08), rgba(52,211,153,0.12), rgba(148,163,184,0.08));
            background-size: 200% 100%;
            animation: signal-scan 1.2s ease-in-out infinite;
        }
        @keyframes signal-scan {
            0% { background-position: 100% 0; }
            100% { background-position: -100% 0; }
        }
        .show-card-venue { margin-top: 8px; font-size: 12px; line-height: 1.4; color: #b3c7bb; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
        @media (prefers-reduced-motion: reduce) {
            *, *::before, *::after {
                animation-duration: 0.01ms !important;
                animation-iteration-count: 1 !important;
                scroll-behavior: auto !important;
                transition-duration: 0.01ms !important;
            }
        }
        @media (max-width: 768px) {
            .home-hero {
                min-height: 210px;
                padding: 1.25rem 0.65rem 0.95rem;
            }
            .home-hero-copy {
                gap: 0.85rem;
            }
            .home-wordmark { font-size: clamp(2.25rem, 10.6vw, 4.05rem); }
            .home-tagline { font-size: 11px; }
            .home-tool--profile { padding: 0; }
            #home-profile-text { display: none; }
            .fan-card {
                gap: 0.62rem;
                padding: 0.78rem;
            }
            .fan-avatar,
            .fan-avatar-fallback {
                width: 42px;
                height: 42px;
                border-radius: 11px;
            }
            .fan-moment-strip {
                min-height: 52px;
                gap: 0.34rem;
            }
            .signal-dj {
                right: max(10px, env(safe-area-inset-right));
                top: 174px;
                bottom: auto;
                width: 64px;
                height: 70px;
            }
            .signal-dj-trigger {
                width: 64px;
                height: 70px;
            }
            input,
            select,
            textarea {
                font-size: 16px !important;
            }
        }
        /* Touch browsers can leave :hover stuck after a tap, so keep card decoration steady there. */
        .group:hover .show-card-title { color: rgb(241 245 249); }
        /* Only devices with a real hover pointer animate card decoration on entry. */
        @media (hover: hover) and (pointer: fine) {
            .show-card { transition: border-color .2s, background .2s, transform .2s; }
            .show-card:hover {
                border-color: rgba(52,211,153,0.28);
                background: rgba(15, 25, 21, 0.96);
                transform: translateY(-1px);
            }
            .show-card-title { transition: color .15s ease !important; }
            .group:hover .show-card-title { color: rgb(134 239 172); }
            .show-card-poster-image { transition: transform 180ms ease-out; }
            .show-card-poster-shade { transition: background-color 180ms ease-out; }
            .group:hover .show-card-poster-image { transform: scale(1.05); }
            .group:hover .show-card-poster-shade { background-color: transparent; }
        }
        @media (prefers-reduced-motion: reduce) {
            .show-card, .show-card-title, .show-card-poster-image, .show-card-poster-shade { transition: none !important; }
            .show-card:hover, .group:hover .show-card-poster-image { transform: none; }
        }
        @media (min-width: 769px) {
            .home-toolbar-primary {
                grid-template-columns: minmax(0, 1fr) minmax(8rem, 10rem) 44px;
            }
            .home-toolbar.is-fan-mode .home-tool--profile {
                width: auto;
                min-width: 8rem;
                max-width: 10rem;
            }
        }
    
/* Phase269: content channel navigation. */
body .home-hero{min-height:188px;height:auto;padding:40px 16px;}body .home-hero-copy{gap:24px;}body .home-hero + main{padding-top:16px;}
body #status-toggle,body .directory-mode-tabs{display:flex;justify-content:flex-start;align-items:center;gap:32px;width:max-content;max-width:100%;height:44px;min-height:44px;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:visible;}
body #status-toggle .signal-toggle-option,body .directory-mode-tabs .directory-mode-tab{display:flex;flex:0 0 auto;align-items:flex-start;justify-content:flex-start;position:relative;min-width:44px;min-height:44px;height:44px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;text-shadow:none;color:#a4b1a8;font-family:var(--font-base);font-size:18px;font-weight:500;line-height:24px;letter-spacing:0;white-space:nowrap;cursor:pointer;transition:color 120ms;}
body #status-toggle .signal-toggle-option[aria-selected="true"],body .directory-mode-tabs .directory-mode-tab[aria-pressed="true"]{color:#edf1ec;font-weight:600;background:transparent;border:0;box-shadow:none;}
body #status-toggle .signal-toggle-option::before,body .directory-mode-tabs .directory-mode-tab::before{content:none;display:none;}
body #status-toggle .signal-toggle-option::after,body .directory-mode-tabs .directory-mode-tab::after{content:'';display:block;position:absolute;left:0;right:auto;top:32px;bottom:auto;width:28px;height:2px;background:#87cba6;border:0;border-radius:0;box-shadow:none;opacity:0;}
body #status-toggle .signal-toggle-option[aria-selected="true"]::after,body .directory-mode-tabs .directory-mode-tab[aria-pressed="true"]::after{opacity:1;background:#87cba6;box-shadow:none;}
body #status-toggle .signal-toggle-option:focus-visible,body .directory-mode-tabs .directory-mode-tab:focus-visible{outline:2px solid #87cba6;outline-offset:4px;}
@media(hover:hover) and (pointer:fine){body #status-toggle .signal-toggle-option:hover,body .directory-mode-tabs .directory-mode-tab:hover{color:#edf1ec;background:transparent;}}
.content-channel-row{display:flex;flex-direction:column;gap:12px;margin-bottom:12px;}body .content-channel-row .home-tool--search{width:100%;}body .home-search-input{font-size:16px;}body #home-toolbar{margin-bottom:0;}body .home-toolbar-grid{gap:0;}
body .bands-main{padding-top:24px;}body .bands-intro{grid-template-columns:minmax(0,1fr);gap:16px;padding-bottom:24px;border-bottom:1px solid rgba(148,163,184,.12);}body .bands-lead{margin:8px 0 0;font-size:13px;line-height:22px;}body .channel-accessible-target{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);margin:0;}body .bands-search input{font-size:16px;}body .directory-meta{padding:0 0 12px;margin-top:24px;}
@media(min-width:720px){body .home-hero{min-height:240px;padding:48px 16px;}body .home-hero-copy{gap:28px;} .content-channel-row{flex-direction:row;justify-content:space-between;align-items:flex-start;gap:32px;margin-bottom:16px;border-bottom:1px solid rgba(148,163,184,.12);padding-bottom:16px;}body .content-channel-row .home-tool--search{width:340px;flex:0 0 340px;}body .bands-intro{grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start;}body .bands-search{width:340px;}}

body #toggle-slider{display:none!important;}body .home-tagline{margin-top:24px;}@media(min-width:720px){body .home-tagline{margin-top:28px;}}

html,body{margin:0;width:100%;height:100%;overflow:hidden}#szrock-content{display:block;border:0;position:fixed;inset:0;width:100%;height:100dvh;background:#020617}#szrock-cat-host{position:relative;z-index:200}