design: красивые пустые состояния таймеров/Spotify, акцентный прогноз

- таймеры: светящаяся градиентная иконка + голосовая подсказка вместо серого текста
- Spotify: зелёный музыкальный орб + подсказка
- прогноз: ячейка «сейчас» — яркий градиентный акцент с тенью

app/page.tsx

@@ -603,11 +603,15 @@ function HomeTab({ weather, sensors }: { weather: WeatherData | null; sensors: S
                 <button
                   onClick={() => setSelectedDay(day)}
                   style={{
-                    flex: 1, padding: '12px 8px', borderRadius: 14,
+                    flex: 1, padding: '12px 8px', borderRadius: 16,
-                    minHeight: 92,
+                    minHeight: 96,
-                    background: isToday ? 'var(--surface-2)' : 'transparent',
+                    background: isToday
+                      ? 'linear-gradient(160deg, rgba(109,94,252,0.32), rgba(46,230,246,0.12))'
+                      : 'transparent',
+                    border: isToday ? '1px solid rgba(160,168,255,0.32)' : '1px solid transparent',
+                    boxShadow: isToday ? '0 6px 18px -8px rgba(109,94,252,0.5)' : 'none',
                     display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 6,
-                    transition: 'background 0.2s ease',
+                    transition: 'background 0.2s ease, transform 0.2s ease',
                   }}
                 >
                   <div style={{

components/SpotifyWidget.tsx

@@ -89,7 +89,22 @@ export default function SpotifyWidget() {
       {loading ? (
         <div style={{ fontSize: 13, color: 'var(--text-tertiary)', textAlign: 'center', padding: '8px 0' }}>Загрузка...</div>
       ) : !state?.track ? (
-        <div style={{ fontSize: 13, color: 'var(--text-tertiary)', textAlign: 'center', padding: '8px 0' }}>Ничего не играет</div>
+        <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', gap: 12, padding: '18px 0' }}>
+          <div style={{ position: 'relative', width: 78, height: 78, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
+            <div style={{
+              position: 'absolute', inset: 0, borderRadius: '50%',
+              background: 'radial-gradient(circle, rgba(30,215,96,0.38), transparent 70%)', filter: 'blur(7px)',
+            }} />
+            <div style={{
+              position: 'absolute', inset: 12, borderRadius: '50%',
+              background: 'linear-gradient(135deg, rgba(30,215,96,0.24), rgba(30,215,96,0.08))',
+              border: '1px solid rgba(30,215,96,0.32)',
+            }} />
+            <Music size={32} color="#1ED760" style={{ position: 'relative' }} />
+          </div>
+          <div style={{ fontSize: 15, fontWeight: 700, color: 'var(--text-primary)' }}>Ничего не играет</div>
+          <div style={{ fontSize: 12, color: 'var(--text-secondary)', textAlign: 'center' }}>Скажи «Эй, космо, включи что-нибудь»</div>
+        </div>
       ) : (
         <div style={{ display: 'flex', flexDirection: 'column', gap: 2 }}>
           <div style={{

components/TimerHomeWidget.tsx

@@ -143,15 +143,30 @@ export default function TimerHomeWidget() {
             style={{
               flex: 1, display: 'flex', flexDirection: 'column',
               alignItems: 'center', justifyContent: 'center',
-              padding: '28px 0 20px', gap: 10,
+              padding: '24px 0', gap: 16,
-              color: 'var(--text-tertiary)',
+              color: 'var(--text-secondary)',
               background: 'transparent', border: 'none', cursor: 'pointer',
             }}
           >
-            <AlarmClock size={30} style={{ opacity: 0.4 }} />
+            <div style={{ position: 'relative', width: 92, height: 92, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
-            <div style={{ fontSize: 13 }}>Нет активных таймеров</div>
+              <div style={{
-            <div style={{ fontSize: 11, opacity: 0.7, textAlign: 'center', lineHeight: 1.5 }}>
+                position: 'absolute', inset: 0, borderRadius: '50%',
-              Скажи «поставь таймер на 5 минут»<br />или нажми +
+                background: 'radial-gradient(circle, rgba(139,120,252,0.4), transparent 70%)', filter: 'blur(8px)',
+              }} />
+              <div style={{
+                position: 'absolute', inset: 14, borderRadius: '50%',
+                background: 'linear-gradient(135deg, rgba(109,94,252,0.28), rgba(46,230,246,0.16))',
+                border: '1px solid rgba(160,168,255,0.32)',
+              }} />
+              <AlarmClock size={36} color="#a5b0ff" style={{ position: 'relative' }} />
+            </div>
+            <div style={{ fontSize: 15, fontWeight: 700, color: 'var(--text-primary)' }}>Нет активных таймеров</div>
+            <div style={{
+              fontSize: 12, color: 'var(--text-secondary)', textAlign: 'center', lineHeight: 1.7,
+              padding: '10px 16px', borderRadius: 12,
+              background: 'rgba(255,255,255,0.04)', border: '1px solid var(--border-subtle)',
+            }}>
+              Скажи «Эй, космо, поставь таймер на 5 минут»<br />или нажми <span style={{ color: 'var(--accent)', fontWeight: 800 }}>+</span>
             </div>
           </button>
         ) : (