.tk-status-board { display: flex; justify-content: space-between; gap: 16px; align-items: stretch; padding: 18px 20px; border-radius: var(--r-lg); background: linear-gradient(135deg, rgba(255,255,255,0.04), rgba(255,69,69,0.05)); border: 1px solid var(--border); margin-bottom: 16px; flex-wrap: wrap; }
.tk-status-copy { flex: 1 1 320px; }
.tk-round-eyebrow { display: inline-block; margin-bottom: 8px; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--yellow); font-weight: 800; }
.tk-status-copy h3 { margin: 0 0 8px; font-size: 1.12rem; }
.tk-countdown { min-width: 220px; display: grid; align-content: center; gap: 6px; padding: 14px 16px; border-radius: 16px; background: rgba(0,0,0,0.18); border: 1px solid rgba(255,255,255,0.06); }
.tk-countdown-label { font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); }
.tk-countdown strong, .tk-countdown-text { font-size: 1.02rem; color: #fff; }
.tk-chart-shell { margin-bottom: 16px; padding: 18px 20px; border-radius: var(--r-lg); background: linear-gradient(180deg, rgba(19,14,33,0.95), rgba(13,10,24,0.98)); border: 1px solid rgba(255,255,255,0.08); box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 22px 40px rgba(0,0,0,0.22); }
.tk-chart-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.tk-chart-header h3 { margin: 4px 0 0; font-size: 1.15rem; }
.tk-chart-stats { display: flex; gap: 10px; flex-wrap: wrap; }
.tk-chart-stat { min-width: 120px; padding: 10px 12px; border-radius: 12px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); }
.tk-chart-stat span { display: block; font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); margin-bottom: 5px; }
.tk-chart-stat strong { font-size: 0.95rem; color: #fff5d6; }
.tk-chart-board { padding: 14px; border-radius: 16px; background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)); border: 1px solid rgba(255,255,255,0.05); }
.tk-chart { --tk-chart-line: 0% 78%, 100% 30%; --tk-chart-progress: 0%; --tk-chart-volatility: 0.1; position: relative; height: 220px; border-radius: 14px; overflow: hidden; background: linear-gradient(180deg, rgba(6,10,18,0.55), rgba(8,9,16,0.92)), linear-gradient(90deg, rgba(255,255,255,0.04) 1px, transparent 1px), linear-gradient(180deg, rgba(255,255,255,0.04) 1px, transparent 1px); background-size: auto, 12.5% 100%, 100% 25%; }
.tk-chart::before { content: ''; position: absolute; inset: auto 0 0 0; height: 100%; background: linear-gradient(180deg, rgba(0,214,143,0.16), rgba(255,193,7,0.10) 58%, rgba(255,69,69,0.20)); clip-path: polygon(0 100%, var(--tk-chart-line), 100% 100%); opacity: 0.88; }
.tk-chart::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.08) calc(var(--tk-chart-progress) - 8%), rgba(255,255,255,0.16) var(--tk-chart-progress), rgba(255,255,255,0) calc(var(--tk-chart-progress) + 8%)); mix-blend-mode: screen; opacity: calc(0.35 + var(--tk-chart-volatility) * 0.6); }
.tk-chart-footer { display: flex; justify-content: space-between; gap: 10px; margin-top: 10px; font-size: 0.78rem; color: var(--muted); flex-wrap: wrap; }
.tk-danger-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; gap: 12px; }
.tk-danger-fill.is-rising { background: linear-gradient(90deg, #22c55e, #facc15, #fb923c); box-shadow: 0 0 16px rgba(250,204,21,0.18); }
.tk-danger-fill.is-hot { background: linear-gradient(90deg, #facc15, #fb923c, #ef4444); box-shadow: 0 0 22px rgba(251,146,60,0.28); }
.tk-danger-fill.is-critical { background: linear-gradient(90deg, #fb923c, #ef4444, #dc2626); box-shadow: 0 0 28px rgba(239,68,68,0.32); animation: tkDangerPulse 0.9s ease-in-out infinite alternate; }
.tk-live-event { margin-bottom: 16px; padding: 12px 14px; border-radius: 14px; background: rgba(255,255,255,0.03); border: 1px solid rgba(255,255,255,0.06); color: #f5f7fb; font-weight: 600; }
@keyframes tkDangerPulse { from { transform: scaleY(1); filter: brightness(1); } to { transform: scaleY(1.03); filter: brightness(1.15); } }
@media (max-width: 720px) { .tk-chart { height: 180px; } .tk-chart-stat { flex: 1 1 120px; } .tk-chart-footer { flex-direction: column; } }
