:root { --bulut: #9AA1AC; }
@media (prefers-color-scheme: dark) { :root { --bulut: #C7CBD2; } }
.ara { display: flex; gap: 10px; align-items: center; }
.ara .alan { flex: 1; min-width: 0; }
.konum-d { width: var(--mz-field-h); min-height: var(--mz-field-h); padding: 0; flex: none; border-radius: var(--mz-r-field); }
.sonuclar { margin-top: 10px; }
.sonuclar li { list-style: none; }
button.satir { appearance: none; border: 0; background: transparent; width: 100%; text-align: left; font: inherit; color: var(--mz-text); cursor: pointer; }
.sonuclar li + li .satir::before { content: ""; position: absolute; top: 0; left: var(--mz-row-pad); right: 0; height: 1px; background: var(--mz-hairline); transform: scaleY(.5); transform-origin: top; }
.ozet { padding-top: 20px; }
.yer-adi { font: var(--mz-type-headline); letter-spacing: var(--mz-ls-headline); }
.ozet-ust { display: flex; align-items: center; justify-content: space-between; margin-top: 2px; }
.derece { font: 700 76px/1 var(--mz-font); letter-spacing: -0.04em; }
.simge-b .simge { width: 72px; height: 72px; }
.kosul { font: var(--mz-type-title3); letter-spacing: var(--mz-ls-title3); margin-top: 6px; }
.aralik { color: var(--mz-muted); font: var(--mz-type-subhead); margin-top: 4px; }
.sade { margin: 14px 0 0; padding: 12px 14px; border-radius: var(--mz-r-ic); background: var(--mz-tint); color: var(--mz-text); font: var(--mz-type-callout); }
.sade:empty { display: none; }
.saatlik { padding: 14px 0 16px; overflow: hidden; }
.serit { display: flex; gap: 2px; overflow-x: auto; padding: 0 12px; scroll-snap-type: x proximity; scrollbar-width: none; }
.serit::-webkit-scrollbar { display: none; }
.saat-h { flex: none; width: 56px; display: flex; flex-direction: column; align-items: center; gap: 4px; scroll-snap-align: start; }
.hs { font: var(--mz-type-footnote); color: var(--mz-muted); }
.hy { font: 600 12px/16px var(--mz-font); color: #0A84FF; min-height: 16px; }
.hd { font: var(--mz-type-headline); }
.gun { gap: 10px; }
.gad { width: 58px; flex: none; text-transform: capitalize; white-space: nowrap; }
.gun .simge { flex: none; }
.gy { width: 34px; font: 600 12px/16px var(--mz-font); color: #0A84FF; text-align: right; flex: none; }
.gmin { width: 34px; text-align: right; color: var(--mz-muted); flex: none; }
.gmax { width: 34px; text-align: right; flex: none; }
.cubuk { position: relative; flex: 1 1 auto; min-width: 40px; height: 5px; border-radius: 3px; background: var(--mz-fill); }
.cubuk i { position: absolute; top: 0; bottom: 0; border-radius: 3px; background: linear-gradient(90deg, #5AC8FA, #FFD60A, #FF9F0A); }
@media (max-width: 360px) { .derece { font-size: 64px; } }
