:root{font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-primary:#0ea5e9;--color-primary-light:#38bdf8;--color-primary-lighter:#7dd3fc;--color-primary-dark:#0284c7;--color-primary-darker:#0369a1;--color-accent:#fb923c;--color-accent-light:#fdba74;--color-accent-dark:#f97316;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#ef4444;--color-info:#3b82f6;--color-text-primary:#1f2937;--color-text-secondary:#6b7280;--color-text-tertiary:#9ca3af;--color-bg-primary:#fff;--color-bg-secondary:#f9fafb;--color-bg-tertiary:#f3f4f6;--color-border:#e5e7eb;--color-border-light:#f3f4f6;--spacing-xs:.25rem;--spacing-sm:.5rem;--spacing-md:1rem;--spacing-lg:1.5rem;--spacing-xl:2rem;--spacing-2xl:3rem;--spacing-3xl:4rem;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:2rem;--font-size-4xl:2.5rem;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--shadow-xs:0 1px 2px #0000000d;--shadow-sm:0 2px 8px #00000014;--shadow-md:0 4px 12px #0000001f;--shadow-lg:0 8px 24px #00000026;--shadow-xl:0 12px 32px #0000002e;--shadow-2xl:0 20px 48px #00000038;--glass-bg:#ffffffd9;--glass-border:#ffffff80;--glass-shadow:0 8px 32px #0ea5e926;--backdrop-blur:blur(24px)saturate(200%);--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-xl:1rem;--radius-full:9999px;--transition-fast:.15s ease-in-out;--transition-base:.25s ease-in-out;--transition-slow:.35s ease-in-out;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans KR,system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.6}*{box-sizing:border-box}body.dark-mode{--color-text-primary:#f9fafb;--color-text-secondary:#d1d5db;--color-text-tertiary:#9ca3af;--color-bg-primary:#0f172a;--color-bg-secondary:#1e293b;--color-bg-tertiary:#334155;--color-border:#334155;--color-border-light:#475569;--shadow-xs:0 1px 2px #0003;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 4px 12px #00000059;--shadow-lg:0 8px 24px #0006;--shadow-xl:0 12px 32px #00000073;--shadow-2xl:0 20px 48px #00000080;--glass-bg:#1e293bd9;--glass-border:#ffffff1f;--glass-shadow:0 8px 32px #00000080;--backdrop-blur:blur(30px)saturate(180%)}body{background-color:var(--color-bg-primary);min-width:320px;min-height:100vh;color:var(--color-text-primary);transition:background-color var(--transition-base),color var(--transition-base);margin:0}h1{font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);margin:0 0 var(--spacing-lg)0;color:var(--color-text-primary);line-height:1.2}h2{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);margin:0 0 var(--spacing-md)0;color:var(--color-text-primary);line-height:1.3}h3{font-size:var(--font-size-2xl);font-weight:var(--font-weight-semibold);margin:0 0 var(--spacing-sm)0;color:var(--color-text-primary);line-height:1.4}p{font-size:var(--font-size-base);margin:0 0 var(--spacing-md)0;color:var(--color-text-secondary);line-height:1.6}a{font-weight:var(--font-weight-medium);color:var(--color-primary);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-primary-dark)}a:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}button{border-radius:var(--radius-md);padding:var(--spacing-sm)var(--spacing-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-medium);background-color:var(--color-bg-tertiary);color:var(--color-text-primary);cursor:pointer;transition:all var(--transition-fast);border:1px solid #0000;font-family:inherit}button:hover{background-color:var(--color-bg-secondary);box-shadow:var(--shadow-sm);transform:translateY(-1px)}button:active{transform:translateY(0)}button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}button:disabled{opacity:.5;cursor:not-allowed;transform:none}input,textarea,select{font-family:inherit;font-size:var(--font-size-base);padding:var(--spacing-sm)var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg-primary);color:var(--color-text-primary);transition:all var(--transition-fast)}input:focus,textarea:focus,select:focus{border-color:var(--color-primary);outline:none;box-shadow:0 0 0 3px #646cff1a}input::placeholder,textarea::placeholder{color:var(--color-text-tertiary)}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--color-text-tertiary)}.weather-dashboard{-webkit-backdrop-filter:blur(30px)saturate(200%);padding:var(--spacing-2xl);z-index:1;isolation:isolate;background:linear-gradient(135deg,#fffffff2 0%,#ffffffd9 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.03\"/></svg>");border:1px solid #fff9;border-radius:20px;transition:all .4s cubic-bezier(.34,1.56,.64,1);animation:.6s cubic-bezier(.34,1.56,.64,1) fadeInUp;position:relative;box-shadow:0 4px 6px #0000000d,0 10px 20px #00000014,0 20px 40px #0000001a,inset 0 1px 2px #fffc,inset 0 -1px 2px #0000000d}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.weather-dashboard:hover{transform:translateY(-4px)scale(1.002);box-shadow:0 6px 10px #00000014,0 15px 30px #0000001f,0 25px 50px #00000026,inset 0 1px 2px #ffffffe6,inset 0 -1px 2px #00000008,0 0 60px #2563eb26}body.dark-mode .weather-dashboard{background:linear-gradient(135deg,#1e293bf2 0%,#0f172ad9 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.05\"/></svg>");border-color:#ffffff1a;box-shadow:0 4px 6px #0006,0 10px 20px #00000080,0 20px 40px #0009,inset 0 1px 2px #ffffff14,inset 0 -1px 2px #0000004d}body.dark-mode .weather-dashboard:hover{box-shadow:0 6px 10px #00000080,0 15px 30px #0009,0 25px 50px #000000b3,inset 0 1px 2px #ffffff1f,inset 0 -1px 2px #0003,0 0 60px #3b82f640}.weather-dashboard.loading{text-align:center;padding:var(--spacing-2xl);color:var(--color-text-tertiary)}.weather-main{margin-bottom:var(--spacing-xl)}.weather-current{justify-content:center;align-items:center;gap:var(--spacing-xl);margin-bottom:var(--spacing-xl);display:flex}.weather-icon{filter:drop-shadow(0 8px 24px #2563eb40);justify-content:center;align-items:center;width:140px;height:140px;display:flex;position:relative}.weather-icon:before{content:"";background:radial-gradient(circle,#2563eb1a 0%,#0000 70%);border-radius:50%;width:100%;height:100%;animation:3s ease-in-out infinite iconGlow;position:absolute}.weather-icon-svg{color:var(--color-primary);filter:drop-shadow(0 8px 16px #2563eb80);z-index:1;animation:3s ease-in-out infinite iconFloat;position:relative}@keyframes iconFloat{0%,to{transform:translateY(0)scale(1)}50%{transform:translateY(-12px)scale(1.05)}}@keyframes iconGlow{0%,to{opacity:.5;transform:scale(1)}50%{opacity:.8;transform:scale(1.2)}}.weather-temp{text-align:left}.temp-value{color:var(--color-text-primary);letter-spacing:-.04em;text-shadow:0 2px 4px #0000001a,0 4px 8px #0000000d;background:linear-gradient(135deg,var(--color-text-primary)0%,var(--color-primary)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:4rem;font-weight:800;line-height:1}body.dark-mode .temp-value{background:linear-gradient(135deg,#fff 0%,var(--color-primary-light)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.temp-description{color:var(--color-text-secondary);text-transform:capitalize;margin-top:var(--spacing-md);letter-spacing:.02em;font-size:1.25rem;font-weight:600}.temp-feels{color:var(--color-text-tertiary);margin-top:var(--spacing-sm);font-size:1rem;font-weight:500}.weather-details{gap:var(--spacing-md);grid-template-columns:repeat(auto-fit,minmax(150px,1fr));animation:.6s cubic-bezier(.34,1.56,.64,1) .2s both fadeInUp;display:grid}.detail-item{align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:linear-gradient(135deg,#f8fafcfa 0%,#f1f5f9f2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.015\"/></svg>");border:1px solid #e2e8f0cc;border-radius:12px;transition:all .4s cubic-bezier(.34,1.56,.64,1);animation:.5s cubic-bezier(.34,1.56,.64,1) both scaleIn;display:flex;box-shadow:0 2px 4px #0000000a,0 4px 8px #00000008,inset 0 1px 1px #ffffffe6}.detail-item:first-child{animation-delay:.3s}.detail-item:nth-child(2){animation-delay:.35s}.detail-item:nth-child(3){animation-delay:.4s}.detail-item:nth-child(4){animation-delay:.45s}@keyframes scaleIn{0%{opacity:0;transform:scale(.85)translateY(20px)}50%{transform:scale(1.02)translateY(-5px)}to{opacity:1;transform:scale(1)translateY(0)}}.detail-item:hover{background:linear-gradient(135deg,#fffffffa 0%,#f8fafcf2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.02\"/></svg>");border-color:#2563eb4d;transform:translateY(-4px)scale(1.02);box-shadow:0 6px 12px #00000014,0 12px 24px #0000000f,inset 0 1px 1px #fff,0 0 20px #2563eb1a}body.dark-mode .detail-item{background:linear-gradient(135deg,#0f172afa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.03\"/></svg>");border-color:#334155cc;box-shadow:0 2px 4px #0000004d,0 4px 8px #0006,inset 0 1px 1px #ffffff0d}body.dark-mode .detail-item:hover{background:linear-gradient(135deg,#1e293bfa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.04\"/></svg>");border-color:#3b82f666;box-shadow:0 6px 12px #00000080,0 12px 24px #0009,inset 0 1px 1px #ffffff14,0 0 20px #3b82f633}.detail-item svg{color:var(--color-primary);filter:drop-shadow(0 2px 4px #2563eb4d);flex-shrink:0;transition:all .3s}.detail-item:hover svg{filter:drop-shadow(0 4px 8px #2563eb80);transform:scale(1.1)}.detail-info{gap:var(--spacing-xs);flex-direction:column;flex:1;display:flex}.detail-label{color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.08em;font-size:.75rem;font-weight:600}.detail-value{color:var(--color-text-primary);letter-spacing:-.01em;font-size:1.25rem;font-weight:700}.detail-value.aqi{font-weight:var(--font-weight-bold)}.weather-forecast{border-top:1px solid var(--color-border);padding-top:var(--spacing-xl);margin-top:var(--spacing-xl);animation:.6s cubic-bezier(.34,1.56,.64,1) .5s both fadeInUp}.weather-forecast h3{margin:0 0 var(--spacing-xl)0;color:var(--color-text-primary);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);align-items:center;gap:var(--spacing-sm);display:flex}.weather-forecast h3:before{content:"";background:linear-gradient(180deg,var(--color-primary)0%,var(--color-accent)100%);border-radius:var(--radius-sm);width:4px;height:24px;display:inline-block}.forecast-list{gap:var(--spacing-md);grid-template-columns:repeat(auto-fit,minmax(120px,1fr));display:grid}.forecast-item{padding:var(--spacing-lg);cursor:pointer;background:linear-gradient(135deg,#f8fafcfa 0%,#f1f5f9f2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.015\"/></svg>");border:2px solid #e2e8f0cc;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;min-height:150px;transition:all .4s cubic-bezier(.34,1.56,.64,1);animation:.4s cubic-bezier(.34,1.56,.64,1) both fadeInUp;display:flex;box-shadow:0 2px 4px #0000000a,0 4px 8px #00000008,inset 0 1px 1px #ffffffe6}.forecast-item:first-child{animation-delay:.6s}.forecast-item:nth-child(2){animation-delay:.65s}.forecast-item:nth-child(3){animation-delay:.7s}.forecast-item:nth-child(4){animation-delay:.75s}.forecast-item:nth-child(5){animation-delay:.8s}.forecast-item:nth-child(6){animation-delay:.85s}.forecast-item:nth-child(7){animation-delay:.9s}.forecast-item:hover{background:linear-gradient(135deg,#fffffffa 0%,#f8fafcf2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.02\"/></svg>");border-color:#2563eb66;transform:translateY(-4px)scale(1.05);box-shadow:0 6px 12px #00000014,0 12px 24px #0000000f,inset 0 1px 1px #fff,0 0 20px #2563eb1f}.forecast-item.selected{background:linear-gradient(135deg,var(--color-primary)0%,#2563ebf2 100%);color:#fff;border-color:#0000;transform:translateY(-4px)scale(1.05);box-shadow:0 8px 16px #2563eb59,0 16px 32px #2563eb40,inset 0 1px 1px #ffffff4d,0 0 30px #2563eb66}body.dark-mode .forecast-item{background:linear-gradient(135deg,#0f172afa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.03\"/></svg>");border-color:#334155cc;box-shadow:0 2px 4px #0000004d,0 4px 8px #0006,inset 0 1px 1px #ffffff0d}body.dark-mode .forecast-item:hover{background:linear-gradient(135deg,#1e293bfa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.04\"/></svg>");border-color:#3b82f666;box-shadow:0 6px 12px #00000080,0 12px 24px #0009,inset 0 1px 1px #ffffff14,0 0 20px #3b82f633}.forecast-item.selected .forecast-day,.forecast-item.selected .forecast-temp,.forecast-item.selected .forecast-desc{color:#fff}.forecast-day{font-weight:var(--font-weight-bold);color:var(--color-primary);margin-bottom:var(--spacing-sm);text-transform:uppercase;letter-spacing:.05em;font-size:.875rem}.forecast-icon{width:56px;height:56px;margin:var(--spacing-xs)0;justify-content:center;align-items:center;display:flex}.forecast-icon .weather-icon-svg{color:var(--color-primary);transition:all var(--transition-fast)}.forecast-item.selected .forecast-icon .weather-icon-svg{color:#fff}.forecast-temp{font-size:1.125rem;font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin:var(--spacing-xs)0}.forecast-desc{color:var(--color-text-secondary);text-align:center;text-transform:capitalize;font-size:.75rem}.hourly-weather{border-top:1px solid var(--color-border);padding-top:var(--spacing-xl);margin-bottom:var(--spacing-xl)}.hourly-header{margin-bottom:var(--spacing-xl);padding:var(--spacing-lg);border-radius:var(--radius-lg);background:linear-gradient(135deg,#f8fafcfa 0%,#f1f5f9f2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.015\"/></svg>");border:1px solid #e2e8f0cc;justify-content:space-between;align-items:center;display:flex;box-shadow:0 2px 4px #0000000a,inset 0 1px 1px #ffffffe6}body.dark-mode .hourly-header{background:linear-gradient(135deg,#0f172afa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.03\"/></svg>");border-color:#334155cc;box-shadow:0 2px 4px #0000004d,inset 0 1px 1px #ffffff0d}.hourly-header h3{color:var(--color-text-primary);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold);align-items:center;gap:var(--spacing-sm);margin:0;display:flex}.hourly-header h3:before{content:"";background:linear-gradient(180deg,var(--color-primary)0%,var(--color-accent)100%);border-radius:var(--radius-sm);width:4px;height:24px;display:inline-block}.close-btn{cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;min-width:80px;padding:12px 28px;transition:all .3s;display:flex;box-shadow:0 4px 12px #ef444466;color:#000!important;text-shadow:none!important;-webkit-text-fill-color:#000!important;background:#ef4444!important;font-size:16px!important;font-weight:700!important}.close-btn:hover{background:#dc2626;transform:translateY(-2px);box-shadow:0 6px 16px #ef444480}.close-btn:active{transform:translateY(0);box-shadow:0 2px 8px #ef444466}body.dark-mode .close-btn{color:#fff;text-shadow:0 1px 2px #0003;background:#dc2626;box-shadow:0 4px 12px #dc262680}body.dark-mode .close-btn:hover{background:#b91c1c;box-shadow:0 6px 16px #dc262699}.hourly-list{gap:var(--spacing-sm);grid-template-columns:repeat(auto-fill,minmax(160px,1fr));display:grid}.hourly-item{padding:var(--spacing-lg);background:linear-gradient(135deg,#f8fafcfa 0%,#f1f5f9f2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.015\"/></svg>");border:1px solid #e2e8f0cc;border-radius:12px;flex-direction:column;align-items:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:flex;box-shadow:0 2px 4px #0000000a,inset 0 1px 1px #ffffffe6}.hourly-item:hover{border-color:var(--color-primary-light);background:linear-gradient(135deg,#fffffffa 0%,#f8fafcf2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.02\"/></svg>");transform:translateY(-2px)scale(1.02);box-shadow:0 4px 8px #00000014,0 8px 16px #0000000f,inset 0 1px 1px #fff}body.dark-mode .hourly-item{background:linear-gradient(135deg,#0f172afa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.03\"/></svg>");border-color:#334155cc;box-shadow:0 2px 4px #0000004d,inset 0 1px 1px #ffffff0d}body.dark-mode .hourly-item:hover{border-color:var(--color-primary-dark);background:linear-gradient(135deg,#1e293bfa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.04\"/></svg>");box-shadow:0 4px 8px #00000080,inset 0 1px 1px #ffffff14}.hourly-time{font-weight:var(--font-weight-bold);color:var(--color-primary);margin-bottom:var(--spacing-sm);font-size:.9375rem}.hourly-icon{width:48px;height:48px;margin:var(--spacing-xs)0;justify-content:center;align-items:center;display:flex}.hourly-icon .weather-icon-svg{color:var(--color-primary)}.hourly-temp{font-size:1.125rem;font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin:var(--spacing-sm)0}.hourly-details{gap:var(--spacing-sm);margin:var(--spacing-sm)0;color:var(--color-text-secondary);flex-wrap:wrap;justify-content:center;font-size:.75rem;display:flex}.hourly-details span{align-items:center;gap:4px;display:flex}.hourly-details svg{color:var(--color-primary-light);flex-shrink:0}.hourly-desc{color:var(--color-text-secondary);text-align:center;text-transform:capitalize;margin-top:var(--spacing-xs);font-size:.75rem}.weather-dashboard .schedule-container{margin-top:var(--spacing-xl);border-top:1px solid var(--color-border);padding-top:var(--spacing-xl)}@media (max-width:768px){.weather-current{gap:var(--spacing-lg);flex-direction:column}.weather-temp{text-align:center}.temp-value{font-size:var(--font-size-3xl)}.weather-details{gap:var(--spacing-sm);grid-template-columns:repeat(2,1fr)}.detail-item{padding:var(--spacing-md)}.weather-icon{width:120px;height:120px}.hourly-list{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}.hourly-item{padding:var(--spacing-sm)}.hourly-icon{width:45px;height:45px}.hourly-temp{font-size:var(--font-size-lg)}.forecast-list{gap:var(--spacing-sm)}}@media (max-width:480px){.weather-dashboard{padding:var(--spacing-lg)}.weather-details,.hourly-list{grid-template-columns:1fr}}.react-calendar{background:#fff;border:1px solid #a0a096;width:350px;max-width:100%;font-family:Arial,Helvetica,sans-serif;line-height:1.125em}.react-calendar--doubleView{width:700px}.react-calendar--doubleView .react-calendar__viewContainer{margin:-.5em;display:flex}.react-calendar--doubleView .react-calendar__viewContainer>*{width:50%;margin:.5em}.react-calendar,.react-calendar *,.react-calendar :before,.react-calendar :after{box-sizing:border-box}.react-calendar button{border:0;outline:none;margin:0}.react-calendar button:enabled:hover{cursor:pointer}.react-calendar__navigation{height:44px;margin-bottom:1em;display:flex}.react-calendar__navigation button{background:0 0;min-width:44px}.react-calendar__navigation button:disabled{background-color:#f0f0f0}.react-calendar__navigation button:enabled:hover,.react-calendar__navigation button:enabled:focus{background-color:#e6e6e6}.react-calendar__month-view__weekdays{text-align:center;text-transform:uppercase;font:inherit;font-size:.75em;font-weight:700}.react-calendar__month-view__weekdays__weekday{padding:.5em}.react-calendar__month-view__weekNumbers .react-calendar__tile{font:inherit;justify-content:center;align-items:center;font-size:.75em;font-weight:700;display:flex}.react-calendar__month-view__days__day--weekend{color:#d10000}.react-calendar__month-view__days__day--neighboringMonth,.react-calendar__decade-view__years__year--neighboringDecade,.react-calendar__century-view__decades__decade--neighboringCentury{color:#757575}.react-calendar__year-view .react-calendar__tile,.react-calendar__decade-view .react-calendar__tile,.react-calendar__century-view .react-calendar__tile{padding:2em .5em}.react-calendar__tile{text-align:center;max-width:100%;font:inherit;background:0 0;padding:10px 6.6667px;font-size:.833em}.react-calendar__tile:disabled{color:#ababab;background-color:#f0f0f0}.react-calendar__month-view__days__day--neighboringMonth:disabled,.react-calendar__decade-view__years__year--neighboringDecade:disabled,.react-calendar__century-view__decades__decade--neighboringCentury:disabled{color:#cdcdcd}.react-calendar__tile:enabled:hover,.react-calendar__tile:enabled:focus{background-color:#e6e6e6}.react-calendar__tile--now{background:#ffff76}.react-calendar__tile--now:enabled:hover,.react-calendar__tile--now:enabled:focus{background:#ffffa9}.react-calendar__tile--hasActive{background:#76baff}.react-calendar__tile--hasActive:enabled:hover,.react-calendar__tile--hasActive:enabled:focus{background:#a9d4ff}.react-calendar__tile--active{color:#fff;background:#006edc}.react-calendar__tile--active:enabled:hover,.react-calendar__tile--active:enabled:focus{background:#1087ff}.react-calendar--selectRange .react-calendar__tile--hover{background-color:#e6e6e6}.calendar-schedule{gap:var(--spacing-xl);padding:var(--spacing-md);grid-template-columns:1fr auto;width:100%;max-width:1400px;min-height:600px;margin:0 auto;display:grid}.calendar-container h2,.schedule-container h3{margin-bottom:var(--spacing-lg);color:var(--color-text-primary);font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}.custom-calendar{width:100%;padding:var(--spacing-2xl);-webkit-backdrop-filter:var(--backdrop-blur);border:none;border:1px solid var(--glass-border);isolation:isolate;background:linear-gradient(135deg,#fffffff2 0%,#ffffffd9 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.03\"/></svg>");border-radius:16px;min-height:550px;font-size:1.4em;transition:transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .4s cubic-bezier(.34,1.56,.64,1),background .3s;box-shadow:0 2px 4px #0000000a,0 4px 8px #0000000f,0 8px 16px #00000014,inset 0 1px 2px #fff9,inset 0 -1px 2px #0000000d}.custom-calendar:hover{transform:translateY(-4px)scale(1.002);box-shadow:0 4px 8px #0000000f,0 8px 16px #00000014,0 16px 32px #0000001a,inset 0 1px 2px #ffffffb3,inset 0 -1px 2px #00000008,0 0 40px #2563eb14}body.dark-mode .custom-calendar{border-color:var(--glass-border);background:linear-gradient(135deg,#1e293bf2 0%,#0f172ad9 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.05\"/></svg>");box-shadow:0 2px 4px #0000004d,0 4px 8px #0006,0 8px 16px #00000080,inset 0 1px 2px #ffffff14,inset 0 -1px 2px #0000004d}body.dark-mode .custom-calendar:hover{box-shadow:0 4px 8px #0006,0 8px 16px #00000080,0 16px 32px #0009,inset 0 1px 2px #ffffff1f,inset 0 -1px 2px #0003,0 0 40px #3b82f626}.custom-calendar button{padding:var(--spacing-xl)var(--spacing-2xl);min-width:80px;transition:transform .3s cubic-bezier(.34,1.56,.64,1),background .2s,box-shadow .3s;position:relative}.custom-calendar button:active{transition:transform .1s cubic-bezier(.34,1.56,.64,1);transform:scale(.95)}.custom-calendar .react-calendar__tile--active{background:linear-gradient(135deg,var(--color-primary)0%,#646cffd9 100%);color:#fff;font-weight:var(--font-weight-semibold);transform:scale(1.05);box-shadow:0 2px 4px #0000001a,0 4px 8px #646cff4d,inset 0 1px 1px #ffffff4d}.custom-calendar .react-calendar__tile--now{background:linear-gradient(135deg,var(--color-primary-light)0%,#646cffb3 100%);color:#fff;box-shadow:0 1px 2px #00000014,inset 0 1px 1px #fff3}.custom-calendar .react-calendar__tile:hover:not(:disabled){background:var(--color-bg-tertiary);transition:all .2s cubic-bezier(.34,1.56,.64,1);transform:translateY(-2px)scale(1.02);box-shadow:0 2px 4px #00000014}.calendar-dot{background:linear-gradient(135deg,var(--color-primary)0%,#646cffe6 100%);color:#fff;border-radius:var(--radius-full);width:20px;height:20px;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);justify-content:center;align-items:center;margin:2px auto;animation:2s cubic-bezier(.4,0,.6,1) infinite pulse;display:flex;box-shadow:0 2px 4px #646cff66,inset 0 1px 1px #fff6,inset 0 -1px 1px #0003}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.1)}}.schedule-container{padding:var(--spacing-2xl);background:linear-gradient(135deg,#fffffffa 0%,#f8fafcf2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.02\"/></svg>");border:1px solid #0000000d;border-radius:16px;min-width:300px;transition:transform .4s cubic-bezier(.34,1.56,.64,1),box-shadow .4s cubic-bezier(.34,1.56,.64,1);box-shadow:0 2px 4px #0000000a,0 4px 8px #0000000f,inset 0 1px 2px #fffc,inset 0 -1px 2px #00000008}.schedule-container:hover{transform:translateY(-2px)scale(1.01);box-shadow:0 4px 8px #0000000f,0 8px 16px #00000014,inset 0 1px 2px #ffffffe6,inset 0 -1px 2px #00000005}body.dark-mode .schedule-container{background:linear-gradient(135deg,#1e293bfa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.04\"/></svg>");border-color:#ffffff0d;box-shadow:0 2px 4px #0000004d,0 4px 8px #0006,inset 0 1px 2px #ffffff0d,inset 0 -1px 2px #0000004d}.add-event{gap:var(--spacing-sm);margin-bottom:var(--spacing-lg);display:flex}.add-event input{padding:var(--spacing-sm)var(--spacing-md);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);background:linear-gradient(135deg,var(--color-bg-primary)0%,#fffffff2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.01\"/></svg>");color:var(--color-text-primary);flex:1;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s cubic-bezier(.34,1.56,.64,1),border-color .2s;box-shadow:inset 0 1px 2px #0000000f,0 1px 1px #fffc}.add-event input:focus{border-color:var(--color-primary);outline:none;transform:translateY(-1px);box-shadow:0 0 0 3px #646cff1a,0 2px 4px #646cff26,inset 0 1px 2px #0000000a,0 1px 1px #ffffffe6}.add-event input[type=time]{flex:0 0 120px}.add-btn{align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm)var(--spacing-lg);background:linear-gradient(135deg,var(--color-primary)0%,#646cffe6 100%);color:#fff;border-radius:var(--radius-md);cursor:pointer;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);white-space:nowrap;border:none;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s cubic-bezier(.34,1.56,.64,1),background .2s;display:flex;box-shadow:0 2px 4px #646cff4d,0 4px 8px #646cff33,inset 0 1px 1px #ffffff4d,inset 0 -1px 1px #0003}.add-btn:hover{background:linear-gradient(135deg,var(--color-primary-dark)0%,#5a62ebf2 100%);transform:translateY(-2px)scale(1.02);box-shadow:0 4px 8px #646cff66,0 8px 16px #646cff4d,inset 0 1px 1px #fff6,inset 0 -1px 1px #00000026}.add-btn:active{transition:all .1s cubic-bezier(.34,1.56,.64,1);transform:translateY(0)scale(.98);box-shadow:0 1px 2px #646cff4d,inset 0 2px 4px #0003}.events-list{gap:var(--spacing-sm);flex-direction:column;display:flex}.event-item{padding:var(--spacing-md);border-left:4px solid var(--color-primary);background:linear-gradient(135deg,#f8fafcfa 0%,#f1f5f9f2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.015\"/></svg>");border:1px solid #e2e8f0;border-radius:12px;justify-content:space-between;align-items:center;transition:transform .3s cubic-bezier(.34,1.56,.64,1),box-shadow .3s cubic-bezier(.34,1.56,.64,1),background .2s;display:flex;box-shadow:0 1px 2px #0000000a,0 2px 4px #00000008,inset 0 1px 1px #ffffffb3,inset -1px 0 1px #646cff1a}.event-item:hover{background:linear-gradient(135deg,#fffffffa 0%,#f8fafcf2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.02\"/></svg>");transform:translate(6px)scale(1.01);box-shadow:0 4px 8px #00000014,0 2px 4px #0000000f,inset 0 1px 1px #fffc,inset -2px 0 2px #646cff26}body.dark-mode .event-item{background:linear-gradient(135deg,#0f172afa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.03\"/></svg>");border-color:#334155;box-shadow:0 1px 2px #0000004d,0 2px 4px #0006,inset 0 1px 1px #ffffff0d,inset -1px 0 1px #646cff26}body.dark-mode .event-item:hover{background:linear-gradient(135deg,#1e293bfa 0%,#0f172af2 100%),url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\"><filter id=\"noise\"><feTurbulence type=\"fractalNoise\" baseFrequency=\"0.9\" numOctaves=\"4\" stitchTiles=\"stitch\"/></filter><rect width=\"100\" height=\"100\" filter=\"url(%23noise)\" opacity=\"0.04\"/></svg>");box-shadow:0 4px 8px #00000080,0 2px 4px #0006,inset 0 1px 1px #ffffff14,inset -2px 0 2px #646cff33}.event-info{align-items:center;gap:var(--spacing-md);flex:1;display:flex}.event-time{font-weight:var(--font-weight-semibold);color:var(--color-primary);min-width:60px;font-size:var(--font-size-sm)}.event-title{color:var(--color-text-primary);font-size:var(--font-size-sm)}.delete-btn{padding:var(--spacing-sm);color:var(--color-error);cursor:pointer;border-radius:var(--radius-md);background:0 0;border:none;justify-content:center;align-items:center;transition:transform .3s cubic-bezier(.34,1.56,.64,1),background .2s,box-shadow .3s;display:flex}.delete-btn:hover{background:linear-gradient(135deg,#ef44441f 0%,#ef444414 100%);transform:scale(1.15)rotate(5deg);box-shadow:0 2px 4px #ef444433,inset 0 1px 1px #fff3}.delete-btn:active{transition:all .1s cubic-bezier(.34,1.56,.64,1);transform:scale(1.05)rotate(0);box-shadow:inset 0 2px 4px #ef44444d}.no-events{text-align:center;color:var(--color-text-tertiary);padding:var(--spacing-2xl);font-style:italic;font-size:var(--font-size-sm)}@media (max-width:1024px){.calendar-schedule{gap:var(--spacing-lg)}}@media (max-width:768px){.calendar-schedule{padding:var(--spacing-sm);grid-template-columns:1fr}.custom-calendar{padding:var(--spacing-lg);font-size:1.2em}.custom-calendar button{padding:var(--spacing-lg)var(--spacing-xl)}.schedule-container{min-width:auto}.add-event{flex-direction:column}.add-event input[type=time]{flex:1}}.image-overlay{z-index:9999;animation:fadeIn var(--transition-base)ease-in;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.image-overlay img{object-fit:contain;border-radius:var(--radius-lg);max-width:90%;max-height:90%;box-shadow:var(--shadow-xl);animation:scaleIn var(--transition-base)ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.event-item{animation:.4s cubic-bezier(.34,1.56,.64,1) slideInRight}@keyframes slideInRight{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.notification-panel{background:var(--glass-bg);-webkit-backdrop-filter:var(--backdrop-blur);padding:var(--spacing-2xl);border:1px solid var(--glass-border);max-width:500px;transition:all var(--transition-base);isolation:isolate;border-radius:16px;margin:0 auto;box-shadow:0 1px 3px #00000014,0 1px 2px #0000000f,inset 0 1px 1px #fff6}.notification-panel:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a,0 2px 4px #0000000f,inset 0 1px 1px #ffffff80,0 0 30px #f59e0b1a}body.dark-mode .notification-panel{background:var(--glass-bg);border-color:var(--glass-border);box-shadow:0 1px 3px #0000004d,0 1px 2px #0003,inset 0 1px 1px #ffffff1a}body.dark-mode .notification-panel:hover{box-shadow:0 4px 12px #0006,0 2px 4px #0003,inset 0 1px 1px #ffffff26,0 0 30px #f59e0b33}.notification-header{border-bottom:1px solid #eee;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:1rem;display:flex}.notification-title{align-items:center;gap:.5rem;display:flex;position:relative}.notification-title h3{color:#333;margin:0}.notification-badge{color:#fff;background:#f44;border-radius:10px;justify-content:center;align-items:center;min-width:20px;height:20px;padding:0 6px;font-size:12px;font-weight:600;display:flex}.notification-actions{gap:.5rem;display:flex}.discord-btn{cursor:pointer;color:#fff;background:#5865f2;border:none;border-radius:4px;justify-content:center;align-items:center;padding:.5rem;transition:all .2s;display:flex}.discord-btn:hover{background:#4752c4;transform:translateY(-1px)}.discord-btn:active{transform:translateY(0)}.toggle-btn{cursor:pointer;border:none;border-radius:4px;padding:.5rem;transition:all .2s}.toggle-btn.enabled{background:var(--color-primary);color:#fff}.toggle-btn.disabled{color:#666;background:#e0e0e0}.clear-btn{cursor:pointer;color:#666;background:0 0;border:1px solid #ddd;border-radius:4px;padding:.5rem 1rem;font-size:12px;transition:all .2s}.clear-btn:hover{background:#f5f5f5;border-color:#ccc}.notifications-list{flex-direction:column;gap:.5rem;max-height:400px;margin-bottom:1rem;display:flex;overflow-y:auto}.notification-item{padding:var(--spacing-md);transition:all var(--transition-fast);border:1px solid #0000;border-radius:12px;justify-content:space-between;align-items:flex-start;display:flex;box-shadow:0 1px 2px #0000000a}.notification-item.unread{border-left:4px solid var(--color-primary);background:#eff6ff;border-color:#dbeafe}.notification-item.read{opacity:.7;background:#f9fafb;border-color:#f3f4f6;border-left-style:solid;border-left-width:4px}.notification-item.alert{border-left-color:var(--color-error)}.notification-item:hover{transform:translate(2px);box-shadow:0 4px 8px #00000014}body.dark-mode .notification-item.unread{background:#1e3a5f;border-color:#1e40af}body.dark-mode .notification-item.read{background:#0f172a;border-color:#1e293b}.notification-content{flex:1}.notification-message{color:#333;margin:0 0 .3rem;font-size:14px;line-height:1.4}.notification-time{color:#999;font-size:11px}.mark-read-btn{padding:var(--spacing-xs);color:var(--color-primary);cursor:pointer;border-radius:var(--radius-md);transition:all var(--transition-fast);background:0 0;border:none}.mark-read-btn:hover{background:#2563eb1a;transform:scale(1.1)}.no-notifications{text-align:center;color:#999;padding:2rem;font-style:italic}.notification-summary{background:#f0f9ff;border-left:3px solid #0ea5e9;border-radius:4px;padding:1rem}.notification-summary h4{color:#0ea5e9;margin:0 0 .5rem;font-size:14px}.notification-summary p{color:#333;margin:0;font-size:13px;line-height:1.5}.dark-mode .notification-panel{color:#e2e8f0;background:#1e293b;box-shadow:0 2px 8px #0000004d}.dark-mode .notification-title h3{color:#e2e8f0}.dark-mode .notification-item.unread{background:#334155}.dark-mode .notification-item.read{background:#1e293b}.dark-mode .notification-message{color:#e2e8f0}.dark-mode .notification-summary{background:#1e3a52}.dark-mode .notification-summary p{color:#e2e8f0}.dark-mode .clear-btn{color:#cbd5e1;border-color:#475569}.dark-mode .clear-btn:hover{background:#334155}.webhook-status-notification{text-align:center;color:#5865f2;background:#5865f21a;border:1px solid #5865f24d;border-radius:6px;margin-bottom:1rem;padding:.75rem;font-size:.9rem;font-weight:500;animation:.3s slideDown}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.dark-mode .webhook-status-notification{color:#8b9cf2;background:#5865f233}.dark-mode-toggle{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;cursor:pointer;z-index:5000;background:#fff3;border:2px solid #ffffff4d;border-radius:50%;outline:none;justify-content:center;align-items:center;width:50px;height:50px;transition:all .3s;display:flex;position:fixed!important;top:2rem!important;right:2rem!important}.dark-mode-toggle:hover{background:#ffffff4d;transform:scale(1.1)}.dark-mode-toggle:active{outline:none;transform:scale(.95)}.dark-mode-toggle:focus{box-shadow:none;outline:none}@media (max-width:768px){.dark-mode-toggle{width:45px;height:45px;top:1rem;right:1rem}}.login-container{background:linear-gradient(#e0f2fe 0%,#f0f9ff 50%,#fff 100%);justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.clouds,.cloud{display:none}.cloud:before,.cloud:after{content:"";background:#fff;border-radius:100px;position:absolute}.cloud1{width:200px;height:60px;animation:25s linear infinite moveCloud1;top:20%;left:-200px}.cloud1:before{width:80px;height:80px;top:-40px;left:30px}.cloud1:after{width:100px;height:100px;top:-50px;right:30px}.cloud2{width:150px;height:50px;animation:30s linear 5s infinite moveCloud2;top:40%;left:-150px}.cloud2:before{width:60px;height:60px;top:-30px;left:20px}.cloud2:after{width:70px;height:70px;top:-35px;right:20px}.cloud3{width:120px;height:40px;animation:20s linear 10s infinite moveCloud3;top:60%;left:-120px}.cloud3:before{width:50px;height:50px;top:-25px;left:15px}.cloud3:after{width:60px;height:60px;top:-30px;right:15px}.cloud4{width:180px;height:55px;animation:35s linear 15s infinite moveCloud4;top:15%;left:-180px}.cloud4:before{width:70px;height:70px;top:-35px;left:25px}.cloud4:after{width:90px;height:90px;top:-45px;right:25px}.cloud5{width:140px;height:45px;animation:28s linear 7s infinite moveCloud5;top:50%;left:-140px}.cloud5:before{width:55px;height:55px;top:-28px;left:18px}.cloud5:after{width:65px;height:65px;top:-32px;right:18px}@keyframes moveCloud1{0%{opacity:0;left:-200px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 200px)}}@keyframes moveCloud2{0%{opacity:0;left:-150px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 150px)}}@keyframes moveCloud3{0%{opacity:0;left:-200px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 200px)}}@keyframes moveCloud4{0%{opacity:0;left:-160px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 160px)}}@keyframes moveCloud5{0%{opacity:0;left:-180px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 180px)}}.login-box{z-index:10;padding:var(--spacing-3xl);min-width:400px;max-width:450px;transition:all var(--transition-base);background:#fff;border:1px solid #0000000d;border-radius:16px;position:relative;box-shadow:0 4px 20px #0000001f,0 2px 4px #00000014}.login-box:hover{transform:translateY(-2px);box-shadow:0 8px 30px #00000026,0 4px 8px #0000001a}.login-box h1{margin:0 0 var(--spacing-3xl)0;text-align:center;color:var(--color-primary);font-size:2.5rem;font-weight:var(--font-weight-bold);padding-bottom:var(--spacing-lg);position:relative}.login-box h1:after{content:"";background:linear-gradient(90deg,var(--color-primary)0%,var(--color-accent)100%);border-radius:var(--radius-full);width:60px;height:4px;position:absolute;bottom:0;left:50%;transform:translate(-50%)}.login-form{gap:var(--spacing-lg);flex-direction:column;display:flex}.input-group{gap:var(--spacing-sm);flex-direction:column;display:flex}.input-group label{color:var(--color-text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding-left:var(--spacing-xs)}.input-group input{padding:var(--spacing-md)var(--spacing-lg);border-radius:var(--radius-lg);font-size:var(--font-size-base);transition:all var(--transition-fast);color:var(--color-text-primary);background:#fffc;border:2px solid #0000001a;box-shadow:0 2px 4px #0000000d}.input-group input:focus{border-color:var(--color-primary);background:#fff;outline:none;transform:translateY(-1px);box-shadow:0 0 0 4px #2563eb26,0 2px 8px #0000001a}.input-group input::placeholder{color:var(--color-text-tertiary)}.button-group{gap:var(--spacing-md);margin-top:var(--spacing-md);display:flex}.login-button,.signup-button{padding:var(--spacing-md)var(--spacing-xl);border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-bold);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:none;flex:1;position:relative;overflow:hidden}.login-button{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-primary-dark)100%);color:#fff;box-shadow:0 4px 12px #2563eb66}.login-button:hover{background:linear-gradient(135deg,var(--color-primary-dark)0%,var(--color-primary-darker)100%);transform:translateY(-2px);box-shadow:0 6px 20px #2563eb80}.login-button:active{transform:translateY(0);box-shadow:0 4px 12px #2563eb66}.signup-button{background:linear-gradient(135deg,var(--color-success)0%,#059669 100%);color:#fff;box-shadow:0 4px 12px #10b98166}.signup-button:hover{background:linear-gradient(135deg,#059669 0%,#047857 100%);transform:translateY(-2px);box-shadow:0 6px 20px #10b98180}.signup-button:active{transform:translateY(0);box-shadow:0 4px 12px #10b98166}.back-button{width:100%;padding:var(--spacing-md)var(--spacing-lg);color:var(--color-text-secondary);border-radius:var(--radius-lg);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);margin-top:var(--spacing-md);background:#0000000d;border:2px solid #0000001a}.back-button:hover{color:var(--color-text-primary);background:#00000014;border-color:#00000026;transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.back-button:active{transform:translateY(0);box-shadow:0 2px 4px #0000001a}@media (max-width:480px){.login-box{min-width:300px;max-width:90vw;padding:var(--spacing-xl)}.login-box h1{font-size:var(--font-size-2xl)}.button-group{flex-direction:column}.login-button,.signup-button{width:100%}}.settings-overlay{z-index:9999;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:linear-gradient(135deg,#4a90e24d 0%,#87ceeb33 50%,#0009 100%);justify-content:center;align-items:flex-start;padding-top:5vh;animation:.2s fadeIn;display:flex;position:fixed;inset:0;overflow-y:auto}.settings-container{background:#fff;border-radius:20px;flex-direction:column;width:90%;max-width:600px;max-height:85vh;margin-bottom:5vh;animation:.3s slideUp;display:flex;position:relative;overflow:hidden;box-shadow:0 20px 60px #0000004d,0 0 0 1px #4a90e21a}.settings-container:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle at 30% 20%,#4a90e214,#0000 60%),radial-gradient(circle at 70% 80%,#87ceeb0f,#0000 60%);height:200px;position:absolute;top:0;left:0;right:0}.dark-mode .settings-container{color:#fff;background:#1e293b;box-shadow:0 20px 60px #00000080,0 0 0 1px #4a90e233}.dark-mode .settings-container:before{background:radial-gradient(circle at 30% 20%,#4a90e226,#0000 60%),radial-gradient(circle at 70% 80%,#87ceeb1a,#0000 60%)}.settings-header{z-index:1;flex-shrink:0;position:relative}.settings-content{z-index:1;flex:1;min-height:0;position:relative}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.settings-header{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-primary-light)100%);color:#fff;border-bottom:1px solid #0000001a;justify-content:space-between;align-items:center;gap:1rem;padding:1.5rem;display:flex}.dark-mode .settings-header{background:linear-gradient(135deg,#334155 0%,#1e293b 100%);border-bottom-color:#ffffff1a}.settings-header h2{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;margin:0;font-size:1.5rem;font-weight:700;overflow:hidden}.close-btn{cursor:pointer;z-index:10;background:#ffffff40;border:2px solid #fff6;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:40px;min-width:40px;height:40px;padding:0;transition:all .2s;display:flex;position:relative;color:#fff!important}.close-btn svg{stroke:#fff!important;stroke-width:3px!important;fill:none!important;color:#fff!important;opacity:1!important;width:24px!important;height:24px!important}.close-btn:hover{background:#fff6;border-color:#fff9;transform:scale(1.05)}.close-btn:active{transform:scale(.95)}.settings-content{background:linear-gradient(#4a90e205,#0000);padding:1.5rem;overflow-y:auto}.dark-mode .settings-content{background:linear-gradient(#4a90e20d,#0000)}.settings-section,.Requirements-settings-section{background:#fff;border:1px solid #4a90e21a;border-radius:16px;margin-bottom:1.5rem;padding:1.5rem;transition:all .3s;box-shadow:0 2px 8px #0000000f}.settings-section:hover,.Requirements-settings-section:hover{border-color:#4a90e233;transform:translateY(-2px);box-shadow:0 4px 16px #4a90e226}.dark-mode .settings-section,.dark-mode .Requirements-settings-section{background:#2d3748;border-color:#4a90e233;box-shadow:0 2px 8px #0003}.dark-mode .settings-section:hover,.dark-mode .Requirements-settings-section:hover{border-color:#4a90e266;box-shadow:0 4px 16px #4a90e24d}.settings-section:last-child{margin-bottom:0}.section-header{border-bottom:2px solid #4a90e21a;align-items:center;gap:.75rem;margin-bottom:1.25rem;padding-bottom:.75rem;display:flex}.dark-mode .section-header{border-bottom-color:#4a90e233}.section-header svg{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-primary-light)100%);color:#fff;border-radius:10px;width:24px;height:24px;padding:8px;box-shadow:0 2px 8px #2563eb4d}.dark-mode .section-header svg{background:linear-gradient(135deg,var(--color-primary-light)0%,var(--color-primary-lighter)100%)}.section-header h3{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-primary-light)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0;font-size:1.2rem;font-weight:700}.dark-mode .section-header h3{background:linear-gradient(135deg,var(--color-primary-light)0%,var(--color-primary-lighter)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.setting-item{margin-bottom:1rem}.setting-item:last-child{margin-bottom:0}.setting-item label{color:#333;margin-bottom:.5rem;font-size:.9rem;font-weight:500;display:block}.dark-mode .setting-item label{color:#e2e8f0}.setting-item input[type=text],.setting-item input[type=email],.setting-item select{background:#4a90e208;border:2px solid #4a90e233;border-radius:10px;width:100%;padding:.875rem 1rem;font-size:1rem;font-weight:500;transition:all .3s}.setting-item input[type=text]:hover,.setting-item input[type=email]:hover,.setting-item select:hover{background:#4a90e20d;border-color:#4a90e266}.dark-mode .setting-item input[type=text],.dark-mode .setting-item input[type=email],.dark-mode .setting-item select{color:#fff;background:#4a90e21a;border-color:#4a90e24d}.dark-mode .setting-item input[type=text]:hover,.dark-mode .setting-item input[type=email]:hover,.dark-mode .setting-item select:hover{background:#4a90e226;border-color:#4a90e280}.setting-item input:focus,.setting-item select:focus{background:#fff;border-color:#4a90e2;outline:none;transform:translateY(-1px);box-shadow:0 0 0 4px #4a90e226}.dark-mode .setting-item input:focus,.dark-mode .setting-item select:focus{background:#4a90e233}.setting-item input:disabled{color:#999;cursor:not-allowed;background:#0000000d}.dark-mode .setting-item input:disabled{color:#64748b;background:#ffffff0d}.toggle-item{background:linear-gradient(135deg,#4a90e214 0%,#87ceeb14 100%);border:2px solid #4a90e226;border-radius:12px;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding:1rem 1.25rem;transition:all .3s;display:flex}.toggle-item:hover{background:linear-gradient(135deg,#4a90e21f 0%,#87ceeb1f 100%);border-color:#4a90e24d;transform:translate(4px);box-shadow:0 2px 8px #4a90e21a}.dark-mode .toggle-item{background:linear-gradient(135deg,#4a90e226 0%,#87ceeb1a 100%);border-color:#4a90e240}.dark-mode .toggle-item:hover{background:linear-gradient(135deg,#4a90e233 0%,#87ceeb26 100%);border-color:#4a90e266}.toggle-label{flex:1}.toggle-label span{color:#333;margin-bottom:.25rem;font-weight:500;display:block}.dark-mode .toggle-label span{color:#fff}.toggle-description{color:#666;margin:0;font-size:.85rem}.dark-mode .toggle-description{color:#94a3b8}.toggle-switch{flex-shrink:0;width:56px;height:30px;display:inline-block;position:relative}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{cursor:pointer;background-color:#cbd5e1;border-radius:34px;transition:all .4s cubic-bezier(.4,0,.2,1);position:absolute;inset:0;box-shadow:inset 0 2px 4px #0000001a}.toggle-slider:hover{background-color:#b0bec5}.toggle-slider:before{content:"";background-color:#fff;border-radius:50%;width:22px;height:22px;transition:all .4s cubic-bezier(.4,0,.2,1);position:absolute;bottom:4px;left:4px;box-shadow:0 2px 6px #0003}.toggle-switch input:checked+.toggle-slider{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-primary-light)100%);box-shadow:inset 0 2px 4px #00000026,0 0 12px #2563eb66}.toggle-switch input:checked+.toggle-slider:before{transform:translate(26px);box-shadow:0 2px 8px #0000004d}.toggle-switch input:focus+.toggle-slider{box-shadow:0 0 0 4px #4a90e233}.save-btn{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-primary-light)100%);color:#fff;cursor:pointer;border:none;border-radius:12px;width:100%;margin-top:1rem;padding:1rem;font-size:1rem;font-weight:700;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 4px 12px #2563eb4d}.save-btn:before{content:"";background:linear-gradient(90deg,#0000,#ffffff4d,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.save-btn:hover:before{left:100%}.save-btn:hover{transform:translateY(-3px);box-shadow:0 6px 20px #2563eb80}.save-btn:active{transform:translateY(-1px);box-shadow:0 2px 8px #2563eb4d}.danger-btn{color:#dc2626;cursor:pointer;z-index:1;background:0 0;border:2px solid #dc2626;border-radius:12px;width:100%;margin-top:1rem;padding:1rem;font-size:1rem;font-weight:700;transition:all .3s;position:relative;overflow:hidden}.danger-btn:before{content:"";transform-origin:bottom;z-index:-1;background:#dc2626;border-radius:10px;width:100%;height:100%;transition:transform .3s;position:absolute;top:0;left:0;transform:scaleY(0)}.danger-btn:hover:before{transform:scaleY(1)}.danger-btn:hover{color:#fff;transform:translateY(-3px);box-shadow:0 4px 16px #dc262666}.danger-btn:active{transform:translateY(-1px)}.webhook-status{border-radius:10px;align-items:center;gap:.5rem;margin-top:.75rem;padding:.875rem 1rem;font-size:.9rem;font-weight:600;animation:.3s slideIn;display:flex}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.webhook-status.success{color:#16a34a;background:linear-gradient(135deg,#22c55e26 0%,#22c55e1a 100%);border:2px solid #22c55e66;box-shadow:0 2px 8px #22c55e26}.webhook-status.success:before{content:"✓";font-size:1.2rem;font-weight:700}.webhook-status.error{color:#dc2626;background:linear-gradient(135deg,#ef444426 0%,#ef44441a 100%);border:2px solid #ef444466;box-shadow:0 2px 8px #ef444426}.webhook-status.error:before{content:"⚠";font-size:1.2rem}.dark-mode .webhook-status.success{color:#4ade80;background:linear-gradient(135deg,#22c55e40 0%,#22c55e26 100%);border-color:#22c55e80}.dark-mode .webhook-status.error{color:#f87171;background:linear-gradient(135deg,#ef444440 0%,#ef444426 100%);border-color:#ef444480}.settings-content::-webkit-scrollbar{width:8px}.settings-content::-webkit-scrollbar-track{background:#4a90e20d;border-radius:10px}.settings-content::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#4a90e2 0%,#87ceeb 100%);border-radius:10px}.settings-content::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#3a7bc8 0%,#6fb8d8 100%)}.dark-mode .settings-content::-webkit-scrollbar-track{background:#4a90e21a}.dark-mode .settings-content::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#5b9fd8 0%,#7ec8e3 100%)}.setting-item select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%234A90E2' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-position:right 1rem center;background-repeat:no-repeat;background-size:12px;padding-right:2.5rem}.setting-item select:hover{transform:none!important}.setting-item select:hover,.setting-item select:focus{background-position:right 1rem center}.dark-mode .setting-item select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2387CEEB' d='M6 9L1 4h10z'/%3E%3C/svg%3E")}@media (max-width:768px){.settings-container{border-radius:16px;width:95%;max-height:90vh}.settings-content,.settings-header{padding:1rem}.settings-header h2{font-size:1.25rem}.settings-section,.Requirements-settings-section{padding:1.25rem}.section-header svg{width:20px;height:20px;padding:6px}.section-header h3{font-size:1.1rem}}.app{min-height:100vh;padding:var(--spacing-2xl);transition:background var(--transition-base);filter:contrast(1.02);background:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.03'/%3E%3C/svg%3E"),radial-gradient(at 50% 15%,#ffeda080 0%,#fff8dc4d 20%,#0000 45%),radial-gradient(at 80% 30%,#ffffff4d 0%,#0000 40%),radial-gradient(at 20% 40%,#ffffff40 0%,#0000 35%),linear-gradient(#4a9fd8 0%,#6eb3e0 15%,#8dc5ea 30%,#b8dcf3 50%,#d8ebf8 70%,#edf5fa 85%,#f8fbfd 100%);position:relative;overflow-x:hidden}.app:before{content:"";pointer-events:none;z-index:0;background:linear-gradient(#0000 0%,#ffffff1a 40%,#ffffff4d 70%,#ffffff80 100%);position:absolute;inset:0}.app.dark-mode{filter:contrast(1.08)brightness(.98);background:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E"),radial-gradient(at 85% 12%,#93c5fd33 0%,#93c5fd14 25%,#0000 45%),radial-gradient(#5865f20d 0%,#0000 50%),radial-gradient(circle at 15% 20%,#ffffff0a 0%,#0000 8%),radial-gradient(circle at 75% 35%,#ffffff08 0%,#0000 6%),radial-gradient(circle at 35% 60%,#ffffff09 0%,#0000 9%),radial-gradient(circle at 90% 75%,#ffffff06 0%,#0000 7%),linear-gradient(#050a1e 0%,#0c1428 20%,#0f172a 40%,#1a1f3a 60%,#1e293b 80%,#27374d 100%)}.app.dark-mode:before{background:linear-gradient(#0000 0%,#0f172a33 40%,#0f172a66 70%,#0f172a99 100%)}.app .sun{display:none}@keyframes sunGlow{0%,to{box-shadow:0 0 40px #ffd70099,0 0 80px #ffd70066,0 0 120px #ffd70033}50%{box-shadow:0 0 50px #ffd700b3,0 0 100px #ffd70080,0 0 150px #ffd7004d}}@keyframes sunPulse{0%,to{opacity:.8;transform:translate(-50%,-50%)scale(1)}50%{opacity:.6;transform:translate(-50%,-50%)scale(1.1)}}.app .cloud{pointer-events:none;z-index:1;will-change:transform;filter:blur(2px);opacity:.6;position:fixed}.app .cloud:before{content:"";background:#fffc;border-radius:50%;position:absolute;box-shadow:0 0 20px #ffffff80,0 0 40px #ffffff4d}.app .cloud:after{content:"";background:#ffffffb3;border-radius:50%;position:absolute;box-shadow:0 0 15px #fff6}.app.dark-mode .cloud{opacity:.3;filter:blur(3px)}.app.dark-mode .cloud:before{background:#c8dcf04d;box-shadow:0 0 25px #c8dcf033,0 0 50px #c8dcf01a}.app.dark-mode .cloud:after{background:#b4c8dc40;box-shadow:0 0 20px #b4c8dc26}.app .cloud1{width:120px;height:120px;animation:50s linear infinite moveCloud1;top:15%;left:-150px}.app .cloud1:before{width:120px;height:120px;top:0;left:0}.app .cloud1:after{width:80px;height:80px;top:20px;left:70px}.app .cloud2{width:100px;height:100px;animation:45s linear 8s infinite moveCloud2;top:35%;left:-120px}.app .cloud2:before{width:100px;height:100px;top:0;left:0}.app .cloud2:after{width:70px;height:70px;top:15px;left:60px}.app .cloud3{width:140px;height:140px;animation:55s linear 15s infinite moveCloud3;top:55%;left:-160px}.app .cloud3:before{width:140px;height:140px;top:0;left:0}.app .cloud3:after{width:90px;height:90px;top:25px;left:80px}.app .cloud4{width:110px;height:110px;animation:48s linear 22s infinite moveCloud4;top:20%;left:-130px}.app .cloud4:before{width:110px;height:110px;top:0;left:0}.app .cloud4:after{width:75px;height:75px;top:18px;left:65px}.app .cloud5{width:130px;height:130px;animation:52s linear 10s infinite moveCloud5;top:45%;left:-150px}.app .cloud5:before{width:130px;height:130px;top:0;left:0}.app .cloud5:after{width:85px;height:85px;top:22px;left:75px}.app .cloud6{width:95px;height:95px;animation:42s linear 5s infinite moveCloud6;top:30%;left:-110px}.app .cloud6:before{width:95px;height:95px;top:0;left:0}.app .cloud6:after{width:65px;height:65px;top:15px;left:55px}.app .cloud7{width:150px;height:150px;animation:58s linear 18s infinite moveCloud7;top:25%;left:-170px}.app .cloud7:before{width:150px;height:150px;top:0;left:0}.app .cloud7:after{width:100px;height:100px;top:28px;left:85px}.app .cloud8{width:115px;height:115px;animation:46s linear 12s infinite moveCloud8;top:50%;left:-135px}.app .cloud8:before{width:115px;height:115px;top:0;left:0}.app .cloud8:after{width:78px;height:78px;top:19px;left:68px}.app .cloud9{width:105px;height:105px;animation:44s linear 25s infinite moveCloud9;top:40%;left:-125px}.app .cloud9:before{width:105px;height:105px;top:0;left:0}.app .cloud9:after{width:72px;height:72px;top:17px;left:62px}.app .cloud10{width:125px;height:125px;animation:50s linear 30s infinite moveCloud10;top:28%;left:-145px}.app .cloud10:before{width:125px;height:125px;top:0;left:0}.app .cloud10:after{width:82px;height:82px;top:21px;left:72px}@keyframes moveCloud6{0%{opacity:0;left:-140px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 140px)}}@keyframes moveCloud7{0%{opacity:0;left:-200px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 200px)}}@keyframes moveCloud8{0%{opacity:0;left:-170px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 170px)}}@keyframes moveCloud9{0%{opacity:0;left:-150px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 150px)}}@keyframes moveCloud10{0%{opacity:0;left:-180px}3%{opacity:.6}97%{opacity:.6}to{opacity:0;left:calc(100% + 180px)}}.app-header,.app-main,.dark-mode-toggle{z-index:10;isolation:isolate;position:relative}.app-header{color:#fff;margin-bottom:var(--spacing-xl);z-index:4000;justify-content:space-between;align-items:center;display:flex;position:relative}.profile-icon{border-radius:var(--radius-full);cursor:pointer;width:56px;height:56px;transition:all var(--transition-fast);-webkit-backdrop-filter:blur(20px)saturate(180%);z-index:3000;box-shadow:var(--shadow-md),inset 0 1px 1px #ffffff80;background:#ffffff40;border:2px solid #ffffff80;justify-content:center;align-items:center;display:flex;position:relative}.profile-icon:hover{box-shadow:var(--shadow-lg),inset 0 1px 1px #fff9,0 0 20px #ffffff4d;-webkit-backdrop-filter:blur(24px)saturate(200%);background:#ffffff59;border-color:#ffffffb3;transform:scale(1.1)}.profile-icon:active{transform:scale(1.05)}.header-content{text-align:center;flex:1}.header-content h1{justify-content:center;align-items:center;gap:var(--spacing-md);margin:0 0 var(--spacing-sm)0;font-size:var(--font-size-4xl);font-weight:var(--font-weight-bold);text-shadow:0 2px 4px #0000001a;display:flex}.header-content p{font-size:var(--font-size-lg);opacity:.95;font-weight:var(--font-weight-medium);text-shadow:0 1px 2px #0000001a;margin:0}.profile-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(20px)saturate(180%);border-radius:var(--radius-xl);box-shadow:var(--shadow-2xl),inset 0 1px 1px #ffffff4d,0 0 40px #0000001a;padding:var(--spacing-2xl);z-index:3000;min-width:300px;animation:slideDown var(--transition-base)ease;border:1px solid var(--glass-border);isolation:isolate;position:absolute;top:70px;left:0}.profile-header{text-align:center;margin-bottom:var(--spacing-lg);padding-bottom:var(--spacing-lg);border-bottom:1px solid var(--color-border)}.profile-avatar{background:linear-gradient(135deg,var(--color-primary)0%,var(--color-primary-light)100%);border-radius:var(--radius-full);width:80px;height:80px;margin:0 auto var(--spacing-md);color:#fff;box-shadow:var(--shadow-md);justify-content:center;align-items:center;display:flex}.profile-header h3{font-size:var(--font-size-xl);color:var(--color-text-primary);font-weight:var(--font-weight-bold);margin:0}.profile-info{margin-bottom:var(--spacing-lg)}.profile-info p{margin:var(--spacing-sm)0;font-size:var(--font-size-sm);color:var(--color-text-secondary)}.profile-info strong{color:var(--color-text-primary);font-weight:var(--font-weight-semibold)}.profile-actions{gap:var(--spacing-sm);flex-direction:column;display:flex}.settings-btn{width:100%;padding:var(--spacing-md);background:var(--color-bg-secondary);color:var(--color-primary);border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);justify-content:center;align-items:center;gap:var(--spacing-sm);display:flex}.settings-btn:hover{background:var(--color-bg-tertiary);border-color:var(--color-primary);box-shadow:var(--shadow-sm);transform:translateY(-2px)}.settings-btn:active{transform:translateY(0)}.logout-btn{width:100%;padding:var(--spacing-md);background:var(--color-primary);color:#fff;border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);box-shadow:var(--shadow-sm);border:none}.logout-btn:hover{background:var(--color-primary-dark);box-shadow:var(--shadow-md);transform:translateY(-2px)}.logout-btn:active{box-shadow:var(--shadow-sm);transform:translateY(0)}.app-main{max-width:1400px;margin:0 auto}.main-grid{gap:var(--spacing-2xl);margin-bottom:var(--spacing-2xl);grid-template-columns:2fr 1fr;display:grid}.weather-section,.recommendations-section{gap:var(--spacing-xl);flex-direction:column;display:flex}.calendar-section{margin-top:var(--spacing-xl)}.loading-screen,.error-screen{color:#fff;text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex}.loading-screen>:not(.cloud):not(.sun),.error-screen>:not(.cloud):not(.sun){z-index:1;position:relative}.loading-icon{z-index:1;filter:drop-shadow(var(--shadow-md));animation:2s ease-in-out infinite pulse;position:relative}.error-screen h2{margin-bottom:var(--spacing-lg);font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);text-shadow:0 2px 4px #0003}.error-screen p{margin-bottom:var(--spacing-2xl);opacity:.9;font-size:var(--font-size-lg)}.retry-btn{padding:var(--spacing-md)var(--spacing-2xl);color:var(--color-primary);border-radius:var(--radius-md);font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);cursor:pointer;transition:all var(--transition-fast);box-shadow:var(--shadow-md);background:#fff;border:none}.retry-btn:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.retry-btn:active{box-shadow:var(--shadow-md);transform:translateY(0)}@media (max-width:1024px){.main-grid{gap:var(--spacing-lg);grid-template-columns:1fr}.app{padding:var(--spacing-lg)}}@media (max-width:768px){.app{padding:var(--spacing-md)}.header-content h1{font-size:var(--font-size-3xl)}.header-content p{font-size:var(--font-size-base)}.profile-icon{width:40px;height:40px}.profile-icon svg{width:20px;height:20px}.profile-panel{min-width:240px;padding:var(--spacing-lg)}.profile-avatar{width:60px;height:60px}.profile-avatar svg{width:28px;height:28px}}@media (max-width:480px){.app{padding:var(--spacing-sm)}.header-content h1{font-size:var(--font-size-2xl)}.header-content p{font-size:var(--font-size-sm)}}