:root,[data-theme=light]{--bg: #f2f2f7;--bg-card: #ffffff;--bg-secondary: #f9f9f9;--text: #1c1c1e;--text-secondary: #8e8e93;--accent: #0a84ff;--accent-hover: #0070e0;--border: rgba(0, 0, 0, .08);--shadow: 0 2px 12px rgba(0, 0, 0, .06);--green: #34c759;--red: #ff3b30;--orange: #ff9500}[data-theme=dark]{--bg: #1c1c1e;--bg-card: #2c2c2e;--bg-secondary: #3a3a3c;--text: #ffffff;--text-secondary: #98989d;--accent: #0a84ff;--accent-hover: #409cff;--border: rgba(255, 255, 255, .1);--shadow: 0 2px 12px rgba(0, 0, 0, .3);--green: #30d158;--red: #ff453a;--orange: #ff9f0a}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;-webkit-font-smoothing:antialiased;transition:background .3s,color .3s}a{color:var(--accent);text-decoration:none}button{cursor:pointer;border:none;background:none;font-family:inherit}.container{max-width:600px;margin:0 auto;padding:16px}.card{background:var(--bg-card);border-radius:16px;padding:16px;box-shadow:var(--shadow);border:1px solid var(--border);transition:transform .15s ease}.card:hover{transform:translateY(-1px)}.header{text-align:center;padding:32px 0 20px}.header h1{font-size:28px;font-weight:700;margin-bottom:6px}.header p{font-size:15px;color:var(--text-secondary)}.theme-toggle{position:fixed;top:calc(16px + env(safe-area-inset-top,0px));right:calc(16px + env(safe-area-inset-right,0px));width:40px;height:40px;border-radius:50%;background:var(--bg-card);border:1px solid var(--border);font-size:20px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);z-index:100}.services{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.service-card{display:flex;align-items:center;gap:14px;background:var(--bg-card);border-radius:16px;padding:16px;text-decoration:none;color:var(--text);box-shadow:var(--shadow);border:1px solid var(--border);transition:transform .15s ease,background .2s}.service-card:hover{transform:translateY(-2px);background:var(--bg-secondary)}.service-icon{font-size:32px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--bg);border-radius:12px}.service-info{flex:1}.service-info h2{font-size:17px;font-weight:600;margin-bottom:2px}.service-info p{font-size:13px;color:var(--text-secondary)}.service-arrow{font-size:18px;color:var(--text-secondary)}.placeholder{text-align:center;padding:40px 20px;color:var(--text-secondary)}.placeholder-icon{font-size:48px;margin-bottom:12px}.placeholder-title{font-size:16px;font-weight:600;color:var(--text);margin-bottom:4px}.placeholder-text{font-size:14px}.footer{text-align:center;padding:24px 0;color:var(--text-secondary);font-size:13px}.push-section{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:12px}.push-btn{padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500;transition:background .2s}.push-btn--off{background:var(--bg-secondary);color:var(--text)}.push-btn--on{background:var(--accent);color:#fff}.push-status{font-size:13px;color:var(--text-secondary)}.weather-animation-container{position:relative;overflow:hidden;min-height:200px;border-radius:16px}.weather-particle{position:absolute;pointer-events:none;z-index:0;border-radius:50%}.weather-particle--rain{background:linear-gradient(to bottom,transparent,rgba(100,150,255,.6));border-radius:1px;animation-name:rainFall;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes rainFall{0%{transform:translateY(-20px) translate(0);opacity:0}10%{opacity:1}90%{opacity:1}to{transform:translateY(500px) translate(-30px);opacity:0}}.weather-particle--snow{background:#fff;border-radius:50%;box-shadow:0 0 4px #ffffff80;animation-name:snowFall;animation-timing-function:linear;animation-iteration-count:infinite}@keyframes snowFall{0%{transform:translateY(-10px) translate(0) rotate(0);opacity:0}10%{opacity:1}90%{opacity:.8}to{transform:translateY(500px) translate(20px) rotate(360deg);opacity:0}}.weather-particle--cloud{background:#ffffff26;border-radius:50px;animation-name:cloudDrift;animation-timing-function:linear;animation-iteration-count:infinite;filter:blur(2px)}[data-theme=dark] .weather-particle--cloud{background:#ffffff14}@keyframes cloudDrift{0%{transform:translate(-120px);opacity:0}10%{opacity:1}90%{opacity:.6}to{transform:translate(calc(100vw + 120px));opacity:0}}.weather-animation-container[data-weather=clear]:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 50% 30%,rgba(255,200,50,.08),transparent 60%);animation:sunGlow 4s ease-in-out infinite alternate;pointer-events:none;z-index:0}@keyframes sunGlow{0%{opacity:.5;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}.weather-lightning{position:absolute;width:4px;height:60px;background:linear-gradient(to bottom,transparent,#fff,transparent);filter:blur(1px);animation:lightningFlash 6s ease infinite;pointer-events:none;z-index:1;opacity:0}@keyframes lightningFlash{0%,90%,92%,94%,96%,to{opacity:0}91%,93%,95%{opacity:1;box-shadow:0 0 20px #fff,0 0 40px #ffe}}@keyframes widgetRain{0%{transform:translateY(-20px);opacity:0}10%{opacity:1}to{transform:translateY(120px);opacity:.2}}@keyframes widgetSnow{0%{transform:translateY(-10px) rotate(0);opacity:0}10%{opacity:1}to{transform:translateY(120px) rotate(360deg);opacity:.3}}@keyframes widgetCloud{0%{transform:translate(-60px);opacity:0}10%{opacity:.5}90%{opacity:.3}to{transform:translate(calc(100% + 60px));opacity:0}}.mercury-mini-orbit{position:relative;width:48px;height:48px;flex-shrink:0}.mercury-orbit-ring{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:50%;border:2px dashed;opacity:.3}.mercury-orbit-ring--direct{border-color:var(--green);animation:mercuryOrbitForward 6s linear infinite}.mercury-orbit-ring--retro{border-color:var(--red);animation:mercuryOrbitBackward 3s linear infinite}.mercury-planet{position:absolute;width:14px;height:14px;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%);transition:background .4s,box-shadow .4s}.mercury-planet--direct{background:radial-gradient(circle at 35% 35%,#4cd964,var(--green));box-shadow:0 0 12px #34c75980,0 0 24px #34c75940;animation:mercuryGlowPulse 3s ease-in-out infinite}.mercury-planet--retro{background:radial-gradient(circle at 35% 35%,#ff6b6b,var(--red));box-shadow:0 0 16px #ff3b30b3,0 0 32px #ff3b3066;animation:mercuryGlowAlert .8s ease-in-out infinite,mercuryJitter .15s ease-in-out infinite}@keyframes mercuryOrbitForward{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes mercuryOrbitBackward{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}@keyframes mercuryGlowPulse{0%,to{box-shadow:0 0 12px #34c75980,0 0 24px #34c75940}50%{box-shadow:0 0 20px #34c759cc,0 0 36px #34c75966}}@keyframes mercuryGlowAlert{0%,to{box-shadow:0 0 16px #ff3b3099,0 0 28px #ff3b304d}50%{box-shadow:0 0 28px #ff3b30,0 0 48px #ff3b3099}}@keyframes mercuryJitter{0%,to{transform:translate(-50%,-50%) translate(0)}25%{transform:translate(-50%,-50%) translate(2px,-1px)}50%{transform:translate(-50%,-50%) translate(-1.5px,2px)}75%{transform:translate(-50%,-50%) translate(-2px,-1px)}}.mercury-particle{position:absolute;width:3px;height:3px;border-radius:50%;pointer-events:none}.mercury-particle--retro{background:var(--red);animation:mercuryParticleFade 1.5s ease-in-out infinite}.mercury-particle--retro:nth-child(1){top:-3px;left:50%;animation-delay:0s}.mercury-particle--retro:nth-child(2){top:50%;right:-3px;animation-delay:.5s}.mercury-particle--retro:nth-child(3){bottom:-3px;left:50%;animation-delay:1s}.mercury-particle--retro:nth-child(4){top:50%;left:-3px;animation-delay:1.5s}@keyframes mercuryParticleFade{0%,to{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1.5)}}.mercury-large-orbit{width:100px;height:100px}.mercury-orbit-ring--large{border-width:3px}.mercury-planet--large{width:28px;height:28px}.card--mercury-direct{background:linear-gradient(135deg,var(--bg-card),rgba(52,199,89,.04));transition:background .5s ease}.card--mercury-retro{background:linear-gradient(135deg,var(--bg-card),rgba(255,59,48,.06));transition:background .5s ease}@media(max-width:480px){.container{padding:12px}.header{padding:24px 0 16px}.header h1{font-size:24px}}
