:root{--primary:linear-gradient(135deg, #667eea 0%, #764ba2 100%);--secondary:linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--tertiary:linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);--success:linear-gradient(135deg, #11998e 0%, #38ef7d 100%);--dark:linear-gradient(135deg, #0c0c0c 0%, #1a1a1a 50%, #0f0f0f 100%);--glass:rgba(255, 255, 255, 0.1);--glass-border:rgba(255, 255, 255, 0.2);--text-primary:#ffffff;--text-secondary:#b3b3cc;--text-muted:#888899;--shadow:0 25px 50px -12px rgba(0, 0, 0, 0.5)}*{margin:0;padding:0;box-sizing:border-box}*{will-change:auto}.result-card,.tag,a,button,input,select{touch-action:manipulation}.result-card,.tag,.timezone-marker,button{user-select:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.main{contain:layout style}.result-card{contain:layout style paint}.dropdown-list{contain:layout style}.btn,.result-card,.tag,button{transform:translateZ(0);backface-visibility:hidden}img{loading:lazy;decoding:async}.result-card:hover{will-change:transform}html{margin:0;padding:0}body{font-family:Inter,sans-serif;background:var(--dark);color:var(--text-primary);min-height:100vh;overflow-x:auto;margin:0;padding:0}body::before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at 20% 80%,rgba(102,126,234,.15) 0,transparent 50%),radial-gradient(circle at 80% 20%,rgba(240,147,251,.15) 0,transparent 50%);pointer-events:none;animation:glow 20s ease-in-out infinite}@keyframes glow{0%,100%{opacity:1}50%{opacity:.8}}.container{max-width:1400px;margin:0 auto;padding:25px;position:relative;z-index:1}.header{background:var(--glass);backdrop-filter:blur(30px);border:1px solid var(--glass-border);border-radius:24px;padding:25px 35px;margin-bottom:25px;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow);flex-wrap:wrap;gap:20px}.header-left{display:flex;align-items:center;gap:20px}.header h1{font-size:2.2rem;font-weight:800;background:var(--primary);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;display:flex;align-items:center;gap:12px}.quick-actions{display:flex;gap:8px}.quick-btn{padding:6px 12px;background:var(--glass);border:1px solid var(--glass-border);border-radius:8px;color:var(--text-primary);font-size:.8rem;cursor:pointer;transition:all .3s ease;border:none}.quick-btn:hover{background:var(--primary);transform:translateY(-1px)}.controls{display:flex;gap:15px;align-items:center;flex-wrap:wrap}.toggle{display:flex;align-items:center;gap:8px}.switch{position:relative;width:50px;height:26px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,.2);border-radius:26px;transition:.3s}.slider:before{position:absolute;content:"";height:18px;width:18px;left:4px;bottom:4px;background:#fff;border-radius:50%;transition:.3s}input:checked+.slider{background:var(--tertiary)}input:checked+.slider:before{transform:translateX(24px)}.panel-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:15px}.panel-header h2{margin:0;flex-shrink:0}.favorites-dropdown-container{display:flex;align-items:center;gap:8px;flex-shrink:0}.favorites-dropdown{min-width:250px;max-width:350px;padding:8px 12px;background:var(--glass);border:2px solid var(--glass-border);border-radius:8px;color:var(--text-primary);font-size:.85rem;font-weight:500;cursor:pointer;transition:all .3s ease;backdrop-filter:blur(10px)}.favorites-dropdown:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px rgba(99,102,241,.1)}.favorites-dropdown option{background:var(--bg-primary);color:var(--text-primary);padding:8px}.favorite-manage-btn{padding:8px;background:var(--accent);border:none;border-radius:8px;color:#fff;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;min-width:32px;font-size:.75rem}.favorite-manage-btn:hover{background:#6366f1;transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,.3)}.favorites-list{max-height:400px;overflow-y:auto;margin:20px 0}.favorite-item{display:flex;align-items:center;justify-content:space-between;padding:15px;background:var(--glass);border:1px solid var(--glass-border);border-radius:12px;margin-bottom:10px;transition:all .3s ease}.favorite-item:hover{border-color:var(--accent);transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,.1)}.favorite-info{flex:1}.favorite-name{font-weight:600;color:var(--text-primary);margin-bottom:5px}.favorite-details{font-size:.85rem;color:var(--text-secondary)}.favorite-actions{display:flex;gap:8px}.favorite-load-btn{padding:6px 12px;background:var(--success);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.8rem;transition:all .3s ease}.favorite-load-btn:hover{background:#10b981;transform:translateY(-1px)}.favorite-delete-btn{padding:6px 12px;background:var(--danger);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.8rem;transition:all .3s ease}.favorite-delete-btn:hover{background:#dc2626;transform:translateY(-1px)}.favorite-star-btn{padding:8px;background:var(--accent);border:none;border-radius:8px;color:#fff;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;min-width:32px;font-size:.85rem}.favorite-star-btn:hover{background:#6366f1;transform:translateY(-1px);box-shadow:0 4px 12px rgba(99,102,241,.3)}.favorite-star-btn.active{background:#f59e0b;color:#fff}.favorite-star-btn.active:hover{background:#d97706}.favorite-star-btn.disabled{background:var(--text-muted);cursor:not-allowed;transform:none;box-shadow:none}.timezone-map-container{background:var(--glass);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:16px;padding:20px;margin-top:20px;box-shadow:var(--shadow)}.map-header{text-align:center;margin-bottom:20px}.map-header h3{font-size:1.3rem;font-weight:700;color:var(--text-primary);margin-bottom:5px;display:flex;align-items:center;justify-content:center;gap:10px}.map-header p{color:var(--text-muted);font-size:.9rem}.world-map{width:100%;height:320px;background:#222;border-radius:12px;position:relative;overflow:hidden;margin-bottom:20px;display:flex;align-items:center;justify-content:center}.world-map img{width:100%;height:100%;object-fit:contain;display:block}.timezone-marker{position:absolute;transform:translate(-50%,-100%);z-index:10;pointer-events:auto;display:flex;flex-direction:column;align-items:center;min-width:100px;max-width:160px}.marker-pin{width:12px;height:12px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.3);margin-bottom:8px;position:relative}.marker-pin::after{content:"";position:absolute;bottom:-8px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #fff}.marker-content{background:rgba(255,255,255,.95);border-radius:12px;padding:8px 12px;box-shadow:0 4px 16px rgba(0,0,0,.15);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);text-align:center;min-width:100px;transition:all .3s ease}.source-marker .marker-pin{background:linear-gradient(135deg,#1976d2,#1565c0)}.target-marker .marker-pin{background:linear-gradient(135deg,#e53935,#d32f2f)}.marker-name{font-weight:700;color:#2c3e50;font-size:11px;margin-bottom:3px;text-transform:uppercase;letter-spacing:.5px}.marker-time{font-size:10px;color:#7f8c8d;font-weight:500;font-family:"Courier New",monospace}.timezone-marker:hover .marker-content{transform:scale(1.05);box-shadow:0 6px 20px rgba(0,0,0,.2)}.timezone-marker:hover .marker-pin{transform:scale(1.1)}.map-legend{display:flex;justify-content:center;gap:20px;flex-wrap:wrap}.legend-item{display:flex;align-items:center;gap:8px;font-size:.85rem;color:var(--text-secondary)}.legend-color{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.3)}.main{display:grid;grid-template-columns:1fr 2fr;gap:25px}.panel{background:var(--glass);backdrop-filter:blur(30px);border:1px solid var(--glass-border);border-radius:20px;padding:25px;box-shadow:var(--shadow)}.panel:first-child{border-top:2px solid rgba(102,126,234,.3);border-top-left-radius:20px;border-top-right-radius:20px}.panel h2{font-size:1.4rem;margin-bottom:20px;font-weight:700;display:flex;align-items:center;gap:10px}.search-container{position:relative;margin-bottom:15px}.search-box{width:100%;padding:12px 40px 12px 15px;background:rgba(255,255,255,.05);border:2px solid var(--glass-border);border-radius:12px;color:var(--text-primary);font-size:.95rem;outline:0;transition:all .3s ease}.search-box:focus{border-color:#4facfe;box-shadow:0 0 0 3px rgba(79,172,254,.2)}.search-icon{position:absolute;right:15px;top:50%;transform:translateY(-50%);color:var(--text-muted)}.dropdown{position:relative}.dropdown-list{position:absolute;top:100%;left:0;right:0;background:rgba(20,20,30,.95);backdrop-filter:blur(30px);border:1px solid var(--glass-border);border-radius:12px;max-height:250px;overflow-y:auto;z-index:1000;display:none;box-shadow:var(--shadow)}.dropdown-item{padding:12px 15px;cursor:pointer;transition:all .2s ease;border-bottom:1px solid rgba(255,255,255,.05);display:flex;justify-content:space-between;align-items:center}.dropdown-item:hover{background:var(--primary)}.dropdown-item-main{display:flex;flex-direction:column}.dropdown-item-name{font-weight:600;color:var(--text-primary)}.dropdown-item-country{font-size:.8rem;color:var(--text-muted)}.dropdown-item-actions{display:flex;gap:8px;align-items:center}.dropdown-item-offset{font-size:.75rem;color:var(--text-muted);background:rgba(255,255,255,.1);padding:2px 6px;border-radius:4px}.tags{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;min-height:40px}.tag{background:var(--primary);padding:8px 15px;border-radius:20px;display:flex;align-items:center;gap:8px;font-size:.9rem;font-weight:600;animation:slideIn .3s ease;cursor:grab;user-select:none;transition:all .2s ease}.tag:active{cursor:grabbing}.tag.dragging{opacity:.5;transform:rotate(5deg)}.tag .remove{background:rgba(255,255,255,.3);border:none;border-radius:50%;width:20px;height:20px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.tag .remove:hover{background:rgba(255,100,100,.7)}@keyframes slideIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.sliders{margin-top:20px}.slider-group{margin-bottom:20px;padding:18px;background:rgba(255,255,255,.03);border-radius:15px;border:1px solid rgba(255,255,255,.05);transition:all .3s ease;position:relative}.slider-group:hover{background:rgba(255,255,255,.05)}.slider-group.active{background:rgba(79,172,254,.08);border-color:rgba(79,172,254,.4);box-shadow:0 0 20px rgba(79,172,254,.2)}.slider-group.active::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--tertiary);border-radius:2px}.slider-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.slider-name{font-weight:500;color:var(--text-secondary);display:flex;align-items:center;gap:8px}.slider-name .active-indicator{width:8px;height:8px;border-radius:50%;background:var(--tertiary);opacity:0;transition:opacity .3s ease}.slider-group.active .slider-name .active-indicator{opacity:1}.slider-time{font-size:1.2rem;font-weight:700;background:var(--tertiary);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.favorite-item{background:var(--glass);border:1px solid var(--glass-border);border-radius:12px;padding:12px;cursor:pointer;transition:all .3s ease;margin-bottom:12px;position:relative}.favorite-item:hover{background:rgba(255,255,255,.1);transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,.2)}.favorite-name{font-weight:600;color:var(--text-primary);font-size:14px}.slider-datetime{display:grid;grid-template-columns:2fr 1fr;gap:10px;margin-bottom:12px}.slider-datetime-input{width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:6px;color:var(--text-primary);font-weight:500;text-align:center;outline:0;transition:all .3s ease;font-size:.8rem;padding:6px 4px}.time-slider{width:100%;height:8px;border-radius:4px;background:linear-gradient(90deg,rgba(102,126,234,.3) 0,rgba(240,147,251,.3) 50%,rgba(79,172,254,.3) 100%);outline:0;appearance:none;cursor:pointer;margin-bottom:10px;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overscroll-behavior:none}.slider-group{overscroll-behavior:none;touch-action:none}.time-slider::-webkit-slider-thumb{appearance:none;width:20px;height:20px;border-radius:50%;background:var(--primary);cursor:pointer;box-shadow:0 2px 10px rgba(102,126,234,.5);transition:all .2s ease}.time-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.time-range{display:flex;justify-content:space-between;align-items:center;font-size:.75rem;color:var(--text-muted)}.time-range-current{background:rgba(79,172,254,.15);padding:3px 6px;border-radius:6px;color:#4facfe;font-weight:600}.table-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;flex-wrap:wrap;gap:15px}.table-title{display:flex;align-items:center;gap:10px}.table-title h3{font-size:1.3rem;font-weight:700;color:var(--text-primary);display:flex;align-items:center;gap:10px}.table-actions{display:flex;gap:8px;align-items:center}.action-btn{padding:6px 10px;background:var(--glass);border:1px solid var(--glass-border);border-radius:6px;color:var(--text-primary);font-size:.8rem;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:4px;border:none}.action-btn:hover{background:var(--primary)}.time-table-container{background:var(--glass);backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);margin-bottom:25px}.time-table{max-height:400px;overflow-y:auto}.time-table-header{display:grid;background:linear-gradient(135deg,rgba(79,172,254,.25),rgba(0,123,255,.25));border-bottom:2px solid rgba(79,172,254,.4);position:sticky;top:0;z-index:10;backdrop-filter:blur(10px);box-shadow:0 2px 10px rgba(79,172,254,.2)}.time-table-cell{padding:12px 15px;text-align:center;border-right:1px solid rgba(255,255,255,.1)}.time-table-cell:last-child{border-right:none}.time-table-header .time-table-cell{font-weight:800;color:#fff;font-size:1rem;text-shadow:0 2px 4px rgba(0,0,0,.5);letter-spacing:.5px}.time-table-row{display:grid;border-bottom:1px solid rgba(255,255,255,.05);cursor:pointer;transition:all .2s ease}.time-table-row:hover{background:rgba(255,255,255,.05)}.time-table-row.current-time{background:rgba(79,172,254,.1);border-color:rgba(79,172,254,.3)}.time-table-row .time-table-cell{padding:10px 15px;font-size:.9rem}.results{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;min-height:200px;contain:layout style}.result-card{background:var(--glass);border:1px solid var(--glass-border);border-radius:16px;padding:20px;transition:all .3s ease;cursor:pointer;position:relative;overflow:hidden}.result-card:hover{transform:translateY(-5px);border-color:#4facfe;box-shadow:0 10px 30px rgba(79,172,254,.3)}.result-header{display:flex;justify-content:space-between;margin-bottom:12px}.result-source{font-size:.85rem;color:var(--text-muted)}.result-target{font-size:.95rem;color:var(--text-secondary);font-weight:600}.result-time{font-size:1.8rem;font-weight:800;background:var(--tertiary);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.result-date{font-size:.9rem;color:var(--text-secondary);margin-bottom:10px}.result-diff{font-size:.8rem;color:#4facfe;background:rgba(79,172,254,.1);padding:4px 8px;border-radius:8px;display:inline-block}.result-country{position:absolute;bottom:8px;right:12px;color:#94a3b8;font-size:.7rem;font-weight:400;opacity:.8}.copy-alert{position:absolute;top:10px;right:10px;background:var(--secondary);color:#fff;padding:5px 10px;border-radius:10px;font-size:.8rem;opacity:0;transition:opacity .3s}.copy-alert.show{opacity:1}.loading{display:flex;justify-content:center;align-items:center;height:200px;font-size:1.2rem;color:var(--text-secondary)}.share-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.8);display:none;justify-content:center;align-items:center;z-index:2000}.share-content{background:var(--glass);backdrop-filter:blur(30px);border:1px solid var(--glass-border);border-radius:20px;padding:30px;max-width:500px;width:90%;color:var(--text-primary)}.share-url{width:100%;padding:12px;background:rgba(255,255,255,.1);border:1px solid var(--glass-border);border-radius:8px;color:var(--text-primary);margin:15px 0;font-family:monospace}@media (max-width:1024px){.main{grid-template-columns:1fr;gap:20px}.favorites-dropdown-container{flex-direction:column;gap:10px;align-items:stretch}.favorites-dropdown{width:100%}.favorite-manage-btn{width:100%;justify-content:center}}@media (max-width:768px){body{padding:10px}.container{padding:10px;margin:0;border-radius:12px}.header{padding:15px 20px;flex-direction:column;text-align:center;gap:10px}.header h1{font-size:1.6rem;margin:0}.main{grid-template-columns:1fr;gap:15px}.section-title{font-size:1.1rem;margin-bottom:15px}.search-container{width:100%}.search-input{width:100%;padding:12px 16px;font-size:16px}.tag{padding:8px 12px;font-size:.9rem}.favorite-star-btn{padding:8px 12px;font-size:.9rem}.favorites-dropdown-container{flex-direction:column;gap:8px;align-items:stretch}.favorites-dropdown{width:100%;padding:10px 12px;font-size:.9rem}.favorite-manage-btn{width:100%;padding:10px;justify-content:center;font-size:.9rem}.results{grid-template-columns:1fr;gap:12px}.result-card{padding:15px;min-height:auto}.result-header{flex-direction:column;gap:5px;text-align:left}.result-source,.result-target{font-size:.8rem}.result-time{font-size:1.8rem;margin:10px 0}.result-date{font-size:.9rem}.result-relative-time{font-size:.7rem;margin:6px 0}.result-diff{font-size:.8rem}.result-country{font-size:.8rem}.day-night-icon{font-size:1.2rem}.dst-badge{font-size:.7rem;padding:2px 6px}.day-difference{font-size:.8rem}.slider-header{flex-direction:column;gap:8px;text-align:center}.time-slider{margin:15px 0}.world-map{height:200px;border-radius:8px}.timezone-marker{min-width:60px;max-width:100px}.marker-content{padding:4px 6px;min-width:60px}.marker-name{font-size:9px}.marker-time{font-size:8px}.marker-pin{width:8px;height:8px;border-width:1px}.share-modal{padding:20px;margin:20px;max-height:calc(100vh - 40px)}.share-modal h3{font-size:1.2rem}.favorites-list{max-height:300px}.favorite-item{padding:12px}.favorite-name{font-size:.9rem}.favorite-details{font-size:.8rem}.favorite-delete-btn,.favorite-load-btn{padding:6px 12px;font-size:.8rem}}@media (max-width:480px){.container{padding:8px;border-radius:8px}.header{padding:12px 15px}.header h1{font-size:1.4rem}.section-title{font-size:1rem;margin-bottom:12px}.search-input{padding:10px 14px}.tag{padding:6px 10px;font-size:.8rem}.result-card{padding:12px}.result-time{font-size:1.6rem}.result-header{gap:3px}.result-source,.result-target{font-size:.75rem}.world-map{height:150px}.share-modal{margin:10px;padding:15px}.dropdown-list{max-height:250px;font-size:.9rem}.dropdown-item{padding:12px 16px;min-height:44px;display:flex;align-items:center}.dropdown-item:active{background:var(--glass)}}.dropdown-list::-webkit-scrollbar,.time-table::-webkit-scrollbar{width:6px}.dropdown-list::-webkit-scrollbar-track,.time-table::-webkit-scrollbar-track{background:rgba(255,255,255,.1)}.dropdown-list::-webkit-scrollbar-thumb,.time-table::-webkit-scrollbar-thumb{background:var(--primary);border-radius:3px}.dst-badge{background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1e293b;font-size:.6rem;font-weight:600;padding:2px 6px;border-radius:8px;margin-left:6px;box-shadow:0 1px 3px rgba(251,191,36,.3);text-transform:uppercase;letter-spacing:.5px}.result-time-container{display:flex;align-items:center;gap:6px;margin:4px 0}.day-night-icon{font-size:1.2rem;filter:drop-shadow(0 1px 2px rgba(0, 0, 0, .3))}.result-day-info{display:flex;justify-content:flex-end;align-items:center;margin:3px 0;font-size:.75rem}.day-difference{padding:2px 8px;border-radius:12px;font-size:.7rem;font-weight:500;border:1px solid}.day-difference.same-day{background:rgba(59,130,246,.1);color:#3b82f6;border-color:rgba(59,130,246,.2)}.day-difference.next-day{background:rgba(34,197,94,.1);color:#22c55e;border-color:rgba(34,197,94,.2)}.day-difference.previous-day{background:rgba(239,68,68,.1);color:#ef4444;border-color:rgba(239,68,68,.2)}.result-relative-time{background:linear-gradient(135deg,#667eea,#764ba2);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;font-size:.75rem;font-weight:600;margin:4px 0;letter-spacing:.5px;font-family:"SF Mono",Monaco,Inconsolata,"Roboto Mono",monospace;opacity:1;text-shadow:0 1px 2px rgba(102,126,234,.2)}.result-card{position:relative;padding:12px 16px 40px 16px;min-height:110px}.result-time{font-size:1.5rem}.result-diff{bottom:22px}