Spaces:
Running
Running
| :root { | |
| --bg: #0c0c0c; | |
| --paper: #121212; | |
| --ink: #d4d0c8; | |
| --ink-bright: #e8e4dc; | |
| --dim: #666; | |
| --line: #2a2a2a; | |
| --electric: #4da6ff; | |
| --lime: #b8d24a; | |
| --red: #cc4444; | |
| --green-scan: #00cc66; | |
| } | |
| * { margin: 0; padding: 0; box-sizing: border-box; } | |
| body { | |
| background: var(--bg); | |
| color: var(--ink); | |
| font-family: 'Courier New', monospace; | |
| line-height: 1.7; | |
| } | |
| .station-wrap { | |
| max-width: 700px; | |
| margin: 0 auto; | |
| padding: 80px 40px 120px; | |
| position: relative; | |
| } | |
| .station-wrap::before { | |
| content: ''; | |
| position: fixed; | |
| top: 0; left: 0; right: 0; bottom: 0; | |
| background: repeating-linear-gradient(0deg, transparent 0, transparent 2px, rgba(0,204,102,0.015) 2px, rgba(0,204,102,0.015) 4px); | |
| pointer-events: none; | |
| z-index: 1; | |
| } | |
| .station-back { | |
| font-size: 11px; | |
| letter-spacing: 0.15em; | |
| text-transform: uppercase; | |
| color: var(--dim); | |
| text-decoration: none; | |
| position: relative; | |
| z-index: 2; | |
| } | |
| .station-back:hover { color: var(--electric); } | |
| .station-header { | |
| border-top: 1px solid var(--line); | |
| border-bottom: 1px solid var(--line); | |
| padding: 24px 0; | |
| margin: 48px 0; | |
| display: flex; | |
| justify-content: space-between; | |
| align-items: baseline; | |
| position: relative; | |
| z-index: 2; | |
| } | |
| .station-status { | |
| font-size: 10px; | |
| color: var(--green-scan); | |
| letter-spacing: 0.1em; | |
| } | |
| .station-status::before { content: '● '; } | |
| .station-title { | |
| font-size: 36px; | |
| font-weight: 400; | |
| letter-spacing: 0.08em; | |
| color: var(--ink-bright); | |
| text-transform: uppercase; | |
| } | |
| .station-sub { | |
| font-size: 14px; | |
| color: var(--dim); | |
| margin-top: 8px; | |
| font-style: italic; | |
| } | |
| .station-body { | |
| position: relative; | |
| z-index: 2; | |
| } | |
| .station-body p { | |
| margin-bottom: 20px; | |
| font-size: 14px; | |
| color: var(--ink); | |
| } | |
| .station-body p:first-letter { | |
| font-size: 28px; | |
| color: var(--electric); | |
| font-weight: bold; | |
| } | |
| .station-log { | |
| border: 1px solid var(--line); | |
| padding: 24px; | |
| margin: 32px 0; | |
| font-size: 12px; | |
| color: var(--dim); | |
| position: relative; | |
| z-index: 2; | |
| } | |
| .station-log h4 { | |
| font-size: 10px; | |
| letter-spacing: 0.15em; | |
| text-transform: uppercase; | |
| color: var(--lime); | |
| margin-bottom: 12px; | |
| } | |
| .station-log table { width: 100%; border-collapse: collapse; } | |
| .station-log td { padding: 4px 8px 4px 0; border-bottom: 1px dotted var(--line); } | |
| .station-log tr:last-child td { border-bottom: none; } | |
| .station-log .freq { color: var(--electric); } | |
| .station-footer { | |
| margin-top: 80px; | |
| padding-top: 24px; | |
| border-top: 1px solid var(--line); | |
| font-size: 10px; | |
| color: var(--dim); | |
| letter-spacing: 0.1em; | |
| display: flex; | |
| justify-content: space-between; | |
| position: relative; | |
| z-index: 2; | |
| } |