.subathon-main { width: min(100% - 32px, 1120px); margin: 38px auto 80px; }
.subathon-panel { display: grid; grid-template-columns: 1.4fr 1fr; border: 1px solid #292929; background: #0e0e0e; }
.subathon-clock { display: flex; flex-direction: column; justify-content: center; min-height: 400px; padding: clamp(28px,5vw,70px); border-right: 1px solid #292929; background: radial-gradient(circle at 85% 80%, #5b111b 0, transparent 48%), #080808; }
.subathon-clock span, .subathon-clock small, .subathon-controls label, .subathon-controls p { color: #999; font: 500 11px "IBM Plex Mono",monospace; letter-spacing: .06em; text-transform: uppercase; }
.subathon-clock strong { margin: 18px 0; color: #fff; font: 600 clamp(50px,7vw,106px)/1 "IBM Plex Mono",monospace; letter-spacing: -.075em; white-space: nowrap; }
.subathon-clock small { color: #ff4d5b; }
.subathon-controls { display: flex; flex-direction: column; justify-content: center; gap: 22px; padding: clamp(24px,4vw,48px); }
.subathon-controls button { min-height: 50px; border: 1px solid #c0202a; background: #c0202a; color: #fff; cursor: pointer; font: 600 12px "IBM Plex Mono",monospace; text-transform: uppercase; }
.subathon-controls button:hover, .subathon-controls button:focus-visible { background: #e02a37; }
.subathon-controls button:disabled { opacity: .5; cursor: wait; }
.subathon-controls form { display: grid; gap: 12px; }
.subathon-controls form div { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
.subathon-controls input { width: 100%; min-width: 0; padding: 0 12px; border: 1px solid #444; background: #050505; color: #fff; font: 16px "IBM Plex Mono",monospace; }
.subathon-controls form button:last-child { border-color: #444; background: #202020; }
.subathon-controls p { margin: 0; line-height: 1.6; }
.subathon-controls p strong { color: #fff; }
.subathon-controls a { color: #ff4d5b; font: 500 12px "IBM Plex Mono",monospace; text-transform: uppercase; }
.subathon-controls #toggle { border-color: #444; background: #202020; }
.subathon-leaders { display: grid; grid-template-columns: 1fr 1fr; border: 1px solid #292929; border-top: 0; background: #0e0e0e; }
.subathon-leaders > div { display: grid; gap: 8px; min-width: 0; padding: 28px 36px; }
.subathon-leaders > div + div { border-left: 1px solid #292929; }
.subathon-leaders span, .subathon-leaders small { color: #999; font: 500 11px "IBM Plex Mono",monospace; letter-spacing: .05em; text-transform: uppercase; }
.subathon-leaders strong { overflow: hidden; color: #fff; font-size: clamp(28px,4vw,46px); font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 780px) { .subathon-panel { grid-template-columns: 1fr; } .subathon-clock { min-height: 260px; border-right: 0; border-bottom: 1px solid #292929; } }
@media (max-width: 600px) { .subathon-leaders { grid-template-columns: 1fr; } .subathon-leaders > div + div { border-left: 0; border-top: 1px solid #292929; } }
