/* * MARATHON / GDQ theme — applied when * Inspired by Games Done Quick: deep navy, cyan + magenta duotone, * pixel typography, sharp-cornered panels, offset glows. */ /* ── variables ──────────────────────────────────────────────────── */ body.theme-marathon { --ink: #060a10; --panel: #0d1117; --panel-2: #161b22; --line: #1e3a5a; --text: #e6edf3; --muted: #7d9bb5; --rock: #f72585; --metal: #ff7700; --indie: #39d353; --electronic: #00d4e8; --pop: #bf5af2; --other: #556677; --mrt-cyan: #00d4e8; --mrt-magenta: #f72585; --mrt-green: #39d353; } /* ── hide/show marathon-only decorations ────────────────────────── */ #marathonDecorations { display: none; } body.theme-marathon #marathonDecorations { display: block; } /* ── subtle scanline ─────────────────────────────────────────────── */ body.theme-marathon::before { content: ""; position: fixed; inset: 0; z-index: 9999; pointer-events: none; background: repeating-linear-gradient( to bottom, transparent 0px, transparent 3px, rgba(0,0,0,.08) 3px, rgba(0,0,0,.08) 4px ); } /* ── scrolling bottom ticker ─────────────────────────────────────── */ .mrt-ticker { position: fixed; bottom: 0; left: 0; right: 0; height: 26px; z-index: 1100; background: var(--mrt-magenta); display: flex; align-items: center; overflow: hidden; white-space: nowrap; pointer-events: none; } .mrt-ticker-label, .mrt-ticker-sep { font-family: "Press Start 2P", monospace; font-size: 7px; color: #fff; letter-spacing: .14em; padding: 0 18px; animation: mrt-scroll 18s linear infinite; flex-shrink: 0; } .mrt-ticker-sep { color: rgba(255,255,255,.45); padding: 0 2px; animation: mrt-scroll 18s linear infinite; } @keyframes mrt-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } } /* ── pixel corner brackets on map ───────────────────────────────── */ .mrt-corner { position: fixed; z-index: 1050; pointer-events: none; width: 28px; height: 28px; } .mrt-tl { top: 68px; left: 358px; border-top: 2px solid var(--mrt-cyan); border-left: 2px solid var(--mrt-cyan); } .mrt-tr { top: 68px; right: 8px; border-top: 2px solid var(--mrt-cyan); border-right: 2px solid var(--mrt-cyan); } .mrt-bl { bottom: 34px; left: 358px; border-bottom: 2px solid var(--mrt-cyan); border-left: 2px solid var(--mrt-cyan); } .mrt-br { bottom: 34px; right: 8px; border-bottom: 2px solid var(--mrt-cyan); border-right: 2px solid var(--mrt-cyan); } /* ── header ──────────────────────────────────────────────────────── */ body.theme-marathon header { background: linear-gradient(to bottom, rgba(6,10,16,.98), rgba(6,10,16,.92)); border-bottom: 2px solid var(--mrt-cyan); box-shadow: 0 0 18px rgba(0,212,232,.2), 0 0 50px rgba(0,212,232,.06); } /* ── logo ────────────────────────────────────────────────────────── */ body.theme-marathon .logo { font-family: "Press Start 2P", monospace; font-size: 16px; letter-spacing: .06em; color: var(--mrt-cyan); text-shadow: 0 0 8px rgba(0,212,232,.8), 2px 2px 0 rgba(0,212,232,.25); } body.theme-marathon .logo span { color: var(--mrt-magenta); text-shadow: 0 0 8px rgba(247,37,133,.8), 2px 2px 0 rgba(247,37,133,.25); } body.theme-marathon .tagline { font-family: "Press Start 2P", monospace; font-size: 6px; letter-spacing: .1em; color: var(--muted); } body.theme-marathon .src-badge { font-family: "Press Start 2P", monospace; font-size: 8px; border-radius: 2px; border-color: var(--line); background: rgba(0,212,232,.05); box-shadow: 2px 2px 0 rgba(0,212,232,.15); } body.theme-marathon .src-badge b { color: var(--mrt-cyan); } /* ── sidebar ─────────────────────────────────────────────────────── */ body.theme-marathon aside { border-right: 2px solid var(--mrt-cyan); box-shadow: 4px 0 24px rgba(0,212,232,.12), 8px 0 8px rgba(0,212,232,.04); background: linear-gradient(to right, rgba(6,10,16,.98), rgba(6,10,16,.95)); /* Make room for the bottom ticker */ padding-bottom: 26px; } body.theme-marathon .panel-section { border-bottom: 1px solid var(--line); } body.theme-marathon .panel-section h2 { font-family: "Press Start 2P", monospace; font-size: 7px; color: var(--mrt-cyan); letter-spacing: .2em; text-shadow: 0 0 10px rgba(0,212,232,.5); } /* ── inputs ──────────────────────────────────────────────────────── */ body.theme-marathon input[type=text], body.theme-marathon input[type=month], body.theme-marathon select { font-family: "Share Tech Mono", monospace; border-color: var(--line); border-radius: 2px; background: rgba(13,17,23,.9); box-shadow: inset 0 1px 3px rgba(0,0,0,.4); } body.theme-marathon input::placeholder { color: var(--muted); opacity: .6; } body.theme-marathon input:focus, body.theme-marathon select:focus { outline-color: var(--mrt-cyan); box-shadow: 0 0 0 2px rgba(0,212,232,.18), 2px 2px 0 rgba(0,212,232,.15); } /* ── button ──────────────────────────────────────────────────────── */ body.theme-marathon .btn { font-family: "Press Start 2P", monospace; font-size: 8px; letter-spacing: .1em; border-radius: 2px; background: var(--mrt-cyan); color: #06080f; border: none; box-shadow: 3px 3px 0 rgba(0,212,232,.4); transition: all .1s; text-transform: uppercase; } body.theme-marathon .btn:hover { transform: translate(-1px, -1px); box-shadow: 4px 4px 0 rgba(0,212,232,.5); filter: brightness(1.08); } body.theme-marathon .btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 rgba(0,212,232,.3); } body.theme-marathon .btn:disabled { background: var(--line); color: var(--muted); box-shadow: none; transform: none; } /* ── genre chips ─────────────────────────────────────────────────── */ body.theme-marathon .chip { font-family: "Press Start 2P", monospace; font-size: 7px; border-radius: 2px; letter-spacing: .06em; } body.theme-marathon .chip.on { box-shadow: 2px 2px 0 var(--c, transparent); text-shadow: 0 0 8px var(--c, transparent); } /* ── show cards ──────────────────────────────────────────────────── */ body.theme-marathon .card { border-radius: 2px; } body.theme-marathon .card::before { border-radius: 0; width: 2px; box-shadow: 3px 0 8px var(--c, transparent); } body.theme-marathon .card .band { font-family: "Press Start 2P", monospace; font-size: 9px; letter-spacing: .04em; line-height: 1.6; } body.theme-marathon .card .meta { font-family: "Share Tech Mono", monospace; font-size: 11px; color: var(--muted); } body.theme-marathon .card .date { font-family: "Share Tech Mono", monospace; font-size: 10px; color: var(--mrt-cyan); text-shadow: 0 0 6px rgba(0,212,232,.4); } body.theme-marathon .card:hover, body.theme-marathon .card.active { background: rgba(0,212,232,.05); border-color: var(--line); box-shadow: 0 0 12px rgba(0,212,232,.08); } /* ── status bar ──────────────────────────────────────────────────── */ body.theme-marathon .status { font-family: "Share Tech Mono", monospace; font-size: 11px; letter-spacing: .04em; border-bottom-color: var(--line); } body.theme-marathon .status strong { color: var(--mrt-cyan); text-shadow: 0 0 6px rgba(0,212,232,.4); } body.theme-marathon .spinner { border-color: var(--line); border-top-color: var(--mrt-cyan); } /* ── markers ─────────────────────────────────────────────────────── */ body.theme-marathon .gig-dot .core { box-shadow: 0 0 10px 2px var(--c), 0 0 3px 1px rgba(255,255,255,.3); } body.theme-marathon .gig-dot .halo { border-width: 1.5px; } /* ── clusters ────────────────────────────────────────────────────── */ body.theme-marathon .cluster { background: rgba(0,212,232,.12); border: 2px solid var(--mrt-cyan); border-radius: 2px; color: var(--mrt-cyan); font-family: "Press Start 2P", monospace; font-size: 9px; box-shadow: 3px 3px 0 rgba(0,212,232,.3), 0 0 14px rgba(0,212,232,.2); } /* ── popups ──────────────────────────────────────────────────────── */ body.theme-marathon .leaflet-popup-content-wrapper { border-color: var(--mrt-cyan); background: var(--panel); border-radius: 2px; box-shadow: 4px 4px 0 rgba(0,212,232,.25), 0 0 24px rgba(0,212,232,.15); } body.theme-marathon .leaflet-popup-tip { background: var(--panel); border-color: var(--mrt-cyan); } body.theme-marathon .pop .genre { font-family: "Press Start 2P", monospace; font-size: 7px; letter-spacing: .14em; } body.theme-marathon .pop .band { font-family: "Press Start 2P", monospace; font-size: 11px; line-height: 1.7; } body.theme-marathon .pop .venue { font-family: "Share Tech Mono", monospace; font-size: 12px; } body.theme-marathon .pop .tix { border-radius: 2px; font-family: "Press Start 2P", monospace; font-size: 8px; box-shadow: 3px 3px 0 rgba(0,0,0,.4); } /* ── sidebar toggle ──────────────────────────────────────────────── */ body.theme-marathon .side-toggle { border-radius: 2px; border-color: var(--mrt-cyan); color: var(--mrt-cyan); box-shadow: 2px 2px 0 rgba(0,212,232,.25); font-family: "Press Start 2P", monospace; font-size: 10px; } /* ── theme button ────────────────────────────────────────────────── */ body.theme-marathon .theme-btn { font-family: "Press Start 2P", monospace; font-size: 7px; border-radius: 2px; border-color: var(--mrt-magenta); color: var(--mrt-magenta); background: rgba(247,37,133,.06); box-shadow: 2px 2px 0 rgba(247,37,133,.3); text-shadow: 0 0 8px rgba(247,37,133,.45); } body.theme-marathon .theme-btn:hover { background: rgba(247,37,133,.12); box-shadow: 3px 3px 0 rgba(247,37,133,.4); } /* ── Leaflet controls ────────────────────────────────────────────── */ body.theme-marathon .leaflet-control-zoom a { border-color: var(--line) !important; border-radius: 2px !important; font-family: "Press Start 2P", monospace !important; } body.theme-marathon .leaflet-control-attribution { font-family: "Share Tech Mono", monospace; font-size: 9px; /* make room for the ticker */ margin-bottom: 28px !important; }