:root { --primary: #2C3E50; --danger: #E74C3C; --warning: #F39C12; --bg: #F4F6F7; }
* { box-sizing: border-box; font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif; }
body { margin: 0; background: var(--bg); display: flex; flex-direction: column; min-height: 100vh; line-height: 1.5; }
.global-header { display: flex; align-items: center; padding: 1rem; background: #fff; border-bottom: 1px solid #ddd; }
.brand-text h1 { margin: 0; line-height: 1.3; padding-top: 2px; }
main { flex: 1; padding: 1rem; max-width: 800px; margin: 0 auto; width: 100%; }

/* Mobile-first sticky header */
.sticky-header { position: sticky; top: 0; background: #fff; padding: 10px; z-index: 100; box-shadow: 0 2px 5px rgba(0,0,0,0.1); display: flex; justify-content: space-between; }
#countdown-timer.urgent { color: var(--warning); font-weight: bold; }
#countdown-timer.critical { color: var(--danger); animation: pulse 1s infinite; }
@keyframes pulse { 0% { opacity: 1; } 50% { opacity: 0.5; } 100% { opacity: 1; } }

/* Tap-friendly cards */
.question-card { background: #fff; padding: 15px; margin-bottom: 15px; border-radius: 8px; }
.radio-card { display: block; padding: 12px; background: #eee; margin: 5px 0; border-radius: 4px; cursor: pointer; }
.radio-card:hover { background: #ddd; }

/* Support Widget */
.support-widget { position: fixed; bottom: 20px; right: 20px; z-index: 999; }
#support-panel { background: #fff; border: 1px solid #ccc; width: 300px; height: 400px; display: flex; flex-direction: column; box-shadow: 0 4px 10px rgba(0,0,0,0.2); }
#support-messages { flex: 1; overflow-y: auto; padding: 10px; }
.hidden { display: none !important; }

@media (max-width: 360px) {
    .global-header h1 { font-size: 1.2rem; }
    #support-panel { width: 90vw; right: 5vw; }
}