:root{color-scheme:dark;--bg: #0b0e14;--panel: #131826;--panel-2: #171d2e;--border: #262e42;--text: #e8ecf4;--text-dim: #97a1b8;--accent: #7dd3fc;--accent-2: #f2b84b;--accent-red: #e5322d;--danger: #f26161;--radius: 10px}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:Segoe UI,system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif}h1{font-size:1.5rem;margin:0 0 1rem}.page__title-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.page__title-row h1{margin:0 1rem 1rem 0}.page__title-badge{height:36px;width:auto;border-radius:6px;margin-bottom:1rem}.page__how-to-link{color:var(--accent);font-size:.85rem;font-weight:600;text-decoration:none;margin-bottom:1rem}.page__how-to-link:hover{text-decoration:underline}button{font-family:inherit}a{color:var(--accent)}.page{min-height:100%;display:flex;flex-direction:column}.page__content{flex:1;max-width:1100px;width:100%;margin:0 auto;padding:28px 20px 60px}.page__content--narrow{max-width:420px}.landing-hero{margin-bottom:32px}.landing-hero h1{font-size:2rem;margin-bottom:8px}.landing-hero p{color:var(--text-dim);font-size:1.05rem;max-width:560px}.landing-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;max-width:900px}.landing-card{display:block;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px;text-decoration:none;color:inherit;transition:border-color .15s,transform .15s}.landing-card:hover{border-color:var(--accent);transform:translateY(-2px)}.landing-card h2{font-size:1.15rem;margin:0 0 10px;color:var(--text)}.landing-card p{color:var(--text-dim);line-height:1.55;margin:0 0 16px;font-size:.92rem}.landing-card__cta{color:var(--accent);font-weight:600;font-size:.9rem}.page__body{flex:1;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:28px;max-width:1440px;width:100%;margin:0 auto;padding:28px 20px 60px}.page__main{flex:1 1 640px;max-width:1100px;min-width:0}.ad-rail{flex:0 0 300px;display:flex;flex-direction:column;gap:16px;position:sticky;top:20px}.ad-rail__slot{width:300px;max-width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;background:var(--panel);border:1px dashed var(--border);border-radius:var(--radius);color:var(--text-dim);font-size:.8rem}.ad-rail__slot--rect{height:250px}.ad-rail__slot--skyscraper{height:600px}.ad-rail__dims{font-size:.7rem;opacity:.7}@media (max-width: 980px){.ad-rail{flex:1 1 100%;flex-direction:row;flex-wrap:wrap;justify-content:center;position:static}}.app-header{border-bottom:1px solid var(--border);background:var(--panel)}.app-header__inner{display:flex;align-items:center;gap:28px;max-width:1440px;margin:0 auto;padding:14px 20px}.app-header__brand{display:flex;align-items:center;gap:8px;font-weight:700;font-size:1.05rem;color:var(--text);text-decoration:none;flex-shrink:0}.app-header__logo{height:26px;width:auto;border-radius:4px}.app-header__nav{display:flex;align-items:center;gap:22px;font-size:.92rem}.app-header__nav-link{text-decoration:none;color:var(--text);font-weight:500;padding-bottom:3px;border-bottom:2px solid transparent}.app-header__nav-link:hover{color:var(--accent)}.app-header__nav-link--active{color:var(--accent);border-bottom-color:var(--accent)}.world-clock__controls{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:20px}.btn,.world-clock__controls button{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:8px 16px;border-radius:8px;cursor:pointer;font-size:.9rem}.btn--now{background:var(--accent);color:#0b0e14;font-weight:700;border:none}.btn--now:hover{filter:brightness(1.08)}.datetime-picker{background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:7px 10px;border-radius:8px;font-size:.9rem;color-scheme:dark}.add-city{position:relative;flex:1;min-width:200px}.add-city__input{width:100%;background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:8px;font-size:.9rem}.add-city__results{position:absolute;z-index:20;top:calc(100% + 4px);left:0;right:0;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;list-style:none;margin:0;padding:4px;max-height:260px;overflow-y:auto;box-shadow:0 12px 28px #00000073}.add-city__result{width:100%;display:flex;align-items:center;gap:8px;background:none;border:none;color:var(--text);padding:8px 10px;border-radius:6px;text-align:left;cursor:pointer;font-size:.88rem}.add-city__result:hover:not(:disabled){background:var(--panel)}.add-city__result:disabled{opacity:.45;cursor:default}.add-city__country{color:var(--text-dim);font-size:.8rem;margin-left:auto}.add-city__added{font-size:.72rem;color:var(--accent)}.add-city__limit{position:absolute;top:calc(100% + 4px);left:0;right:0;margin:0;font-size:.78rem;color:var(--text-dim)}.world-clock__rows{display:flex;flex-direction:column}.world-clock__empty{padding:32px 16px;text-align:center;color:var(--text-dim);border:1px dashed var(--border);border-radius:var(--radius)}.city-row{display:grid;grid-template-columns:22px 160px 150px 1fr 28px;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--border)}.city-row--dragging{opacity:.55}.city-row__handle{background:none;border:none;padding:4px;color:var(--text-dim);cursor:grab;touch-action:none;display:flex;align-items:center;justify-content:center;border-radius:4px}.city-row__handle:hover,.city-row__handle:focus-visible{color:var(--text);background:var(--panel-2)}.city-row--dragging .city-row__handle{cursor:grabbing}.city-row__meta{min-width:0}.city-row__name{background:none;border:none;color:var(--text);font-weight:600;font-size:.95rem;padding:0;cursor:pointer;display:flex;align-items:center;gap:6px;text-align:left}.city-row__sub{color:var(--text-dim);font-size:.78rem;margin-top:2px}.city-row__clock{text-align:right;min-width:0}.city-row__time{display:flex;align-items:baseline;justify-content:flex-end;gap:6px;white-space:nowrap}.city-row__time-value{font-size:1.1rem;font-weight:700;font-variant-numeric:tabular-nums}.city-row__tz-abbr{flex:0 0 auto;font-size:.68rem;font-weight:700;letter-spacing:.02em;color:var(--text-dim);text-decoration:underline dotted;text-decoration-color:#97a1b880;cursor:help}.city-row__date{color:var(--text-dim);font-size:.75rem}.city-row__remove{background:none;border:none;color:var(--text-dim);font-size:1.2rem;cursor:pointer;line-height:1}.city-row__remove:hover{color:var(--danger)}.timeline-track{position:relative;display:flex;height:40px;border-radius:8px;overflow:hidden;cursor:grab;touch-action:none;border:1px solid var(--border);outline-offset:2px}.timeline-track:focus-visible{outline:2px solid var(--accent)}.timeline-track--dragging{cursor:grabbing}.timeline-cell{flex:1;position:relative;display:flex;align-items:flex-end;justify-content:center;padding-bottom:2px;font-size:9px;font-variant-numeric:tabular-nums;color:#ffffff80;border-right:1px solid rgba(255,255,255,.05)}.timeline-cell:last-child{border-right:none}.cell-night{background:#0e1526}.cell-dawn{background:#4b3a63}.cell-day{background:#d9a441;color:#241a03}.cell-dusk{background:#a8562f}.date-divider{position:absolute;left:0;top:0;bottom:0;width:1px;background:#ffffff8c}.timeline-marker{position:absolute;top:-6px;bottom:-6px;width:2px;transform:translate(-50%);pointer-events:none;z-index:5}.timeline-marker__line{width:2px;height:100%;background:#fff;box-shadow:0 0 6px #fff9}.timeline-wrap{position:relative;touch-action:none}.timeline-wrap--indicator{padding-top:12px;cursor:grab}.timeline-drag-indicator{position:absolute;top:0;transform:translate(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:8px solid #ffffff;filter:drop-shadow(0 0 2px rgba(0,0,0,.5));z-index:6}.hint-text{color:var(--text-dim);font-size:.9rem;margin-top:20px}.error-text{color:var(--danger);font-size:.9rem}.color-legend{display:flex;flex-wrap:wrap;gap:16px;align-items:center;padding:10px 14px;margin-bottom:18px;background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);font-size:.82rem;color:var(--text-dim)}.color-legend__item{display:inline-flex;align-items:center;gap:6px}.color-legend__swatch{width:14px;height:14px;border-radius:4px;display:inline-block;border:1px solid rgba(255,255,255,.15)}.color-legend__hint{margin-left:auto;font-size:.78rem;color:var(--text-dim)}.how-to__section{margin-bottom:26px}.how-to__section h2{font-size:1.05rem;margin-bottom:8px}.how-to__section p{color:var(--text-dim);line-height:1.55;margin:0 0 10px}.how-to__example{display:block;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:10px 12px;font-size:.85rem;color:var(--accent);overflow-x:auto;white-space:nowrap}.city-select{display:flex;flex-direction:column;gap:6px}.city-select__label{font-size:.8rem;color:var(--text-dim)}.city-select__chosen{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--panel-2);border:1px solid var(--border);border-radius:8px;padding:9px 12px;font-size:.95rem}.city-select__change{background:none;border:1px solid var(--border);color:var(--text-dim);font-size:.78rem;padding:4px 10px;border-radius:6px;cursor:pointer;flex-shrink:0}.city-select__change:hover{color:var(--text);border-color:var(--accent)}.flight-form{display:flex;flex-direction:column;gap:18px;max-width:480px;margin-bottom:32px}.flight-form__field{display:flex;flex-direction:column;gap:6px}.flight-form__duration{display:flex;align-items:center;gap:8px;color:var(--text-dim)}.flight-form__duration-input{width:72px;background:var(--panel-2);border:1px solid var(--border);color:var(--text);padding:9px 10px;border-radius:8px;font-size:.95rem;font-variant-numeric:tabular-nums}.flight-result{display:flex;align-items:flex-start;gap:20px;max-width:720px}.flight-result__col{flex:1;min-width:0}.flight-result__arrow{font-size:1.4rem;flex-shrink:0;margin-top:16px}.flight-leg{background:var(--panel);border:1px solid var(--border);border-top:3px solid var(--accent-red);border-radius:var(--radius);padding:16px 18px}.flight-cross-ref{margin:8px 4px 0;font-size:.8rem;color:var(--text-dim);line-height:1.4}.flight-leg__label{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-red);margin-bottom:6px}.flight-leg__city{font-weight:600;margin-bottom:10px}.flight-leg__time{display:flex;align-items:baseline;gap:6px;font-size:1.3rem;font-weight:700;font-variant-numeric:tabular-nums}.flight-leg__date{color:var(--text-dim);font-size:.85rem;margin-top:4px}.flight-leg__offset{color:var(--text-dim);font-size:.78rem;margin-top:2px}@media (max-width: 700px){.city-row{grid-template-columns:1fr;row-gap:8px}.city-row__clock{text-align:left}.flight-result{flex-direction:column;align-items:stretch}.flight-result__arrow{align-self:center;transform:rotate(90deg)}}