/* Veder — Läänemere öö. Värv tuleb andmetest: temperatuur, välk, hoiatused. */
:root{
  --bg:#122130; --bg-2:#172a3b; --line:#284156; --line-soft:rgba(40,65,86,.55);
  --ink:#e4ecf1; --muted:#8aa1b2; --faint:#5c7487; --ice:#9fd0e4; --bolt:#ffb43d;
  --w-yellow:#f1cb4a; --w-orange:#f2933f; --w-red:#e6534f;
  --glass:rgba(18,33,48,.88); --glass-2:rgba(18,33,48,.96); --deep:#0e1a25; --map-bg:#0f1c28;
  --radius-s:4px; --radius-m:10px; --top:52px;
  --font:"Archivo", system-ui, sans-serif;
  color-scheme: dark;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{background:var(--bg); color:var(--ink); font-family:var(--font); font-size:15px; line-height:1.45;
  font-variant-numeric:tabular-nums; overflow:hidden}
a{color:var(--ice)}
:focus-visible{outline:2px solid var(--ice); outline-offset:2px}
h2{font-size:13px; font-weight:600; color:var(--muted); margin:0 0 10px; font-stretch:90%}
button{font:inherit; color:inherit}
[hidden]{display:none!important}
.hint,.note{color:var(--faint); font-size:12px}
.note{margin:8px 0 0; max-width:70ch}
.ghost{background:none; border:1px solid var(--line); border-radius:var(--radius-s); padding:2px 9px; font-size:12px; color:var(--muted); cursor:pointer}
.ghost:hover{color:var(--ink); border-color:var(--muted)}

/* Ülariba */
.topbar{height:var(--top); display:flex; align-items:center; gap:24px; padding:0 20px; border-bottom:1px solid var(--line); background:var(--bg-2)}
.place{display:flex; align-items:baseline; gap:10px; min-width:0}
.place-name{font-size:19px; font-weight:650; font-stretch:85%; white-space:nowrap}
.place-meta{color:var(--muted); font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tabs{display:flex; gap:2px; margin-left:auto; height:100%}
.tabs button{background:none; border:0; border-bottom:2px solid transparent; padding:0 14px; color:var(--muted); cursor:pointer; font-size:14px; height:100%}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{color:var(--ink); border-bottom-color:var(--ice)}
.updated{color:var(--faint); font-size:12px; white-space:nowrap; max-width:260px; overflow:hidden; text-overflow:ellipsis}

.tab{height:calc(100vh - var(--top))}

/* ---------------- Ülevaade ---------------- */
.ov{display:grid; grid-template-columns:minmax(300px,25%) 1fr; grid-template-rows:1fr auto; overflow:hidden}
.ov-now{grid-row:1; grid-column:1; padding:16px 20px; overflow:hidden; display:flex; flex-direction:column; gap:12px;
  background:var(--bg-2); border-right:1px solid var(--line)}
.ov-map{grid-row:1; grid-column:2; position:relative; min-height:0}
.ov-bottom{grid-row:2; grid-column:1/-1; display:grid; grid-template-columns:1fr minmax(380px,32%);
  border-top:1px solid var(--line); background:var(--bg-2)}

.warnings{display:grid; gap:6px}
.warn{border-left:4px solid var(--w-yellow); background:rgba(241,203,74,.08); padding:6px 10px; border-radius:0 var(--radius-s) var(--radius-s) 0; font-size:13px}
.warn.orange{border-color:var(--w-orange); background:rgba(242,147,63,.10)}
.warn.red{border-color:var(--w-red); background:rgba(230,83,79,.12)}
.warn b{font-weight:650}
.warn small{display:block; color:var(--muted)}
.warnings .hint{font-size:11.5px}

.now-main{display:flex; align-items:center; gap:12px}
.now-icon svg{width:64px; height:64px; display:block}
.now-temp{font-size:96px; line-height:.9; font-weight:700; font-stretch:68%; letter-spacing:-.02em; color:var(--tcol,var(--ink))}
.now-temp sup{font-size:.36em; font-weight:500; vertical-align:top; position:relative; top:.25em; margin-left:2px; color:var(--muted)}
.now-phen{font-size:18px; font-weight:550; margin-top:6px; font-stretch:92%}
.now-feels{color:var(--muted); font-size:14px}
.now-source{color:var(--faint); font-size:11.5px; margin-top:2px}

.key-tiles{display:grid; grid-template-columns:1fr 1fr; gap:0 14px; border-top:1px solid var(--line)}
.kt{padding:7px 0; border-bottom:1px solid var(--line-soft)}
.kt-l{font-size:12px; color:var(--muted)}
.kt-v{font-size:21px; font-weight:650; font-stretch:78%; display:flex; align-items:baseline; gap:5px; white-space:nowrap}
.kt-v small{font-size:12.5px; font-weight:450; color:var(--muted); font-stretch:100%}
.wind-dir{display:inline-block; width:16px; height:16px}

.nowcast{padding:8px 12px; border-radius:var(--radius-m); background:rgba(159,208,228,.07); font-size:13.5px}
.nowcast:empty{display:none}
.nowcast .bars{display:flex; gap:2px; align-items:flex-end; height:22px; margin-top:6px}
.nowcast .bars i{flex:1; background:#4f9fd6; border-radius:1px; min-height:1px}
.nowcast .ticks{display:flex; justify-content:space-between; color:var(--faint); font-size:10.5px}
.ov-summary{margin:0; font-size:13.5px; color:var(--muted)}
.ov-summary:empty{display:none}
.ov-indoor{display:flex; gap:14px; align-items:baseline; font-size:13px; color:var(--muted); border-top:1px solid var(--line); padding-top:8px}
.ov-indoor b{color:var(--ink); font-size:19px; font-stretch:80%}

/* 24 h riba */
.hour-strip{display:grid; grid-auto-flow:column; grid-auto-columns:1fr; padding:10px 14px 10px 20px; gap:2px; overflow:hidden}
.hs{display:grid; justify-items:center; gap:2px; font-size:12px; color:var(--muted); padding:2px 0; border-radius:var(--radius-s)}
.hs.night{background:rgba(0,0,0,.12)}
.hs svg{width:30px; height:30px}
.hs .t{font-size:16px; font-weight:650; font-stretch:80%}
.hs .p{color:#7cc0f0; font-size:11px; min-height:14px}
.hs .w{font-size:11px}
.hs .day-mark{color:var(--ink); font-weight:600}

/* 5 päeva */
.days5{display:grid; grid-template-columns:repeat(5,1fr); border-left:1px solid var(--line); padding:10px 14px}
.d5{display:grid; justify-items:center; gap:1px; font-size:12px; color:var(--muted)}
.d5 .n{color:var(--ink); font-weight:600; font-size:13px}
.d5 svg{width:32px; height:32px}
.d5 .tt{font-size:15px; font-stretch:82%}
.d5 .tt b{font-size:17px; color:var(--ink)}
.d5 .p{color:#7cc0f0; min-height:15px}

/* ---------------- Kaart ---------------- */
.map-wrap{position:absolute; inset:0}
#map{position:absolute; inset:0; background:var(--map-bg)}
.map-page{position:relative}
.map-overlay{position:absolute; left:58px; right:14px; z-index:500; pointer-events:none}
.map-overlay > *{pointer-events:auto}
.map-top{top:12px; display:flex; justify-content:space-between; align-items:flex-start; gap:10px}
.map-bottom{bottom:12px; left:14px; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  background:var(--glass); backdrop-filter:blur(6px); padding:6px 12px; border-radius:var(--radius-m); border:1px solid var(--line)}
.layer-toggles{display:flex; flex-wrap:wrap; gap:4px 12px; background:var(--glass); backdrop-filter:blur(6px);
  padding:7px 11px; border-radius:var(--radius-m); border:1px solid var(--line); font-size:12.5px}
.layer-toggles label{display:flex; gap:5px; align-items:center; cursor:pointer; color:var(--muted)}
.layer-toggles input{accent-color:#7fbfdc; margin:0}
.lightning-sum{background:var(--glass); padding:6px 11px; border-radius:var(--radius-m); border:1px solid var(--line);
  font-size:12.5px; color:var(--bolt); margin-left:auto}
.lightning-sum:empty{display:none}
.play{width:28px; height:28px; border-radius:50%; border:1px solid var(--line); background:var(--bg-2); cursor:pointer; font-size:11px}
#frameSlider{flex:1 1 140px; accent-color:#7fbfdc}
.frame-time{font-size:13px; font-weight:600}
.legend{display:flex; align-items:center; gap:6px; font-size:11px; color:var(--muted); margin-left:auto}
.legend .ramp{display:inline-block; width:80px; height:7px; border-radius:2px;
  background:linear-gradient(90deg,#9be2ff,#3a9fe0,#1b5fd1,#f2e94e,#f3962e,#e3364c,#b02ccd)}
.bolt-legend{display:flex; align-items:center; gap:4px; margin-left:8px}
.dot{display:inline-block; width:8px; height:8px; border-radius:50%}
.dot.new{background:#fff3c4; box-shadow:0 0 6px var(--bolt)}
.dot.old{background:#a3622a}
.st-label{background:var(--glass); border:1px solid rgba(255,255,255,.08); color:var(--ink);
  font:650 12px/1 var(--font); font-stretch:80%; padding:3px 5px; border-radius:3px; white-space:nowrap;
  transform:translate(-50%,-50%); display:inline-block; border-bottom:2px solid var(--tc,#888)}
.me-pin{width:18px; height:18px; border-radius:50%; background:#4fb3ff; border:3px solid #fff; box-shadow:0 0 0 2px rgba(0,0,0,.55), 0 0 14px #4fb3ff; position:relative}
.me-pin::after{content:""; position:absolute; inset:-9px; border-radius:50%; border:2px solid #4fb3ff; animation:mePulse 2.2s ease-out infinite}
@keyframes mePulse{0%{transform:scale(.5); opacity:.9} 100%{transform:scale(1.9); opacity:0}}
.leaflet-container{font-family:var(--font)}
.leaflet-control-attribution{background:var(--glass)!important; color:var(--faint)!important; font-size:10px}
.leaflet-control-attribution a{color:var(--muted)!important}
.leaflet-control-zoom a{background:var(--bg-2)!important; color:var(--ink)!important; border-color:var(--line)!important}
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--bg-2); color:var(--ink)}
.leaflet-popup-content{font-size:13px; margin:10px 12px}

/* ---------------- Teised vahekaardid ---------------- */
.page{overflow-y:auto; padding:18px 20px 28px; scrollbar-width:thin; scrollbar-color:var(--line) transparent}
.grid-2{display:grid; grid-template-columns:minmax(0,1.65fr) minmax(min(320px,100%),1fr); gap:16px; align-content:start}
.grid-2.even{grid-template-columns:1fr 1fr}
.panel{background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius-m); padding:16px 18px; min-width:0}
.block-head{display:flex; align-items:baseline; justify-content:space-between; gap:10px; flex-wrap:wrap}
.block-head h2{margin-bottom:8px}

.smart-summary{font-size:15px; margin:2px 0 10px; max-width:80ch}
.smart-summary:empty{display:none}
.chart-wrap{position:relative; height:200px}
.chart-wrap.tall{height:280px}
.chart-wrap.short{height:120px; margin-top:4px}
.chart-wrap.xl{height:calc(100vh - var(--top) - 150px); min-height:300px}
.wind-arrows{display:flex; justify-content:space-between; padding:0 6px 0 34px; height:16px}
.wind-arrows span{font-size:11px; color:var(--muted); display:inline-block}

.verify{border-collapse:collapse; width:100%; font-size:13px; max-width:620px}
.verify th{text-align:right; font-weight:500; color:var(--faint); padding:3px 0}
.verify th:first-child,.verify td:first-child{text-align:left}
.verify td{text-align:right; padding:5px 0; border-top:1px solid var(--line-soft)}
.verify tr.me td{color:var(--ink); font-weight:650}
.verify .best{color:#9fe3b0}

.days{display:grid}
.day{display:grid; grid-template-columns:86px 30px minmax(0,1fr) 64px 52px; align-items:center; gap:8px; padding:5px 0; border-bottom:1px solid var(--line-soft); font-size:13.5px}
.day .dn{font-weight:600}
.day .dn small{display:block; color:var(--faint); font-weight:400; font-size:11px}
.day svg{width:28px; height:28px}
.trange{position:relative; height:6px; background:rgba(255,255,255,.06); border-radius:3px}
.trange i{position:absolute; top:0; bottom:0; border-radius:3px}
.trange-wrap{display:grid; grid-template-columns:30px 1fr 30px; gap:6px; align-items:center}
.trange-wrap span{font-size:13px; text-align:right}
.trange-wrap span:last-child{text-align:left; font-weight:650}
.day .pr{color:#7cc0f0; text-align:right}
.day .gu{color:var(--muted); text-align:right}

.readings{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr)); gap:0 18px}
.rd{padding:10px 0; border-bottom:1px solid var(--line-soft)}
.rd-label{font-size:12px; color:var(--muted)}
.rd-val{font-size:24px; font-weight:650; font-stretch:78%; display:flex; align-items:baseline; gap:6px}
.rd-val small{font-size:13px; font-weight:450; color:var(--muted); font-stretch:100%}
.rd-src{font-size:11px; color:var(--faint)}

table{border-collapse:collapse; width:100%}
.stations td{padding:5px 0; font-size:13px; border-bottom:1px solid var(--line-soft)}
.stations td:nth-child(n+2){text-align:right; white-space:nowrap}
.stations .t{font-weight:650}
.stations .d{color:var(--faint)}

.indoor-row{display:grid; grid-template-columns:auto auto minmax(0,1fr); gap:16px; align-items:center}
.indoor-val{font-size:28px; font-weight:650; font-stretch:78%}
.indoor-val small{display:block; font-size:12px; font-weight:450; color:var(--muted); font-stretch:100%}
.indoor-spark{position:relative; height:60px; min-width:0}

.sun{display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px 14px; font-size:13px; align-content:start}
.sun h2{grid-column:1/-1; margin:0}
.sun b{display:block; font-size:18px; font-weight:600; font-stretch:82%}
.sun span{color:var(--muted)}
.aq{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; font-size:13px}
.aq b{display:block; font-size:18px; font-stretch:82%}
.aq span{color:var(--muted); font-size:12px}

.seg{display:inline-flex; border:1px solid var(--line); border-radius:var(--radius-s); overflow:hidden; margin-bottom:8px}
.seg button{background:none; border:0; padding:3px 10px; font-size:12px; color:var(--muted); cursor:pointer}
.seg button.on{background:var(--line); color:var(--ink)}
.fc-text{display:grid; grid-template-columns:1fr 1fr; gap:0 24px}
.fc-text > div p{margin:0 0 8px; max-width:62ch}
.fc-text h3{font-size:14px; margin:10px 0 4px; font-weight:600}
.fc-text .places{display:flex; flex-wrap:wrap; gap:4px 14px; font-size:12.5px; color:var(--muted); margin-bottom:8px}
.fc-text .places b{color:var(--ink)}
.fc-text details{grid-column:1/-1}
#blogPosts a{display:block; text-decoration:none; padding:5px 0; font-size:14px}
#blogPosts a small{display:block; color:var(--faint)}
.sources{border-top:1px solid var(--line); margin-top:14px; padding-top:12px; font-size:11px; color:var(--faint); line-height:1.5}
.toast{position:fixed; bottom:18px; left:50%; transform:translateX(-50%); background:var(--bg-2); border:1px solid var(--line);
  padding:8px 14px; border-radius:var(--radius-m); font-size:13px; z-index:1000}

/* Taustapildi režiim: ainult ülevaade, ei mingit juhtnuppu */
body.wallpaper .only-ui{display:none!important}
body.wallpaper .leaflet-control-zoom{display:none}
body.wallpaper{cursor:none}
body.wallpaper .updated{margin-left:auto}

/* Madalamad ekraanid: tihenda ülevaadet */
@media (max-height:820px){
  .now-temp{font-size:76px}
  .now-icon svg{width:52px; height:52px}
  .hs svg,.d5 svg{width:24px; height:24px}
  .nowcast .bars{display:none}
}
@media (max-width:1100px){
  body{overflow:auto}
  .topbar{flex-wrap:wrap; height:auto; padding:8px 14px; gap:6px 16px}
  .tabs{margin-left:0; overflow-x:auto; height:40px; width:100%}
  .tab{height:auto}
  .ov{grid-template-columns:1fr; grid-template-rows:auto 60vh auto}
  .ov-now{grid-row:1; border-right:0}
  .ov-map{grid-row:2; grid-column:1}
  .ov-bottom{grid-row:3; grid-template-columns:1fr}
  .hour-strip{overflow-x:auto; grid-auto-columns:56px}
  .days5{border-left:0; border-top:1px solid var(--line)}
  .map-page{height:80vh}
  .grid-2,.grid-2.even{grid-template-columns:1fr}
  .fc-text{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important; animation:none!important}}

/* --- lihv --- */
.ov-now{background:
  radial-gradient(120% 60% at 0% 0%, color-mix(in srgb, var(--tglow,#284156) 16%, transparent), transparent 70%),
  var(--bg-2)}
.now-temp{text-shadow:0 0 40px color-mix(in srgb, var(--tcol,#fff) 25%, transparent)}
.hs .arr{display:inline-block; font-style:normal; margin-right:2px; color:var(--faint)}
.osm-dark{filter:invert(.92) hue-rotate(180deg) brightness(.85) contrast(.9) saturate(.6)}
.photo-dim{filter:brightness(.6) saturate(.8)}
.layer-toggles select{background:var(--bg-2); color:var(--ink); border:1px solid var(--line); border-radius:var(--radius-s); font:inherit; font-size:12px; padding:1px 4px}
.place-dlg{background:var(--bg-2); color:var(--ink); border:1px solid var(--line); border-radius:var(--radius-m); width:min(460px,92vw); padding:16px 18px}
.place-dlg::backdrop{background:rgba(5,12,18,.6)}
.pd-head{display:flex; justify-content:space-between; align-items:center; margin:0 0 10px}
.pd-head h2{margin:0; font-size:15px; color:var(--ink)}
.place-dlg input{width:100%; background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:var(--radius-s); padding:9px 11px; font:inherit}
.pd-res{list-style:none; margin:8px 0; padding:0; max-height:300px; overflow:auto}
.pd-res button{display:block; width:100%; text-align:left; background:none; border:0; border-bottom:1px solid var(--line-soft); padding:8px 4px; cursor:pointer}
.pd-res button:hover,.pd-res button:focus-visible{background:rgba(159,208,228,.08)}
.pd-res b{display:block; font-weight:600}
.pd-res span{color:var(--muted); font-size:12.5px}
.pd-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:6px}
.place-name{cursor:default}
.tabs button kbd{display:none}

/* --- kaardi tööriistad --- */
.wind-canvas{position:absolute; left:0; top:0; pointer-events:none}
.map-tools{display:flex; flex-direction:column; gap:6px; align-items:flex-start}
.lbl-modes{background:var(--glass); backdrop-filter:blur(6px); margin:0; border-radius:var(--radius-m)}
.lbl-modes button{padding:5px 10px}
.st-label{display:inline-flex; align-items:center; gap:2px}
.st-label.water{background:rgba(14,40,64,.9); border-bottom-color:var(--tc)}
.st-label .arr-i,.cursor-info .arr-i{width:11px; height:11px; color:var(--tc,#9fd0e4)}
.leaflet-tooltip.st-tip{background:var(--glass-2); color:var(--ink); border:1px solid var(--line); border-radius:var(--radius-m);
  box-shadow:0 8px 30px rgba(0,0,0,.45); padding:10px 12px; width:300px; font-family:var(--font); white-space:normal}
.leaflet-tooltip.st-tip::before{border-top-color:var(--line)}
.tip-h{display:flex; justify-content:space-between; gap:10px; font-size:13.5px}
.tip-h span{color:var(--faint); font-size:12px}
.tip-ph{color:var(--muted); font-size:12.5px; margin:2px 0 4px}
.tip-g{display:grid; grid-template-columns:1fr 1fr; gap:3px 14px; margin-top:6px; font-size:12px}
.tip-g div{display:flex; justify-content:space-between; gap:8px; white-space:nowrap; border-top:1px solid var(--line-soft); padding-top:3px}
.tip-g span{color:var(--muted)}
.cursor-info{position:absolute; left:14px; bottom:62px; z-index:500; display:flex; gap:12px; align-items:center;
  background:var(--glass); backdrop-filter:blur(6px); border:1px solid var(--line); border-radius:var(--radius-m);
  padding:4px 10px; font-size:12px; color:var(--muted); pointer-events:none}
.cursor-info span{display:inline-flex; align-items:center; gap:4px}
.pt-pop .leaflet-popup-content{margin:12px 14px; width:240px!important}
.pt-h{display:flex; justify-content:space-between; align-items:baseline; gap:8px}
.pt-h span{color:var(--faint); font-size:11.5px}
.pt-now{display:flex; align-items:center; gap:8px; margin:6px 0}
.pt-now svg{width:40px; height:40px}
.pt-now span{font-size:34px; font-weight:700; font-stretch:70%}
.pt-now small{color:var(--muted); font-size:12.5px}
.pt-g{display:grid; grid-template-columns:1fr 1fr; gap:2px 10px; font-size:12px; color:var(--muted); margin-bottom:6px}
.spark{display:block; margin-top:4px}
.spark-l{display:flex; justify-content:space-between; font-size:11px; color:var(--faint); margin-bottom:8px}
.pt-set{width:100%}
.leaflet-container{cursor:crosshair}

/* --- hoiatused kompaktselt --- */
.warn-sum{display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; padding:7px 10px;
  border-radius:var(--radius-m); background:rgba(241,203,74,.09); border:1px solid rgba(241,203,74,.25)}
.warn-sum.orange{background:rgba(242,147,63,.11); border-color:rgba(242,147,63,.35)}
.warn-sum.red{background:rgba(230,83,79,.13); border-color:rgba(230,83,79,.4)}
.warn-sum.none{background:none; border-color:var(--line)}
.warn-sum b{display:block; font-size:13.5px; font-weight:650}
.warn-sum small{display:block; color:var(--muted); font-size:12px}
.wdot{width:10px; height:10px; border-radius:50%; background:var(--w-yellow); box-shadow:0 0 10px var(--w-yellow)}
.warn-sum.orange .wdot{background:var(--w-orange); box-shadow:0 0 10px var(--w-orange)}
.warn-sum.red .wdot{background:var(--w-red); box-shadow:0 0 10px var(--w-red)}
.warn-sum.none .wdot{background:var(--faint); box-shadow:none}
.warn-list{list-style:none; margin:6px 0 0; padding:0; display:grid; gap:4px; max-height:40vh; overflow:auto}
.warn-sep{color:var(--faint); font-size:11.5px; margin-top:6px}

/* ===== Taustapilt: rahulik täisekraani kaart + üks klaaskaart paremal ===== */
body.wallpaper .topbar{display:none}
body.wallpaper .tab{height:100vh}
body.wallpaper .ov{display:block; position:relative}
body.wallpaper .ov-map{position:absolute; inset:0}
body.wallpaper .ov-bottom{display:none}
body.wallpaper .map-bottom,body.wallpaper .lightning-sum,body.wallpaper .leaflet-control-attribution{display:none}
body.wallpaper #map{background:var(--deep)}
body.wallpaper .st-label{font-size:13px; opacity:.92}
body.wallpaper .ov-now{
  position:absolute; z-index:600; right:clamp(24px,2.4vw,52px); top:clamp(24px,3.5vh,56px);
  width:clamp(360px,22vw,460px); max-height:calc(100vh - 140px); overflow:hidden;
  padding:22px 24px 18px; gap:14px; border:1px solid rgba(159,208,228,.14); border-radius:20px;
  background:
    radial-gradient(120% 50% at 0% 0%, color-mix(in srgb, var(--tglow,#284156) 18%, transparent), transparent 70%),
    rgba(16,30,43,.80);
  backdrop-filter:blur(18px) saturate(1.2); box-shadow:0 30px 80px rgba(0,0,0,.45)}
body.wallpaper .place{flex-direction:column; align-items:flex-start; gap:0}
body.wallpaper .place-name{font-size:22px}
body.wallpaper .place-meta{font-size:12px}
body.wallpaper .now-temp{font-size:clamp(80px,6vw,112px)}
body.wallpaper .now-source,body.wallpaper .nowcast .bars,body.wallpaper .nowcast .ticks{display:none}
body.wallpaper .nowcast{background:none; padding:0; color:#9fd0e4}
body.wallpaper .key-tiles{grid-template-columns:repeat(4,1fr); gap:0 8px}
body.wallpaper .kt-l{font-size:11px}
body.wallpaper .kt-v{font-size:17px; flex-direction:column; align-items:flex-start; gap:0}
body.wallpaper .kt-v small{font-size:11px}
body.wallpaper .ov-summary{font-size:13px; line-height:1.4}
body.wallpaper .hour-strip{padding:0; grid-auto-columns:1fr; border-top:1px solid var(--line); padding-top:10px}
body.wallpaper .hs:nth-child(n+8){display:none}
body.wallpaper .hs.night{background:none}
body.wallpaper .hs .w{display:none}
body.wallpaper .days5{border:0; border-top:1px solid var(--line); padding:10px 0 0}
body.wallpaper .d5 span:last-child{display:none}
body.wallpaper .warn-sum small{display:none}
body.wallpaper .wp-foot{display:flex; justify-content:space-between; color:var(--faint); font-size:11px; border-top:1px solid var(--line); padding-top:8px}
body.wallpaper .wp-foot .frame-time{font-weight:400; font-size:11px}
body.wallpaper .wp-foot .updated{max-width:none}
@media (max-height:900px){ body.wallpaper .days5{display:none} }

/* ===== vihmaalarm, äike, kiibid ===== */
.nowcast.alarm{background:rgba(61,143,224,.16); border:1px solid rgba(124,192,240,.45); box-shadow:0 0 0 1px rgba(124,192,240,.1), 0 0 30px rgba(61,143,224,.18)}
.nc-title{display:block; font-size:15px; color:#cfe8fb; margin-bottom:2px}
.nc-bars{height:30px}
.nc-foot{color:var(--faint); font-size:11px; margin-top:4px}
.nc-tag{display:inline-block; transform:translate(8px,-50%); font:600 11px var(--font); color:#9fd0e4; background:var(--glass); padding:1px 5px; border-radius:3px; white-space:nowrap}
.alert-chip{display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:center; padding:7px 10px; border-radius:var(--radius-m); border:1px solid}
.alert-chip b{display:block; font-size:13.5px}
.alert-chip small{display:block; color:var(--muted); font-size:12px}
.alert-chip.storm{background:rgba(255,180,61,.10); border-color:rgba(255,180,61,.4)}
.alert-chip.storm .wdot{background:var(--bolt); box-shadow:0 0 12px var(--bolt); animation:pulse 1.6s infinite}
.alert-chip.ice{background:rgba(159,208,228,.10); border-color:rgba(159,208,228,.4)}
.alert-chip.ice .wdot{background:#cfeaf6; box-shadow:0 0 10px #9fd0e4}
.alert-chip.aurora{background:rgba(127,224,160,.09); border-color:rgba(127,224,160,.35)}
.alert-chip.aurora .wdot{background:#7fe0a0; box-shadow:0 0 12px #7fe0a0}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.leaflet-interactive.storm-pulse{animation:pulse 1.4s infinite}
.st-label.ext em{font-style:normal; font-size:9px; color:var(--faint); margin-left:3px}
.tip-raw{font-size:10.5px; color:var(--faint); margin-top:6px; word-break:break-all}
.warn-t{color:var(--w-yellow)}
.icon-btn{display:inline-flex; align-items:center; padding:5px 7px}
.tabs button{padding:0 11px; font-size:13.5px}

/* tööilm */
.work-grid{display:grid; gap:2px; overflow-x:auto}
.wg-row{display:grid; grid-template-columns:200px repeat(10,minmax(78px,1fr)); gap:2px; align-items:stretch}
.wg-row.head div{font-size:12px; color:var(--muted); text-align:center; padding:6px 0}
.wg-row.head .best{color:#9fe3b0; font-weight:650; border-bottom:2px solid #9fe3b0}
.wg-l{padding:8px 0}
.wg-l b{display:block; font-size:13.5px}
.wg-l small{color:var(--faint); font-size:11.5px}
.wg-c{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; font-size:12px; border-radius:6px; padding:6px 2px; text-align:center}
.wg-c i{width:12px; height:12px; border-radius:50%}
.wg-c.good{background:rgba(127,224,160,.08)} .wg-c.good i{background:#7fe0a0}
.wg-c.mid{background:rgba(241,203,74,.08)} .wg-c.mid i{background:var(--w-yellow)}
.wg-c.bad{background:rgba(230,83,79,.09)} .wg-c.bad i{background:var(--w-red)}

/* torm ja taevas */
.storm-cells{display:grid; gap:6px}
.sc{display:grid; grid-template-columns:1fr auto; gap:0 10px; padding:8px 0; border-bottom:1px solid var(--line-soft); font-size:13px}
.sc b{grid-column:1/-1; font-size:14px}
.sc span{color:var(--muted)} .sc .hot{color:var(--bolt); font-weight:650}
.mini-map{height:420px; border-radius:var(--radius-s); overflow:hidden; background:var(--deep)}
.sky-g{display:grid; grid-template-columns:1fr 1fr; gap:12px 16px; font-size:13px}
.sky-g span{color:var(--muted); display:block} .sky-g b{font-size:18px; font-stretch:82%}

/* seaded */
.settings-dlg{width:min(560px,94vw)}
.set-sec{border-top:1px solid var(--line); padding:12px 0}
.set-sec h3{margin:0 0 8px; font-size:14px}
.set-steps{margin:0; padding-left:18px; font-size:13.5px; line-height:1.9}
.set-steps code{background:var(--bg); padding:2px 6px; border-radius:4px; user-select:all}
.set-row{display:flex; align-items:center; gap:8px; font-size:13.5px; margin:6px 0}
.set-row input[type=number],.set-row input[type=time]{width:84px; background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:4px; padding:3px 6px; font:inherit}

/* elav taustapilt */
body.wallpaper.raining .ov-map::after{content:""; position:absolute; inset:0; z-index:450; pointer-events:none;
  background:repeating-linear-gradient(105deg, transparent 0 14px, rgba(190,220,245,.07) 14px 15px);}
body.wallpaper.thunder .ov-map::before{content:""; position:absolute; inset:0; z-index:451; pointer-events:none;
  background:radial-gradient(60% 50% at 30% 20%, rgba(255,240,200,.12), transparent 70%)}
body.wallpaper .alert-chip small{display:none}
.place-dlg input[type=checkbox]{width:auto; accent-color:#7fbfdc}
.set-row input[type=number],.set-row input[type=time]{width:84px; flex:none}

/* ===== vihmaring, kindlus, arutluskäik ===== */
.nc-grid{display:grid; grid-template-columns:auto 1fr; gap:14px; align-items:center}
.nc-text{font-size:13.5px; line-height:1.45}
.rain-ring{display:block; overflow:visible}
.rain-ring .rr-big{fill:var(--ink); font:700 22px var(--font); font-stretch:72%; text-anchor:middle}
.rain-ring .rr-small{fill:var(--muted); font:500 8.5px var(--font); text-anchor:middle}
.rain-ring .rr-t{fill:var(--faint); font:500 7px var(--font); text-anchor:middle}
.rain-ring .sweep{transform-origin:52px 52px; animation:sweep 6s linear infinite}
.rain-ring .sweep line{stroke:rgba(159,208,228,.35); stroke-width:1.2}
@keyframes sweep{to{transform:rotate(360deg)}}
body.wallpaper .rain-ring .sweep{display:none}
.nowcast .nc-foot{margin-top:8px}
.conf-chip{display:grid; grid-template-columns:auto 1fr; gap:10px; align-items:center; text-align:left; background:none;
  border:1px solid var(--line); border-radius:var(--radius-m); padding:6px 10px; cursor:pointer; color:inherit; font:inherit}
.conf-chip:hover{border-color:var(--muted)}
.conf-chip b{display:block; font-size:13px}
.conf-chip small{display:block; color:var(--muted); font-size:11.5px; line-height:1.35}
.conf-dial .cd-bg{fill:none; stroke:rgba(159,208,228,.12); stroke-width:4}
.conf-dial .cd-fg{fill:none; stroke-width:4; stroke-linecap:round}
.conf-dial text{fill:var(--ink); font:700 11px var(--font); text-anchor:middle}
.ai-panel{grid-column:1/-1; background:
  radial-gradient(80% 120% at 0% 0%, rgba(127,224,160,.07), transparent 60%), var(--bg-2)}
.ai-head{display:flex; gap:14px; align-items:center; margin-bottom:6px}
.ai-head h2{margin:0 0 2px}
.ai-conf{font-size:15px}
.ai-list{margin:8px 0 0; padding-left:20px; display:grid; gap:6px; font-size:14px; max-width:110ch}
.ai-list li::marker{color:var(--faint)}
@media (prefers-reduced-motion:reduce){.rain-ring .sweep{animation:none; display:none}}

/* ===== taevakuppel ===== */
.sky-wrap{display:grid; grid-template-columns:minmax(0,560px) 1fr; gap:28px; align-items:center}
.dome-svg{width:100%; height:auto; display:block}
.dome-rim{stroke:rgba(159,208,228,.35); stroke-width:1.5}
.dome-grid{stroke:rgba(159,208,228,.12); stroke-dasharray:3 5}
.dome-dir{fill:var(--muted); font:600 12px var(--font); text-anchor:middle}
.star text{fill:#dfe8f5; font:500 10.5px var(--font); opacity:.8}
.constel{fill:none; stroke:#9fd0e4; stroke-width:1}
.sky-time{font-size:28px; font-stretch:80%; display:flex; align-items:baseline; gap:10px; flex-wrap:wrap}
.sky-time b{font-weight:700}
.sky-phase{font-size:13px; color:#ffd27a; border:1px solid rgba(255,210,122,.35); border-radius:20px; padding:2px 10px; font-stretch:100%}
.sky-read{display:grid; grid-template-columns:1fr 1fr; gap:12px 20px; margin:16px 0}
.sky-read span{display:block; color:var(--muted); font-size:12px}
.sky-read b{font-size:18px; font-stretch:82%}
.sky-ctrl{display:flex; gap:8px; align-items:center}
.sky-timeline{position:relative; display:flex; height:46px; margin-top:16px; border-radius:6px; overflow:hidden; --pos:0%}
.sky-timeline::after{content:""; position:absolute; top:0; bottom:0; left:var(--pos); width:2px; background:#fff; box-shadow:0 0 8px #fff}
.tl-h{flex:1; position:relative}
.tl-h span{position:absolute; top:2px; left:3px; font-size:10px; color:rgba(255,255,255,.7)}
.tl-a{position:absolute; bottom:0; left:15%; right:15%; background:#4dff9a; opacity:.8}
.tl-c{position:absolute; top:0; left:0; right:0; background:rgba(200,210,220,.28)}
#skySlider{width:100%; accent-color:#9fd0e4; margin-top:6px}
/* naabrus */
.hood-g{display:grid; grid-template-columns:repeat(6,1fr); gap:12px 18px}
.hood-g span{display:block; color:var(--muted); font-size:12px}
.hood-g b{display:block; font-size:22px; font-stretch:78%}
.hood-g small{display:block; color:var(--faint); font-size:11.5px}
.stations small.src{display:block; font-size:10.5px; color:var(--faint)}
.stations small.src.off{color:#9fd0e4}
.stations .wet{color:#7cc0f0}
@media (max-width:1100px){.sky-wrap{grid-template-columns:1fr} .hood-g{grid-template-columns:repeat(2,1fr)}}
.grid-2{align-items:start}

/* bränd */
.brand{display:flex; align-items:center; gap:8px; text-decoration:none; color:var(--ink); margin-right:6px}
.brand span{font-size:17px; font-weight:750; font-stretch:88%; letter-spacing:.01em;
  background:linear-gradient(90deg,#e4ecf1,#9fd0e4); -webkit-background-clip:text; background-clip:text; color:transparent}
.brand img{display:block}
body.wallpaper .brand{display:none}
body.wallpaper .wp-sig{display:inline-flex; align-items:center; gap:5px; color:var(--muted); font-weight:650}

/* ---------- Veder 2: kliima, Eesti praegu, lemmikud, meri, tegevused ---------- */
.tabs button{padding:0 9px; font-size:13px}
.page > .panel + .panel, .page > .panel + .grid-2, .page > .grid-2 + .panel{margin-top:16px}

.est-now{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px}
.en{all:unset; cursor:pointer; display:flex; flex-direction:column; gap:2px; padding:10px 12px; border-radius:8px;
  background:rgba(255,255,255,.025); border:1px solid var(--line-soft); transition:border-color .15s, background .15s}
.en:hover{border-color:var(--ice); background:rgba(159,208,228,.06)}
.en span{font-size:11.5px; color:var(--muted)} .en b{font-size:22px; font-stretch:80%; font-weight:650}
.en small{font-size:11.5px; color:var(--faint); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

.clim-top{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:6px 0 10px}
.clim-top div{display:flex; flex-direction:column}
.clim-top span{font-size:11.5px; color:var(--muted)} .clim-top b{font-size:26px; font-stretch:80%; font-weight:650}
.clim-top small{color:var(--faint); font-size:12px}
.clim-top i{font-style:normal} .clim-top .hot{color:#f2933f} .clim-top .cold{color:#6fb0e8}
.anom-bars{display:grid; grid-template-columns:repeat(10,1fr); gap:6px; align-items:end}
.ab{display:flex; flex-direction:column; align-items:center; gap:3px}
.ab-col{height:96px; width:100%; position:relative; border-top:0}
.ab-col::after{content:""; position:absolute; left:0; right:0; top:48px; height:1px; background:var(--line)}
.ab-col i{position:absolute; left:22%; right:22%; border-radius:3px}
.ab-col i.up{bottom:48px; background:linear-gradient(0deg,rgba(242,147,63,.35),#f2933f)}
.ab-col i.dn{top:48px; background:linear-gradient(180deg,rgba(111,176,232,.35),#6fb0e8)}
.ab small{font-size:11px; color:var(--muted)}
.day .anom{display:block; font-style:normal; font-size:10.5px; font-weight:600; margin-top:1px}
.day .anom.up{color:#f2933f} .day .anom.dn{color:#6fb0e8}

.pd-favs{margin:0 0 10px}
.fav-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; font-size:13px}
.fav-list{display:flex; flex-wrap:wrap; gap:6px}
.fav{display:inline-flex; border:1px solid var(--line); border-radius:999px; overflow:hidden}
.fav button{background:none; border:0; color:var(--ink); padding:5px 10px; cursor:pointer; font:inherit; font-size:13px}
.fav .fav-x{color:var(--faint); padding:5px 8px 5px 2px} .fav .fav-x:hover{color:var(--w-red)}
.fav-bar{display:flex; gap:4px; margin-left:6px}
.fav-bar button{background:none; border:1px solid var(--line); border-radius:999px; color:var(--muted); padding:2px 9px; font:inherit; font-size:12px; cursor:pointer}
.fav-bar button.on{color:var(--ink); border-color:var(--ice)}
@media (max-width:1100px){.fav-bar{display:none}}

/* meri */
.beach-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr)); gap:10px}
.beach{all:unset; box-sizing:border-box; cursor:pointer; display:flex; flex-direction:column; gap:8px; padding:12px 14px; border-radius:10px;
  background:linear-gradient(180deg,rgba(95,211,224,.05),rgba(255,255,255,.01)); border:1px solid var(--line-soft); transition:border-color .15s, transform .15s}
.beach:hover{border-color:var(--line); transform:translateY(-1px)}
.beach.on{border-color:#5fd3e0; box-shadow:0 0 0 1px rgba(95,211,224,.25), 0 8px 24px -12px rgba(95,211,224,.5)}
.bh{display:flex; justify-content:space-between; align-items:baseline} .bh b{font-size:15px} .bh small{color:var(--faint); font-size:11.5px}
.bwater{font-size:34px; font-weight:650; font-stretch:78%; line-height:1}
.bwater small{font-size:11px; color:var(--faint); font-weight:450; margin-left:6px; font-stretch:100%}
.bmeta{display:flex; flex-direction:column; gap:2px; font-size:12.5px; color:var(--muted)}
.bmeta b{color:var(--ink); font-weight:600} .bmeta i{font-style:normal; color:var(--faint)}
.bmeta .arr-i{width:12px; height:12px; vertical-align:-2px; color:#9fd0e4}
.bscores{display:grid; grid-template-columns:repeat(3,1fr); gap:4px; text-align:center}
.bscores small{display:block; font-size:10.5px; color:var(--muted); line-height:1.2}
.bdial{width:50px; height:50px; display:block; margin:0 auto}
.bdial circle{fill:none; stroke-width:4; stroke-linecap:round} .bdial circle.bg{stroke:rgba(255,255,255,.07)}
.bdial text{fill:var(--ink); font-size:13px; font-weight:650; text-anchor:middle; font-family:var(--font)}
.bspark{width:100%; height:22px} .bspark rect{fill:rgba(111,176,232,.55)}
.bnote{font-size:11.5px; color:var(--w-yellow); line-height:1.35}
.lvbar{position:relative; width:90px; height:6px; background:rgba(255,255,255,.05); border-radius:3px; margin-left:auto}
.lvbar::after{content:""; position:absolute; left:50%; top:-2px; bottom:-2px; width:1px; background:var(--line)}
.lvbar i{position:absolute; top:0; bottom:0; background:#6fb0e8; border-radius:3px} .lvbar i.hi{background:var(--w-orange)}

/* tegevused */
.act-grid{position:relative; display:grid; gap:3px; overflow-x:auto; --n:49}
.ag-row{display:grid; grid-template-columns:210px 1fr 40px; gap:8px; align-items:center}
.ag-row.head .ag-cells div{font-size:10.5px; color:var(--faint); text-align:left; overflow:visible; white-space:nowrap}
.ag-row.head .ag-cells b{color:var(--ink); font-weight:650}
.ag-cells{display:grid; grid-template-columns:repeat(var(--n),minmax(9px,1fr)); gap:1px; min-width:480px}
.ag-cells i{height:26px; border-radius:2px; transition:transform .1s}
.ag-cells i:hover{transform:scaleY(1.18); outline:1px solid rgba(255,255,255,.6)}
.ag-cells .dsep{box-shadow:-2px 0 0 0 var(--bg-2), -3px 0 0 0 var(--muted)}
.ag-l{display:flex; gap:10px; align-items:center; min-width:0}
.ag-l b{display:block; font-size:13.5px} .ag-l small{display:block; color:#9fe3b0; font-size:11.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.act-i{width:22px; height:22px; flex:none; fill:none; stroke:var(--ice); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.ag-now{font-size:18px; font-weight:700; font-stretch:80%; text-align:right}
.act-tip{position:absolute; pointer-events:none; background:var(--deep); border:1px solid var(--line); border-radius:6px; padding:5px 9px; font-size:12px; white-space:nowrap; z-index:5}
#actGrid + .act-tip{position:absolute}
.panel:has(> #actGrid){position:relative}

.frost{display:grid; grid-template-columns:repeat(7,1fr); gap:6px}
.fr{display:flex; flex-direction:column; align-items:center; gap:1px; padding:8px 4px; border-radius:8px; background:rgba(255,255,255,.025); border:1px solid var(--line-soft); text-align:center}
.fr small{font-size:11px; color:var(--muted)} .fr b{font-size:20px; font-stretch:80%} .fr span{font-size:10.5px; color:var(--faint)}
.fr em{font-style:normal; font-size:10px; color:var(--faint); line-height:1.15; margin-top:2px}
.fr.low{border-color:rgba(159,208,228,.5)} .fr.low em{color:var(--ice)}
.fr.mid{border-color:#6fb0e8; background:rgba(111,176,232,.1)} .fr.mid em{color:#6fb0e8}
.fr.high{border-color:#b49be8; background:rgba(180,155,232,.14)} .fr.high em{color:#b49be8}
.sol-list{list-style:none; margin:0; padding:0; display:grid; gap:4px}
.sol-list li{display:flex; justify-content:space-between; gap:10px; padding:7px 10px; border-radius:6px; background:rgba(255,255,255,.025); font-size:13px}
.sol-list li span{color:var(--muted)} .sol-list li.big{background:rgba(127,224,160,.08); border-left:3px solid #7fe0a0}
@media (max-width:1100px){.clim-top{grid-template-columns:1fr 1fr} .ag-row{grid-template-columns:150px 1fr 34px} .frost{grid-template-columns:repeat(4,1fr)}}
.wp-sig{margin-right:10px; display:inline-flex; align-items:center; gap:5px}

/* vihmakaardi vaate valik ja tunnivaade */
.nowcast .nc-view{display:flex; width:max-content; margin:8px 0 0}
.nowcast .nc-view button{padding:3px 10px}
.nc-hours{display:grid; grid-template-columns:repeat(12,1fr); gap:3px; height:74px; margin-top:8px; align-items:end}
.nh{display:grid; grid-template-rows:12px 1fr 12px 11px; height:100%; text-align:center; font-size:10px; color:var(--faint)}
.nh i{align-self:end; display:block; background:#4f9fd6; border-radius:2px 2px 0 0; min-height:2px}
.nh-mm{color:var(--muted)}
.nh-h{color:var(--muted)}
.nh-p{font-size:9px}
/* radari prognoosipildid */
.radar-fc{filter:saturate(.85)}
.frame-time.is-fc{color:#f1cb4a}
body.wallpaper .nc-view{display:none}

/* prognoosiriba: samm valitav */
.hs-wrap{display:grid; grid-template-rows:auto 1fr; min-width:0}
.hs-bar{display:flex; align-items:center; gap:10px; padding:8px 14px 0 20px; flex-wrap:wrap}
.hs-bar .seg{margin:0}
.hs-bar .seg button{padding:2px 8px; font-size:11.5px}
.hs-bar .hint{font-size:11px}
.hour-strip{overflow-x:auto; grid-auto-columns:minmax(46px,1fr); scrollbar-width:thin}
.hs .lbl{white-space:nowrap; font-size:11.5px}
.hs .lbl b{color:var(--ink); font-weight:600}
.hs .tmin{font-size:12px; color:var(--faint); margin-top:-3px}
.hs .p.snow{color:#e8f1f8}
.hs .p.sleet{color:#9fe0d8}
.hs .p i{display:block; font-style:normal; font-size:9.5px; opacity:.85}
.kt-sub,.rd-val .kt-sub{display:block; font-size:11px; font-weight:400; color:var(--muted); line-height:1.25; margin-top:2px; font-stretch:normal; letter-spacing:0}

/* minu kohad */
.fav-cards{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px}
.fav-card{position:relative; border:1px solid var(--line); border-radius:var(--radius-m); background:rgba(159,208,228,.04)}
.fav-card.on{border-color:var(--ice)}
.fav-card .fav-go{display:grid; gap:2px; width:100%; text-align:left; background:none; border:0; color:var(--ink); padding:8px 26px 8px 10px; cursor:pointer; font:inherit}
.fav-card .fav-go small{color:var(--faint); font-size:11px}
.fav-wx{display:flex; align-items:center; gap:4px; font-size:12px; color:var(--muted); min-height:24px}
.fav-wx svg{width:24px; height:24px}
.fav-card .fav-x{position:absolute; top:4px; right:4px; background:none; border:0; color:var(--faint); cursor:pointer; font-size:15px}
.fav-card .fav-x:hover{color:var(--w-red)}
.pd-row{display:flex; align-items:stretch}
.pd-row .pd-go{flex:1}
.pd-row .pd-star{font-size:16px; padding:0 12px}
.pd-row .pd-star{width:auto; display:flex; align-items:center; border-bottom:1px solid var(--line-soft)}

/* pikad tabelid ei veni paneelist välja (tühi auk kõrvalveerus) */
.scroll-box{max-height:440px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--line) transparent}
details.inland{margin-top:10px}
details.inland summary{cursor:pointer; color:var(--muted); font-size:13px}
/* paneel võtab kõrvalpaneeli kõrguse ja kerib sisu, et rida ei veniks */
.grid-2 > .panel.fit{contain:size; align-self:stretch; display:flex; flex-direction:column; min-height:380px}
.grid-2 > .panel.fit .scroll-box{flex:1; min-height:0; max-height:none}
@media (max-width:1100px){.grid-2 > .panel.fit{contain:none; min-height:0} .grid-2 > .panel.fit .scroll-box{max-height:440px}}
.kt-v,.rd-val{flex-wrap:wrap}
.kt-v .kt-sub,.rd-val .kt-sub{flex-basis:100%; white-space:normal; margin-top:0}

/* kompaktne menüü + alamvaated */
.tabs button{white-space:nowrap}
#btnRelocate{white-space:nowrap}
.subtabs{display:flex; width:max-content; margin:0 0 14px}
.subtabs button{padding:5px 14px; font-size:13px}
.place-meta{max-width:34vw}
.subtabs{grid-column:1/-1}   /* grid-lehtedel (Prognoos, Mudelid) ei tohi menüü võtta paneeli kohta */
.models-warn{display:block; margin-top:8px; padding:8px 10px; border-left:3px solid var(--w-yellow); background:rgba(241,203,74,.07); font-size:12.5px; color:var(--muted); border-radius:0 6px 6px 0}
/* Ülevaate vasak veerg: väiksemal ekraanil keritav, kaardid ei litsu üksteist kokku */
body:not(.wallpaper) .ov-now{overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--line) transparent}
body:not(.wallpaper) .ov-now > *{flex-shrink:0}
.hs-bar{padding:5px 14px 0 20px}
.hour-strip{padding-top:4px; padding-bottom:6px}
@media (max-height:900px){
  .hs svg{width:24px; height:24px}
  .hs .t{font-size:14px}
  .hs{gap:0}
  .ov-now{gap:8px; padding:12px 16px}
  .now-temp{font-size:72px}
}
.page.grid-2 > .panel{margin-top:0!important}   /* kõrvuti paneelid algavad samalt kõrguselt */
.verify .vn{display:block; font-size:10px; color:var(--faint); font-weight:400}

/* teeilm */
.alert-chip.road{background:rgba(227,54,76,.10); border-color:rgba(227,54,76,.45); cursor:pointer}
.alert-chip.road .wdot{background:#e3364c; box-shadow:0 0 12px #e3364c}
.road-timeline{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(40px,1fr); gap:3px; margin-top:12px; overflow-x:auto}
.rt{display:grid; justify-items:center; gap:2px; padding:6px 0; border-radius:6px; background:rgba(159,208,228,.05); font-size:11px; color:var(--muted)}
.rt b{font-size:14px}
.rt small{min-height:14px; font-size:10px}
.rt.r1{background:rgba(241,203,74,.16); box-shadow:inset 0 -3px 0 #f1cb4a}
.rt.r2{background:rgba(227,54,76,.18); box-shadow:inset 0 -3px 0 #e3364c}
.road-legend{display:flex; gap:16px; align-items:center; margin-top:8px; flex-wrap:wrap}
.road-legend .rl{display:inline-block; width:10px; height:10px; border-radius:2px; margin-right:5px; vertical-align:-1px}
.rl.r2{background:#e3364c} .rl.r1{background:#f1cb4a} .rl.r0{background:rgba(159,208,228,.25)}
.road-legend button{margin-left:auto}
.stations small.d{display:block; color:var(--faint); font-size:11px}
.st-label.road em{color:#9fd0e4}

/* ilmamälu ja enned */
.mem-list{display:grid; gap:8px; margin-top:10px}
.mem{padding:8px 10px; border-radius:var(--radius-m); background:rgba(159,208,228,.05)}
.mem-h{display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center}
.mem-sim{height:5px; background:rgba(159,208,228,.12); border-radius:3px; overflow:hidden}
.mem-sim i{display:block; height:100%; background:var(--ice)}
.mem-n{font-size:12.5px; color:var(--muted); margin-top:3px}
.lore-list{display:grid; gap:10px}
.lore{padding:10px 12px; border-radius:var(--radius-m); background:rgba(159,208,228,.05)}
.lore-h{display:flex; justify-content:space-between; gap:10px; align-items:baseline}
.badge{font-size:11px; padding:2px 8px; border-radius:999px; white-space:nowrap}
.badge.ok{background:rgba(124,200,120,.18); color:#a9e0a4}
.badge.bad{background:rgba(227,54,76,.18); color:#f2a0aa}
.badge.mid{background:rgba(159,208,228,.12); color:var(--muted)}
.lore-soon{color:#f1cb4a; margin-left:4px}
.lore-bars{display:grid; grid-template-columns:150px 1fr; gap:3px 10px; align-items:center; margin:8px 0 4px; font-size:12px; color:var(--muted)}
.lore-bars i{display:block; height:6px; border-radius:3px; background:var(--ice)}
.lore-bars i.base{background:rgba(159,208,228,.35)}
.lore-v{font-size:12.5px}

/* taevavärv */
.skyc{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr)); gap:12px; margin:6px 0}
.skyc-e{display:grid; grid-template-columns:54px 1fr; gap:12px; align-items:center; padding:10px; border-radius:var(--radius-m); background:rgba(159,208,228,.05)}
.skyc-ring{width:54px; height:54px; border-radius:50%; display:grid; place-items:center;
  background:conic-gradient(var(--c) calc(var(--p)*1%), rgba(159,208,228,.12) 0)}
.skyc-ring b{width:42px; height:42px; border-radius:50%; background:var(--bg-2); display:grid; place-items:center; font-size:15px}
.alert-chip.sky{background:rgba(242,147,63,.10); border-color:rgba(242,147,63,.4); cursor:pointer}
.alert-chip.sky .wdot{background:#f2933f; box-shadow:0 0 12px #f2933f}

/* kohtade rippmenüü */
.place-menu{position:fixed; z-index:2000; min-width:280px; max-width:360px; background:var(--bg-2); border:1px solid var(--line);
  border-radius:var(--radius-m); box-shadow:0 12px 32px rgba(0,0,0,.45); padding:6px; display:grid; gap:2px}
.pm-row{display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; text-align:left; background:none;
  border:0; border-radius:6px; padding:7px 10px; color:var(--ink); cursor:pointer}
.pm-row:hover,.pm-row:focus-visible{background:rgba(159,208,228,.10)}
.pm-row.on{background:rgba(159,208,228,.14); box-shadow:inset 3px 0 0 var(--ice)}
.pm-name{display:grid}
.pm-name small{color:var(--faint); font-size:11.5px}
.pm-wx{display:flex; align-items:center; gap:4px; font-size:13px}
.pm-wx svg{width:24px; height:24px}
.pm-sep{height:1px; background:var(--line); margin:4px 2px}
.pm-empty{padding:8px 10px}
.pm-act b{font-weight:500}

/* reaalajas olek */
.live-bar{position:fixed; left:0; right:0; top:var(--top); height:2px; z-index:1600; pointer-events:none; opacity:0; transition:opacity .3s;
  background:linear-gradient(90deg, transparent, var(--ice), transparent); background-size:40% 100%; background-repeat:no-repeat}
.live-bar.on{opacity:1; animation:livebar 1.1s linear infinite}
@keyframes livebar{from{background-position:-40% 0} to{background-position:140% 0}}
button.updated{display:inline-flex; align-items:center; gap:7px; background:none; border:1px solid transparent; border-radius:999px; padding:3px 10px 3px 8px; cursor:pointer; color:var(--faint); font:inherit; font-size:12px}
button.updated:hover{border-color:var(--line); color:var(--muted)}
.live-dot{width:8px; height:8px; border-radius:50%; background:#6fcf7a; box-shadow:0 0 0 0 rgba(111,207,122,.6); flex:none}
button.updated.busy .live-dot{background:var(--ice); animation:livepulse 1s infinite}
button.updated.err .live-dot{background:var(--w-yellow)}
@keyframes livepulse{0%{box-shadow:0 0 0 0 rgba(159,208,228,.7)} 100%{box-shadow:0 0 0 8px rgba(159,208,228,0)}}
#updatedText{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:240px}
.live-panel{position:fixed; z-index:2100; top:calc(var(--top) + 8px); right:12px; width:min(420px, calc(100vw - 24px)); max-height:min(70vh, 640px); overflow:auto;
  background:var(--bg-2); border:1px solid var(--line); border-radius:var(--radius-m); box-shadow:0 14px 40px rgba(0,0,0,.5); padding:12px 14px}
.lp-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:8px}
.lp-list{display:grid; gap:2px}
.lp-row{display:grid; grid-template-columns:12px 1fr auto; gap:2px 10px; align-items:center; padding:5px 4px; border-radius:6px; font-size:13px}
.lp-row small{grid-column:2 / -1; color:var(--faint); font-size:11.5px}
.lp-row span{color:var(--muted); font-size:12px}
.lp-row.is-err b{color:var(--w-yellow)}
.lp-s{width:8px; height:8px; border-radius:50%; display:block}
.lp-s.ok{background:#6fcf7a} .lp-s.err{background:var(--w-yellow)} .lp-s.busy{background:var(--ice); animation:livepulse 1s infinite}
.lp-om{margin:8px 0 4px}
.asof{font-size:11px; color:var(--faint); white-space:nowrap; margin-left:8px}
.block-head .asof{margin-left:auto; padding-left:10px}
.tab-ic{display:none}

/* ---------------- telefon ---------------- */
@media (max-width:700px){
  :root{--top:auto}
  /* telefonis kerib dokument ise (mitte body kast): siis töötab alumine vahe igas brauseris, ka iPhone'i Safaris */
  html,body{height:auto; min-height:100%; overflow:visible}
  body{padding-bottom:0; font-size:14.5px}
  /* vahe lehe lõpus, et alumine menüü (60 px + iPhone'i kodunupu ala) ei kataks viimast teksti */
  body::after{content:""; display:block; height:calc(76px + env(safe-area-inset-bottom))}
  .toast{bottom:calc(76px + env(safe-area-inset-bottom))}
  [id]{scroll-margin-bottom:calc(76px + env(safe-area-inset-bottom))}
  section.tab{overflow-x:hidden}
  .topbar{display:grid; grid-template-columns:auto 1fr auto auto; align-items:center; gap:8px; padding:calc(8px + env(safe-area-inset-top)) 12px 8px; position:sticky; top:0; z-index:1400}
  .brand span{display:none}
  .place{min-width:0; flex-wrap:nowrap}
  .place-name{font-size:17px; overflow:hidden; text-overflow:ellipsis}
  .place-meta{display:none}
  #btnRelocate{padding:3px 8px}
  button.updated{padding:3px 6px}
  #updatedText{display:none}
  .live-bar{top:0}
  .live-panel{top:auto; bottom:calc(68px + env(safe-area-inset-bottom)); right:8px; left:8px; width:auto}
  /* vahekaardid alla, nagu äpil */
  .tabs{position:fixed; left:0; right:0; bottom:0; top:auto; height:calc(60px + env(safe-area-inset-bottom)); width:100%; margin:0; z-index:1500;
    display:grid; grid-template-columns:repeat(6,1fr); gap:0; background:var(--glass-2); backdrop-filter:blur(8px);
    border-top:1px solid var(--line); padding-bottom:env(safe-area-inset-bottom); overflow:visible}
  .tabs button{display:grid; justify-items:center; align-content:center; gap:3px; padding:0 2px; height:60px; font-size:10.5px;
    border-bottom:0; border-top:2px solid transparent; min-width:0}
  .tabs button[aria-selected="true"]{border-top-color:var(--ice); border-bottom-color:transparent; color:var(--ink)}
  .tab-ic{display:block; width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; stroke-linecap:round}
  .page{padding:12px 10px 20px}
  .grid-2,.grid-2.even{grid-template-columns:minmax(0,1fr)!important}
  .grid-2 > *{min-width:0}
  .act-grid,.work-grid,.beach-grid{overflow-x:auto; max-width:100%}
  .panel{padding:12px; border-radius:12px}
  .subtabs{max-width:100%; overflow-x:auto; scrollbar-width:none; margin-bottom:10px; flex-wrap:nowrap}
  .subtabs::-webkit-scrollbar{display:none}
  .subtabs button{white-space:nowrap; padding:7px 12px}
  .block-head{flex-wrap:wrap; gap:4px 8px}
  .block-head .asof{margin-left:0; padding-left:0; width:100%}
  .seg{max-width:100%; overflow-x:auto}
  .smart-summary{font-size:15px}
  .lore-bars{grid-template-columns:1fr}
  .ov{grid-template-rows:auto 55vh auto}
  .ov-now{padding:12px}
  .now-temp{font-size:68px}
  .hs-bar{padding:6px 10px 0; overflow-x:auto; flex-wrap:nowrap}
  .hs-bar .seg{flex:none}
  .hs-bar .hint{display:none}
  .map-tools .lbl-modes{max-width:calc(100vw - 70px); overflow-x:auto; flex-wrap:nowrap}
  .layer-toggles{max-width:calc(100vw - 24px)}
  .chart-wrap.xl{height:60vh; min-height:280px}
  .fav-bar{display:none}
  .place-menu{left:8px!important; right:8px; max-width:none}
  .mem-h{grid-template-columns:auto 1fr auto}
  .skyc{grid-template-columns:1fr}
  .road-timeline{grid-auto-columns:44px}
  table.stations td{padding:6px 4px}
}

/* täpsuse edetabel */
.rank{display:grid; grid-template-columns:22px minmax(0,1.4fr) minmax(60px,1fr) auto minmax(28px,max-content); gap:8px; align-items:center; padding:4px 0; font-size:13px}
.rank.me{color:#fff; font-weight:600}
.rank-n{color:var(--faint)}
.rank-name{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.rank-bar{height:6px; background:rgba(159,208,228,.1); border-radius:3px; overflow:hidden}
.rank-bar i{display:block; height:100%; background:var(--ice); opacity:.6}
.rank.me .rank-bar i{background:#fff; opacity:1}
.rank small{color:var(--faint); font-size:11px; text-align:right}

/* tunni üksikasjad */
.hs{cursor:pointer}
.hs:hover,.hs:focus-visible{background:rgba(159,208,228,.08)}
.hour-sheet{position:fixed; z-index:2200; right:16px; bottom:16px; width:min(380px, calc(100vw - 24px)); background:var(--bg-2); border:1px solid var(--line);
  border-radius:14px; box-shadow:0 16px 44px rgba(0,0,0,.55); padding:12px 14px}
.hsh-head{display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; margin-bottom:6px}
.hsh-head svg{width:40px; height:40px}
.hsh-head small{display:block; color:var(--muted); font-size:12px}
.hsh-row{display:grid; grid-template-columns:96px 1fr; gap:0 10px; padding:6px 0; border-top:1px solid var(--line-soft); font-size:13.5px}
.hsh-row span{color:var(--muted)}
.hsh-row small{grid-column:2; color:var(--faint); font-size:11.5px}
@media (max-width:700px){ .hour-sheet{left:8px; right:8px; width:auto; bottom:calc(70px + env(safe-area-inset-bottom))} }

/* radari ajajoon: minevik | praegu | prognoos */
.radar-mov{pointer-events:none}
#frameSlider.rt-slider{-webkit-appearance:none; appearance:none; height:6px; border-radius:3px; margin:0 2px;
  background:linear-gradient(90deg, rgba(127,191,220,.35) 0, rgba(127,191,220,.6) var(--now), #fff var(--now), #fff calc(var(--now) + 2px), rgba(241,203,74,.55) calc(var(--now) + 2px), rgba(241,203,74,.2) 100%)}
#frameSlider.rt-slider::-webkit-slider-thumb{-webkit-appearance:none; width:16px; height:16px; border-radius:50%; background:#e4ecf1; border:2px solid #7fbfdc; box-shadow:0 0 0 3px rgba(127,191,220,.25); cursor:grab}
#frameSlider.rt-slider::-moz-range-thumb{width:14px; height:14px; border-radius:50%; background:#e4ecf1; border:2px solid #7fbfdc; cursor:grab}
.rt-wrap{position:relative; flex:1 1 140px; display:flex; align-items:center; min-width:120px; padding-bottom:12px; margin-bottom:-8px}
.rt-wrap #frameSlider{flex:1; width:100%}
.rt-ticks{position:absolute; left:2px; right:2px; bottom:0; height:11px; pointer-events:none}
.rt-ticks span{position:absolute; transform:translateX(-50%); font-size:9.5px; color:var(--faint); white-space:nowrap; line-height:1}
.rt-ticks span.now{color:#fff; font-weight:650; letter-spacing:.02em; text-transform:uppercase}
.frame-time.is-now{color:#9fe3b0}
#frameTime{flex:none; width:15.5em; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-variant-numeric:tabular-nums}
@media (max-width:700px){ #frameTime{width:auto; flex:1 1 100%} }

/* teekaamerad */
.cam-pin{display:grid; place-items:center; width:20px; height:20px; border-radius:6px; background:#ff8a5c; border:2px solid #fff; position:relative; box-shadow:0 1px 4px rgba(0,0,0,.5)}
.cam-pin svg{width:12px; height:12px; fill:#2a1208}
.cam-pop{display:grid; gap:6px; font-size:12.5px}
.cam-pop img{width:100%; border-radius:6px; display:block}
.cam-pop small{color:var(--muted)}
.cam-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(230px,100%),1fr)); gap:10px}
.cam{margin:0; background:rgba(255,255,255,.025); border:1px solid var(--line-soft); border-radius:10px; overflow:hidden}
.cam img{width:100%; aspect-ratio:4/3; object-fit:cover; display:block; background:var(--deep)}
.cam-noimg{aspect-ratio:4/3; display:grid; place-items:center; color:var(--faint); font-size:12px; background:var(--deep)}
.cam figcaption{padding:8px 10px; display:grid; gap:2px; font-size:12.5px}
.cam figcaption span{color:var(--faint); font-size:11.5px}
.cam figcaption small{color:var(--muted); border-left:3px solid var(--c); padding-left:6px}
/* TAF */
.taf{border-top:1px solid var(--line-soft); padding:8px 0}
.taf summary{cursor:pointer; display:flex; gap:10px; align-items:baseline}
.taf-t td{white-space:normal!important; text-align:left!important; vertical-align:top}
.taf-t td:first-child{white-space:nowrap!important; color:var(--muted); width:150px}
.taf-t td:nth-child(2){color:var(--w-yellow); width:120px}
.taf-t tr:not(.taf-ch) td:nth-child(2){color:var(--faint)}
.taf-raw{display:block; margin-top:6px; font-size:11px; color:var(--faint); white-space:pre-wrap; word-break:break-word}
.rank-ctl{display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 10px}
.rank-ctl .seg{margin:0}
.leaflet-container a.leaflet-popup-close-button{width:28px; height:28px; font-size:20px; line-height:26px; color:var(--muted)}
.cam-pop-h{display:flex; align-items:center; justify-content:space-between; gap:8px}
.cam-x{padding:2px 8px; font-size:13px}
.st-tip-pop a.leaflet-popup-close-button{display:none}
.alert-chip.fog .wdot{background:#cfe3ee}
.diary td{vertical-align:top; text-align:left!important; white-space:normal!important}
.diary td small{display:block; color:var(--faint); font-size:11.5px}
.diary th{text-align:left; font-size:12px; color:var(--muted); font-weight:500; padding:4px 0}
.diary tr.partial{opacity:.7}
.cam-ai{font-style:normal; color:#cfe3ee}
.cam-tip{display:grid; gap:4px; width:240px; white-space:normal; font-size:12px}
.cam-tip img{width:100%; border-radius:5px; display:block; aspect-ratio:4/3; object-fit:cover; background:var(--deep)}
.beach-cams{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr)); gap:10px; margin:8px 0 12px}
.pm-cam{display:flex; flex-direction:column; justify-content:center; gap:4px; padding:14px; border-radius:10px; border:1px dashed var(--line); color:var(--ink); text-decoration:none; background:rgba(95,211,224,.05)}
.pm-cam:hover{border-color:#5fd3e0} .pm-cam span{color:var(--muted); font-size:12px}
.cam-badge{color:#5fd3e0; font-size:9px; vertical-align:2px}

/* ================= Tume teema (valikuline; tavaline on sinine): tumehall-sinine, mitte süsimust ================= */
:root[data-theme="night"]{
  --bg:#0d131a; --bg-2:#141c25; --line:#263341; --line-soft:rgba(46,60,74,.6);
  --ink:#e6eaed; --muted:#97a3ae; --faint:#66727d; --ice:#9fd0e4;
  --glass:rgba(16,23,31,.86); --glass-2:rgba(16,23,31,.96); --deep:#0a0f15; --map-bg:#0a0f15;
}
:root[data-theme="night"] .ov-now{background:
  radial-gradient(120% 60% at 0% 0%, color-mix(in srgb, var(--tglow,#284156) 10%, transparent), transparent 70%), var(--bg-2)}
:root[data-theme="night"] .base-tiles{filter:brightness(.7) contrast(1.05)}
:root[data-theme="night"] .base-tiles.osm-dark{filter:invert(.92) hue-rotate(180deg) brightness(.65) contrast(.95) saturate(.5)}
:root[data-theme="night"] .base-tiles.photo-dim{filter:brightness(.6) saturate(.8)}
:root[data-theme="night"] .nowcast{background:rgba(159,208,228,.05)}
:root[data-theme="night"] .hs.night{background:rgba(255,255,255,.025)}
.theme-anim, .theme-anim *{transition:background-color .6s, color .6s, border-color .6s!important}

/* ================= Hoiatused ühes reas: tähtsaim ees, ülejäänud nupu taga ================= */
.alerts{display:flex; flex-direction:column; gap:6px}
.alerts:not(:has(> :not([hidden]))){display:none}
.alerts > .al-fold{display:none!important}
.alerts-more{align-self:flex-start; order:99; background:none; border:1px solid var(--line); border-radius:999px; padding:3px 11px;
  font-size:12px; color:var(--muted); cursor:pointer; max-width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.alerts-more:hover{color:var(--ink); border-color:var(--muted)}
.alerts-more b{color:var(--ink); font-weight:600}
.alert-chip.road{background:rgba(159,208,228,.08); border-color:rgba(159,208,228,.35)}
.alert-chip.fog{background:rgba(207,227,238,.07); border-color:rgba(207,227,238,.3)}
.alert-chip.sky{background:rgba(246,201,76,.07); border-color:rgba(246,201,76,.3)}
.alert-chip{cursor:pointer}
.alert-chip .wdot{width:9px; height:9px; border-radius:50%; background:var(--muted)}

/* ================= Kaardi „Kihid“ menüü ================= */
.ly-btn{display:inline-flex; white-space:nowrap; align-items:center; gap:7px; background:var(--glass); backdrop-filter:blur(6px); border:1px solid var(--line);
  border-radius:var(--radius-m); padding:6px 11px; font-size:13px; cursor:pointer; color:var(--ink)}
.ly-btn small{color:var(--muted); font-size:12px}
.ly-btn small:not(:empty)::before{content:"· "}
.ly-btn[aria-expanded="true"]{border-color:var(--ice)}
.ly-menu{background:var(--glass-2); backdrop-filter:blur(10px); border:1px solid var(--line); border-radius:12px; padding:10px 12px 12px;
  width:min(340px, calc(100vw - 80px)); max-height:calc(100% - 20px); overflow:auto; overscroll-behavior:contain; box-shadow:0 10px 34px rgba(0,0,0,.35)}
.ly-menu h4{margin:6px 0 6px; font-size:11.5px; font-weight:600; color:var(--faint); text-transform:uppercase; letter-spacing:.04em}
.ly-menu h4:first-child{margin-top:0}
.ly-menu .lbl-modes{display:grid; grid-template-columns:1fr 1fr; background:none; backdrop-filter:none; border:0; gap:4px; max-width:none; overflow:visible}
.ly-menu .lbl-modes button{border:1px solid var(--line); border-radius:8px; padding:6px 8px; text-align:left; font-size:12.5px}
.ly-menu .layer-toggles{display:grid; grid-template-columns:1fr 1fr; gap:7px 10px; background:none; backdrop-filter:none; border:0; padding:0; max-width:none}
.ly-menu .layer-toggles label:last-child{grid-column:1/-1}
.map-overlay.map-top{max-height:calc(100% - 90px)}
.map-tools{max-height:100%}

/* ================= Radari kiirus ja režiim ================= */
.rt-opts{display:inline-flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; flex:none}
.rt-opts button{background:none; border:0; padding:3px 9px; font-size:11.5px; color:var(--muted); cursor:pointer; min-width:34px}
.rt-opts button + button{border-left:1px solid var(--line)}
.rt-opts button[aria-pressed="true"]{color:var(--ink); background:rgba(159,208,228,.14)}

/* ================= Järgmised 6 tundi (telefon) ja voldik ================= */
.next6{display:none}
.ov-fold{display:contents}
.ov-fold-btn{display:none}
@media (max-width:700px){
  .next6{display:grid; grid-template-columns:repeat(6,1fr); gap:2px; border-top:1px solid var(--line); padding-top:8px}
  .next6 .n6{display:grid; justify-items:center; gap:1px; font-size:11.5px; color:var(--muted)}
  .next6 svg{width:26px; height:26px}
  .next6 .t{font-size:15px; font-weight:650; color:var(--ink)}
  .next6 .p{font-size:10.5px; color:#5fa8e8; min-height:1.3em}
  .ov-fold{display:none}
  .ov-fold.open{display:flex; flex-direction:column; gap:10px}
  .ov-fold-btn{display:flex; justify-content:space-between; align-items:center; width:100%; background:none; border:1px solid var(--line);
    border-radius:10px; padding:8px 12px; font-size:13px; color:var(--muted); cursor:pointer}
  .ov-fold-btn::after{content:"▾"; transition:transform .2s}
  .ov-fold-btn[aria-expanded="true"]::after{transform:rotate(180deg)}
  .now-source{display:none}
  .ly-btn small{display:none}
  .lightning-sum{font-size:11.5px; max-width:55vw}
  .ly-menu{width:calc(100vw - 40px)}
}
body.wallpaper .next6,body.wallpaper .ov-fold-btn,body.wallpaper .alerts-more{display:none!important}

/* ================= Laadimise ajal hall vari (leht ei hüppa) ================= */
@keyframes skel{0%{background-position:100% 0} 100%{background-position:-100% 0}}
body:not([data-ready]) .now-temp:empty{display:block; width:150px; height:84px}
body:not([data-ready]) .now-phen:empty{height:20px; width:120px}
body:not([data-ready]) .now-feels:empty{height:16px; width:170px}
body:not([data-ready]) #keyTiles:empty{min-height:128px}
body:not([data-ready]) #nowcast:empty{min-height:40px}
body:not([data-ready]) #next6:empty{min-height:72px}
body:not([data-ready]) #hourStrip:empty{min-height:108px; margin:10px 14px 10px 20px}
body:not([data-ready]) #days5:empty{min-height:108px; margin:10px 14px}
body:not([data-ready]) #frameTime{color:transparent}
body:not([data-ready]) :is(.now-temp,.now-phen,.now-feels,#keyTiles,#nowcast,#next6,#hourStrip,#days5):empty{
  background:linear-gradient(90deg, var(--line-soft) 25%, color-mix(in srgb, var(--line) 70%, transparent) 45%, var(--line-soft) 65%) 0 0/200% 100%;
  animation:skel 1.4s linear infinite; border-radius:8px}
.tab.page .chart-wrap:has(canvas:not(.ready)){background:linear-gradient(90deg, transparent 25%, var(--line-soft) 45%, transparent 65%) 0 0/200% 100%; animation:skel 1.6s linear infinite; border-radius:8px}
@media (prefers-reduced-motion:reduce){ body:not([data-ready]) :is(.now-temp,#keyTiles,#hourStrip,#days5):empty{animation:none} }
body.wallpaper .ov-now > .hour-strip,body.wallpaper .ov-now > .days5,body.wallpaper .wp-foot{flex-shrink:0}
body.wallpaper .ov-summary{min-height:0; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical}

/* ================= Kaardi tähised: igal kihil oma värv ================= */
.map-right{display:flex; flex-direction:column; align-items:flex-end; gap:6px; margin-left:auto; max-height:100%; min-width:0}
.map-right > *{pointer-events:auto}
.st-label::before{content:""; flex:none; width:6px; height:6px; border-radius:1.5px; background:var(--lk,#fff); margin-right:4px; box-shadow:0 0 0 1px rgba(0,0,0,.35)}
.st-label.ext{--lk:#f1cb4a}
.st-label.ext em{color:#f1cb4a}
.map-legend{background:var(--glass); backdrop-filter:blur(6px); border:1px solid var(--line); border-radius:var(--radius-m); font-size:11.5px; color:var(--muted); cursor:default}
.map-legend:empty{display:none}
.map-legend ul{list-style:none; margin:0; padding:6px 8px; display:grid; gap:4px}
.map-legend li{display:flex; align-items:center; gap:6px; white-space:nowrap}
.map-legend .lg-l{display:none}
.map-legend:hover .lg-s,.map-legend.x .lg-s{display:none}
.map-legend:hover .lg-l,.map-legend.x .lg-l{display:inline}
.map-legend:hover,.map-legend.x{color:var(--ink)}
.map-legend li small{color:var(--faint)}
.leaflet-tooltip.st-tip.shifted::before{display:none}
.lg-sw{flex:none; width:16px; height:16px; display:grid; place-items:center}
.lg-sq{width:9px; height:9px; border-radius:2px; background:var(--c); box-shadow:0 0 0 1px rgba(0,0,0,.4)}
.lg-ring{width:12px; height:12px; border-radius:50%; border:2.5px solid var(--c); background:var(--f,#8aa1b2)}
.lg-cam{width:14px; height:14px; border-radius:4px; background:#ff8a5c; border:1.5px solid #fff}
.lg-line{width:16px; height:0; border-top:2px dashed var(--c)}
.lg-me{width:11px; height:11px; border-radius:50%; background:#4fb3ff; border:2px solid #fff; box-shadow:0 0 6px #4fb3ff}
.lg-dot{width:8px; height:8px; border-radius:50%; background:var(--c)}
.lg-storm{width:12px; height:12px; border-radius:50%; border:2px solid #ffb43d; background:rgba(255,180,61,.15)}
.ly-range{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--muted)}
.ly-range input{flex:1; accent-color:#7fbfdc}
.ly-range output{width:36px; text-align:right; color:var(--ink)}
@media (max-width:700px){ .map-legend li{font-size:11.5px} }
body.wallpaper .map-legend{display:none}

/* ================= Virmalised ja kuu ================= */
.aur-stage{display:grid; grid-template-columns:minmax(0,340px) minmax(0,1fr); gap:14px; margin:6px 0 10px}
.aur-globe,.aur-sky{position:relative; border-radius:14px; overflow:hidden; background:radial-gradient(120% 90% at 50% 40%, #0b1626, #02050a)}
.aur-globe canvas{display:block; width:100%; aspect-ratio:1; cursor:grab; touch-action:none}
.aur-globe canvas:active{cursor:grabbing}
.aur-sky canvas{display:block; width:100%; height:100%; min-height:300px}
.aur-cap{position:absolute; left:10px; bottom:8px; font-size:11px; color:rgba(220,235,245,.7); pointer-events:none; text-shadow:0 1px 3px #000}
.aur-sky .aur-cap{left:auto; right:10px; top:8px; bottom:auto}
.aur-ctl{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px}
.aur-ctl input[type=range]{flex:1 1 200px; accent-color:#7fe0a0}
.aur-ctl #aurTL{min-width:120px; font-size:13px; color:var(--ink)}
.aur-chips{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px; margin-bottom:12px}
.aur-chip{border:1px solid var(--line); border-radius:10px; padding:8px 10px; background:linear-gradient(180deg, rgba(127,224,160,.06), transparent)}
.aur-chip span{display:block; font-size:11.5px; color:var(--muted)}
.aur-chip b{display:block; font-size:15px; font-stretch:88%}
.aur-chip small{display:block; font-size:11px; color:var(--faint); margin-top:2px}
.moon-wrap{display:grid; grid-template-columns:minmax(0,260px) 1fr; gap:20px; align-items:center}
.moon-stage{border-radius:14px; background:radial-gradient(circle at 50% 50%, #0d1828, #02050a 70%); overflow:hidden}
.moon-stage canvas{display:block; width:100%; aspect-ratio:1}
.moon-info{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 18px; font-size:13px}
.moon-info span{display:block; color:var(--muted); font-size:12px}
.moon-info b{font-size:17px; font-stretch:85%}
.moon-info .note{grid-column:1/-1; margin:0}
.moon-path{margin-top:12px; border-radius:10px; overflow:hidden; background:linear-gradient(180deg, #0a1422, #050b14)}
.moon-path canvas{display:block; width:100%; height:230px}
@media (max-width:900px){ .aur-stage{grid-template-columns:1fr} .aur-sky canvas{min-height:240px} .moon-wrap{grid-template-columns:1fr} .moon-stage{max-width:260px; margin:0 auto; width:100%} }

/* ================= Teksti suurus ================= */
.tab.page, .ov-now, .ov-bottom{zoom:var(--fs,1)}

/* ================= Seaded ================= */
.sd{padding:0; border:1px solid var(--line); border-radius:18px; background:var(--bg-2); color:var(--ink); width:min(880px,96vw); height:min(720px,92vh);
  box-shadow:0 30px 80px rgba(0,0,0,.55); overflow:hidden}
.sd::backdrop{background:rgba(3,8,14,.62); backdrop-filter:blur(3px)}
.sd[open]{animation:sdIn .22s ease-out}
@keyframes sdIn{from{opacity:0; transform:translateY(10px) scale(.985)} to{opacity:1; transform:none}}
.sd-shell{display:grid; grid-template-columns:210px 1fr; grid-template-rows:auto 1fr; height:100%}
.sd-head{grid-column:1/-1; display:flex; align-items:center; gap:12px; padding:14px 18px; border-bottom:1px solid var(--line);
  background:linear-gradient(90deg, rgba(159,208,228,.08), transparent 60%)}
.sd-head h2{margin:0; font-size:18px; color:var(--ink); font-weight:650}
.sd-saved{margin-left:auto; font-size:12.5px; color:#7fe0a0; opacity:0; transition:opacity .3s}
.sd-saved.show{opacity:1} .sd-saved.err{color:var(--w-orange)}
.sd-x{background:none; border:1px solid var(--line); color:var(--muted); width:32px; height:32px; border-radius:50%; cursor:pointer; font-size:14px}
.sd-x:hover{color:var(--ink); border-color:var(--muted)}
.sd-nav{display:flex; flex-direction:column; gap:2px; padding:12px 10px; border-right:1px solid var(--line); overflow:auto}
.sd-nav button{display:flex; align-items:center; gap:10px; text-align:left; background:none; border:0; border-radius:10px; padding:9px 10px; color:var(--muted); cursor:pointer; font-size:14px}
.sd-nav button i{display:grid; place-items:center; width:26px; height:26px; border-radius:8px; background:rgba(159,208,228,.08); font-style:normal; font-size:13px; color:var(--ice)}
.sd-nav button:hover{color:var(--ink); background:rgba(159,208,228,.05)}
.sd-nav button.on{color:var(--ink); background:rgba(159,208,228,.12)}
.sd-nav button.on i{background:var(--ice); color:var(--bg)}
.sd-main{overflow:auto; padding:18px 24px 28px; scrollbar-width:thin}
.sd-sec{display:none} .sd-sec.on{display:block; animation:sdIn .18s ease-out}
.sd-sec h3{margin:0 0 4px; font-size:17px}
.sd-sec h4{margin:22px 0 8px; font-size:12px; text-transform:uppercase; letter-spacing:.05em; color:var(--faint); font-weight:600}
.sd-lead{margin:0 0 14px; color:var(--muted); font-size:13px; max-width:60ch}
.sd-row{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:11px 0; border-bottom:1px solid var(--line-soft); font-size:14px}
.sd-row.sd-col{flex-direction:column; align-items:stretch}
.sd-l{display:flex; flex-direction:column; gap:2px}
.sd-l small{color:var(--faint); font-size:12px; font-weight:400; max-width:52ch}
.sd-seg{display:inline-flex; flex-wrap:wrap; background:var(--bg); border:1px solid var(--line); border-radius:10px; padding:3px; gap:2px}
.sd-seg button{background:none; border:0; border-radius:7px; padding:6px 12px; font-size:13px; color:var(--muted); cursor:pointer}
.sd-seg button:hover{color:var(--ink)}
.sd-seg button.on{background:var(--ice); color:var(--bg); font-weight:600}
.sd select,.sd input[type=number],.sd input[type=time],.sd input[type=url]{background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:6px 9px; font:inherit; font-size:13.5px}
.sd input[type=number]{width:72px}
.sd input[type=url]{width:100%}
.sd select:focus,.sd input:focus{outline:2px solid var(--ice); outline-offset:1px}
.sd-preview{margin-top:16px; padding:12px 14px; border-radius:12px; border:1px dashed var(--line); background:rgba(159,208,228,.05)}
.sd-preview span{display:block; font-size:11.5px; color:var(--faint); text-transform:uppercase; letter-spacing:.05em}
.sd-preview b{font-size:15px; font-weight:550}
/* lüliti */
.sd-sw{cursor:pointer; display:inline-flex; align-items:center; position:relative}
.sd-row.sd-sw{display:flex}
.sd-sw input{position:absolute; opacity:0; width:0; height:0}
.sd-sw i{display:inline-block; flex:none; position:relative; width:40px; height:23px; border-radius:999px; background:var(--line); transition:background .2s}
.sd-sw i::after{content:""; position:absolute; left:3px; top:3px; width:17px; height:17px; border-radius:50%; background:#fff; transition:transform .2s; box-shadow:0 1px 3px rgba(0,0,0,.4)}
.sd-sw input:checked + i{background:#3fae7a}
.sd-sw input:checked + i::after{transform:translateX(17px)}
.sd-sw input:focus-visible + i{outline:2px solid var(--ice); outline-offset:2px}
.sd-sw-row{display:flex; align-items:center; gap:10px; font-size:13.5px; padding:6px 0}
.sd-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2px 18px; margin-bottom:10px}
.sd-range{display:flex; align-items:center; gap:10px; min-width:200px}
.sd-range input{flex:1; accent-color:#7fbfdc}
.sd-range output{width:40px; text-align:right}
.sd-btn{display:inline-flex; align-items:center; gap:6px; background:var(--ice); color:var(--bg); border:0; border-radius:8px; padding:7px 13px; font-size:13px; font-weight:600; cursor:pointer}
.sd-btn.ghost{background:none; color:var(--ink); border:1px solid var(--line); font-weight:500}
.sd-btn.ghost:hover{border-color:var(--muted)}
.sd-btn.danger{background:none; color:var(--w-red); border:1px solid rgba(230,83,79,.5); font-weight:500}
.sd-btns{display:flex; gap:8px}
.sd-card{border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:rgba(159,208,228,.04); margin:8px 0 6px}
.sd-steps{margin:0; padding-left:20px; font-size:13.5px; line-height:2.1}
.sd-steps code{background:var(--bg); padding:3px 7px; border-radius:6px; user-select:all}
.sd-rules{display:grid; gap:6px; transition:opacity .2s}
.sd-rules.off{opacity:.45; pointer-events:none}
.sd-rule{display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line); border-radius:12px; transition:opacity .2s}
.sd-rule b{display:block; font-size:14px} .sd-rule small{color:var(--faint); font-size:12px}
.sd-rule.off > div{opacity:.45}
.sd-ctl{display:flex; align-items:center; gap:6px; font-size:13px; color:var(--muted); white-space:nowrap; flex-wrap:wrap; justify-content:flex-end}
.sd-feel{display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--muted); margin-top:8px}
.sd-feel input{flex:1; accent-color:#f2933f}
.sd-feel-v{display:block; margin-top:6px; font-size:14px; color:var(--ink)}
@media (max-width:700px){
  .sd{width:100vw; height:100dvh; max-width:none; max-height:none; border-radius:0; border:0}
  .sd-shell{grid-template-columns:1fr; grid-template-rows:auto auto 1fr}
  .sd-head{padding:calc(10px + env(safe-area-inset-top)) 14px 10px}
  .sd-nav{flex-direction:row; border-right:0; border-bottom:1px solid var(--line); padding:8px; scrollbar-width:none}
  .sd-nav::-webkit-scrollbar{display:none}
  .sd-nav button{flex:none; white-space:nowrap; padding:7px 10px}
  .sd-nav button i{display:none}
  .sd-main{padding:14px 14px calc(30px + env(safe-area-inset-bottom))}
  .sd-row{flex-wrap:wrap}
  .sd-rule{grid-template-columns:auto 1fr}
  .sd-ctl{grid-column:1/-1; justify-content:flex-start}
  .sd-grid{grid-template-columns:1fr}
}
/* koha vahetus: andmed laevad, vana ilm hetkeks tuhmim */
body.switching .ov-now > :not(.alerts), body.switching .ov-bottom{opacity:.55; transition:opacity .25s}
body.switching #placeMeta{animation:pulse 1.2s infinite}

/* ================= Minu kohad: nimeta ümber, järjesta ================= */
.fav-list{list-style:none; margin:0 0 6px; padding:0; display:grid; gap:4px}
.fav-li{display:grid; grid-template-columns:auto minmax(0,1fr) auto auto; align-items:center; gap:6px; border:1px solid var(--line); border-radius:10px; padding:2px 6px 2px 4px; background:rgba(159,208,228,.03); transition:background .15s, border-color .15s}
.fav-li.on{border-color:var(--ice)}
.fav-li.over{border-color:#7fe0a0; background:rgba(127,224,160,.08)}
.fav-li.drag{opacity:.4}
.fav-grip{cursor:grab; color:var(--faint); padding:0 4px; user-select:none}
.fav-li .fav-go{display:grid; text-align:left; background:none; border:0; color:var(--ink); padding:7px 4px; cursor:pointer; font:inherit; min-width:0}
.fav-li .fav-go b{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.fav-li .fav-go small{color:var(--faint); font-size:11.5px}
.fav-li .fav-wx{display:flex; align-items:center; gap:4px; font-size:13px; white-space:nowrap}
.fav-li .fav-wx svg{width:22px; height:22px}
.fav-tools{display:flex; gap:2px; opacity:.55; transition:opacity .15s}
.fav-li:hover .fav-tools,.fav-li:focus-within .fav-tools{opacity:1}
.fav-t{background:none; border:0; color:var(--muted); width:26px; height:26px; border-radius:6px; cursor:pointer; font-size:13px}
.fav-t:hover:not(:disabled){background:rgba(159,208,228,.1); color:var(--ink)}
.fav-t:disabled{opacity:.25; cursor:default}
.fav-t.x:hover{color:var(--w-red)}
.fav-ren{width:100%; background:var(--bg); color:var(--ink); border:1px solid var(--ice); border-radius:6px; padding:6px 8px; font:inherit}
@media (max-width:700px){ .fav-tools{opacity:1} .fav-li{grid-template-columns:minmax(0,1fr) auto} .fav-grip{display:none} .fav-tools{grid-column:1/-1; justify-content:flex-end} }
.st-label.home{--lk:#c58bff; font-size:11px; padding:2px 4px; font-weight:600; border-bottom-width:1.5px; opacity:.93}
.st-label.home::before{border-radius:50%; width:6px; height:6px}

/* ================= Vaatlused: kompaktne, kaks veergu ilma aukudeta ================= */
.vcol{display:flex; flex-direction:column; gap:16px; min-width:0}
.vcol > .panel{margin:0!important}
.vcol .panel.fit .scroll-box{max-height:330px; overflow:auto}
[data-tab="vaatlused"] > .panel{margin-top:0!important}
[data-tab="vaatlused"].grid-2{row-gap:16px; align-items:start}
#camsNear .cam-grid{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(170px,250px); grid-template-columns:none; gap:10px; overflow-x:auto; scrollbar-width:thin; padding-bottom:4px}
#camsNear .cam img,#camsNear .cam-noimg{aspect-ratio:16/10}
#camsNear .smart-summary{font-size:14px; margin:0 0 8px}
#camsNear figcaption{font-size:12px}
[data-tab="vaatlused"] .readings{gap:4px 18px}
.taf-c{font-size:13px}
.rank > :last-child{white-space:nowrap; text-align:right}
/* pikk sisu ei tohi paneelist välja joosta */
.panel{overflow-wrap:break-word}
.panel table{max-width:100%}
.panel :is(pre,code){white-space:pre-wrap; word-break:break-word}
#tafPanel:empty{display:none}

/* ================= Teede seisundi kaart ================= */
.road-map-wrap{position:relative; height:min(560px,70vh); border-radius:12px; overflow:hidden; border:1px solid var(--line)}
#roadMap{position:absolute; inset:0; background:var(--map-bg)}
#roadLegend{position:absolute; right:10px; top:10px; z-index:500}
.rd-lbl{display:inline-flex; align-items:center; gap:4px; transform:translate(-50%,-50%); background:var(--glass-2); border:2px solid var(--c); color:var(--ink);
  font:700 11.5px/1 var(--font); font-stretch:82%; padding:3px 6px 3px 4px; border-radius:999px; white-space:nowrap; box-shadow:0 1px 4px rgba(0,0,0,.5)}
.rd-lbl i{width:8px; height:8px; border-radius:50%; background:var(--c)}
.rd-lbl.stale{opacity:.5; border-style:dashed}

/* ================= Taevas: ülevaade, päike, päikesetuul ================= */
.sky-ov{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr)); gap:12px}
.sky-card{position:relative; display:flex; flex-direction:column; gap:3px; text-align:left; padding:16px 18px; border-radius:14px; border:1px solid var(--line);
  background:radial-gradient(120% 120% at 100% 0%, rgba(127,224,160,.06), transparent 60%), var(--bg-2); color:var(--ink); cursor:pointer; font:inherit; min-height:118px; transition:border-color .15s, transform .15s}
.sky-card:hover{border-color:var(--ice); transform:translateY(-1px)}
.sky-card span{font-size:12px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em}
.sky-card b{font-size:24px; font-stretch:82%; font-weight:700}
.sky-card small{color:var(--muted); font-size:12.5px}
.sky-card em{font-style:normal; font-size:12px; color:var(--faint); margin-top:4px} .sky-card em.up{color:#7fe0a0}
.sky-card-moon{position:absolute; right:14px; top:14px; width:44px; height:44px}
.sw-verdict{font-size:15px; margin:0 0 12px; padding:10px 12px; border-radius:10px; border-left:4px solid var(--line); background:rgba(159,208,228,.05)}
.sw-verdict.hi{border-color:#7fe0a0; background:rgba(127,224,160,.1)} .sw-verdict.mid{border-color:#a8e06b} .sw-verdict.lo{border-color:#f1cb4a} .sw-verdict.no{border-color:var(--faint)}
.sw-now{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px 14px; margin-bottom:10px}
.sw-now span{display:block; font-size:11.5px; color:var(--muted)} .sw-now b{font-size:20px; font-stretch:82%} .sw-now b small{font-size:11px; color:var(--muted); font-weight:400}
.sw-now b.neg{color:#ff8a7a} .sw-now > div > small{display:block; font-size:11px; color:var(--faint)}
.sw-charts{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.sw-charts h4{margin:0 0 2px; font-size:11.5px; color:var(--muted); font-weight:500}
.acam-list{display:grid; gap:6px}
.acam{position:relative; display:grid; grid-template-columns:1fr auto; column-gap:10px; padding:9px 34px 9px 12px; border:1px solid var(--line); border-radius:10px; color:var(--ink); text-decoration:none}
.acam:hover{border-color:#7fe0a0}
.acam b{font-size:13.5px} .acam span{color:var(--muted); font-size:12px; grid-column:1} .acam small{grid-row:1/3; grid-column:2; align-self:center; color:var(--faint); font-size:11.5px; text-align:right}
.acam i{position:absolute; right:12px; top:50%; transform:translateY(-50%); font-style:normal; color:var(--muted)}
.sun-path{border-radius:12px; overflow:hidden; background:linear-gradient(180deg,#0a1422,#050b14); margin-bottom:14px}
.sun-path canvas{display:block; width:100%; height:170px}
.sun-g{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px 18px}
.sun-g span{display:block; font-size:12px; color:var(--muted)} .sun-g b{font-size:18px; font-stretch:84%} .sun-g small{display:block; font-size:11.5px; color:var(--faint)}
@media (max-width:900px){ .sw-now,.sun-g{grid-template-columns:repeat(2,minmax(0,1fr))} .sw-charts{grid-template-columns:1fr} }
.aur-globe{display:flex; align-items:center}
.aur-globe canvas{flex:1}

/* ================= Ülevaade: kokkuvõte, ilm temperatuuri taga, vihmataimer ================= */
body:not(.wallpaper) .ov-now .ov-summary{order:0; font-size:14.5px; line-height:1.5; color:var(--ink); margin:0; padding:2px 2px 0}
body:not(.wallpaper) .ov-now .conf-chip{align-self:flex-start; padding:3px 10px 3px 4px; border-radius:999px; gap:6px}
body:not(.wallpaper) .ov-now .conf-chip small{display:none}
body:not(.wallpaper) .ov-now .conf-chip svg{width:24px; height:24px}
body:not(.wallpaper) .ov-now .conf-chip b{font-size:12px; font-weight:500; color:var(--muted)}
.now.hero{position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; padding:18px 14px 14px; border-radius:18px; overflow:hidden; isolation:isolate;
  background:radial-gradient(130% 100% at 50% 0%, color-mix(in srgb, var(--tglow,#284156) 22%, transparent), transparent 70%), rgba(159,208,228,.04);
  border:1px solid var(--line-soft); min-height:190px; justify-content:center}
.now.hero > :not(canvas){position:relative; z-index:1}
.wx-fx{position:absolute; inset:0; width:100%; height:100%; z-index:0; pointer-events:none}
.now.hero .now-main{justify-content:center}
.now.hero .now-phen{margin-top:4px}
.now.hero .now-source{opacity:.75}
/* vihmataimer */
.rain-timer{border-radius:16px; border:1px solid var(--line); padding:12px 14px 8px; background:rgba(159,208,228,.05); transition:background .4s, border-color .4s}
.rain-timer:empty{display:none}
.rain-timer.st-near{border-color:rgba(61,143,224,.55); background:linear-gradient(135deg, rgba(61,143,224,.16), rgba(61,143,224,.04))}
.rain-timer.st-soon,.rain-timer.st-rain{border-color:rgba(61,143,224,.8); background:linear-gradient(135deg, rgba(61,143,224,.26), rgba(61,143,224,.06))}
.rain-timer.st-dry{background:rgba(127,224,160,.04)}
.rt-row{display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px}
.rt-txt b{display:block; font-size:16px; font-weight:650}
.rt-txt small{display:block; color:var(--muted); font-size:12.5px; margin-top:1px}
.rt-big{display:flex; align-items:baseline; gap:3px; font-variant-numeric:tabular-nums}
.rt-big span{font-size:40px; font-weight:750; font-stretch:72%; line-height:1; color:#9fd0ff}
.rt-big small{font-size:12px; color:var(--muted)}
.rt-big.tick span{animation:rtTick .6s ease-out}
@keyframes rtTick{0%{transform:translateY(-8px); opacity:0} 100%{transform:none; opacity:1}}
.rt-umb{width:46px; height:46px; overflow:visible}
.rt-umb .rt-canopy{fill:rgba(159,208,228,.10); stroke:var(--muted); stroke-width:2.6; stroke-linejoin:round}
.rt-umb .rt-spoke,.rt-umb .rt-tip,.rt-umb .rt-shaft{fill:none; stroke:var(--muted); stroke-width:2.6; stroke-linecap:round}
.rt-umb .rt-spoke{stroke-width:1.6; opacity:.7}
.rt-umb .rt-open-g{transform-origin:32px 30px; transform:scale(.2,.9); opacity:0; transition:transform .55s cubic-bezier(.3,1.4,.5,1), opacity .3s}
.rt-umb .rt-closed-g{transition:opacity .3s}
.rt-umb.open .rt-open-g{transform:none; opacity:1}
.rt-umb.open .rt-closed-g{opacity:0}
.rt-umb.open .rt-canopy{fill:rgba(61,143,224,.38); stroke:#7cbcff}
.rt-umb.open .rt-spoke,.rt-umb.open .rt-tip,.rt-umb.open .rt-shaft{stroke:#7cbcff}
.rt-drops path{stroke:#7cc0f0; stroke-width:2.4; stroke-linecap:round; animation:rtDrop 1s linear infinite}
@keyframes rtDrop{0%{transform:translate(0,-4px); opacity:0}30%{opacity:1}100%{transform:translate(-3px,12px); opacity:0}}
.rt-drops path:nth-child(2){animation-delay:.25s}.rt-drops path:nth-child(3){animation-delay:.5s}.rt-drops path:nth-child(4){animation-delay:.75s}
.rt-rib{display:grid; grid-template-columns:repeat(120,1fr); align-items:end; height:22px; margin-top:10px; gap:0; border-radius:4px; background:rgba(159,208,228,.06); overflow:hidden}
.rt-rib i{display:block; height:12%; background:rgba(159,208,228,.12)}
.rt-ticks{display:flex; justify-content:space-between; font-size:10.5px; color:var(--faint); margin-top:2px}
.rt-more{display:block; margin:6px 0 0 auto; background:none; border:0; color:var(--ice); font-size:12.5px; cursor:pointer; padding:2px 0}
.rt-more:hover{text-decoration:underline}
.nowcast.nc-collapsed{display:none}
body.wallpaper .rt-more{display:none}
@media (prefers-reduced-motion:reduce){ .rt-drops path{animation:none} }
.kt-l{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
body.wallpaper #nowcast{display:none!important}
body.wallpaper .now.hero{min-height:0; padding:10px}
/* kaardikastid mahuvad ka sülearvuti madalale ekraanile */
.leaflet-tooltip.st-tip{max-width:min(300px,70vw)}
.cam-tip img{max-height:min(190px,26vh); object-fit:cover}
@media (max-height:820px){ .leaflet-tooltip.st-tip{width:260px; padding:8px 10px} .cam-tip img{max-height:min(150px,22vh)} }

/* ================= Vaatlused: kompaktne ühe ekraani vaade ================= */
.vgrid{display:grid; grid-template-columns:minmax(0,2fr) minmax(min(300px,100%),1fr); gap:12px; align-items:start}
.vgrid > .panel{margin:0!important; padding:12px 16px}
.vgrid > .v-read{grid-column:1}
.vgrid > .v-near{grid-column:2; grid-row:2 / span 3; align-self:stretch; display:flex; flex-direction:column; min-height:0}
.vgrid > .v-near .scroll-box{flex:1; max-height:none; min-height:200px; overflow:auto}
.vgrid > .v-est,.vgrid > .v-hood{grid-column:1}
.vgrid > .v-cams{grid-column:1 / -1}
.vgrid > .subtabs{grid-column:1 / -1}
.vgrid h2{margin-bottom:6px}
.vgrid .readings{grid-template-columns:repeat(4,minmax(0,1fr)); gap:0 14px}
.vgrid .rd{padding:5px 0}
.vgrid .rd-val{font-size:20px}
.vgrid .rd-src{font-size:11px}
.vgrid .hood-g{gap:6px 14px}
.vgrid .hood-g b{font-size:18px}
.vgrid .stations td{padding-top:5px; padding-bottom:5px}
@media (max-width:1100px){ .vgrid{grid-template-columns:1fr} .vgrid > *{grid-column:1!important; grid-row:auto!important} .vgrid .readings{grid-template-columns:repeat(2,minmax(0,1fr))} .vgrid > .v-near .scroll-box{max-height:330px} }

/* ================= Teekond ================= */
.tk-form{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto auto auto; gap:8px; align-items:end}
.tk-f{position:relative; display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--muted)}
.tk-f input{background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:10px; padding:9px 11px; font:inherit; font-size:14px; min-width:0}
.tk-f input:focus{outline:2px solid var(--ice)}
.tk-swap{height:38px; width:38px; border-radius:50%; border:1px solid var(--line); background:none; color:var(--muted); cursor:pointer; font-size:16px}
.tk-mode{margin:0; height:38px} .tk-mode button{padding:0 12px}
.tk-go{height:40px; padding:0 18px; border:0; border-radius:10px; background:var(--ice); color:var(--bg); font-weight:650; cursor:pointer; font:inherit; font-weight:650}
.tk-sug{position:absolute; top:100%; left:0; right:0; z-index:900; list-style:none; margin:4px 0 0; padding:4px; background:var(--glass-2); border:1px solid var(--line); border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.4)}
.tk-sug button{display:block; width:100%; text-align:left; background:none; border:0; color:var(--ink); padding:7px 8px; border-radius:6px; cursor:pointer}
.tk-sug button:hover{background:rgba(159,208,228,.1)} .tk-sug span{display:block; font-size:11.5px; color:var(--muted)}
.tk-chips{display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:10px 0}
.tk-chip{background:none; border:1px solid var(--line); color:var(--ink); border-radius:999px; padding:4px 11px; font-size:12.5px; cursor:pointer}
.tk-chip:hover{border-color:var(--ice)}
.sw-verdict.warn{border-color:#f2933f; background:rgba(242,147,63,.1)}
.tk-sum{display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:13.5px; color:var(--muted); margin-bottom:8px}
.tk-sum b{color:var(--ink); font-size:16px}
.tk-h{margin:12px 0 6px; font-size:12px; color:var(--muted); font-weight:600} .tk-h small{font-weight:400; color:var(--faint)}
.tk-deps{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(40px,1fr); gap:3px; height:76px; overflow-x:auto}
.tk-dep{display:flex; flex-direction:column; justify-content:flex-end; align-items:center; gap:3px; background:none; border:1px solid transparent; border-radius:6px; cursor:pointer; padding:2px; color:var(--muted); font-size:11px}
.tk-dep i{display:block; width:70%; border-radius:3px 3px 0 0}
.tk-dep.on{border-color:var(--ice); color:var(--ink)} .tk-dep.best{color:#7fe0a0; font-weight:700} .tk-dep.best::before{content:"★"; font-size:10px}
.tk-map-wrap{position:relative; height:min(420px,55vh); border-radius:12px; overflow:hidden; border:1px solid var(--line); margin:12px 0}
#tkMap{position:absolute; inset:0; background:var(--map-bg)}
.tk-pts{display:grid; gap:2px}
.tk-pt{display:grid; grid-template-columns:64px 70px minmax(120px,auto) 1fr; gap:10px; align-items:center; padding:6px 8px; border-left:4px solid var(--c); background:rgba(159,208,228,.03); border-radius:0 6px 6px 0; font-size:13px}
.tk-km{color:var(--muted)} .tk-t{font-weight:600}
.tk-why{display:flex; flex-wrap:wrap; gap:4px} .tk-why b{background:rgba(242,147,63,.15); color:#ffc48a; padding:1px 7px; border-radius:999px; font-weight:500; font-size:12px}
.tk-why em{font-style:normal; color:var(--muted); font-size:12px}
.cm-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; transition:opacity .2s}
.cm-grid.off{opacity:.5}
.cm-grid label,.cm-days{display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--muted)}
.cm-grid select,.cm-grid input[type=time]{background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:7px 9px; font:inherit}
.cm-days > div{display:flex; gap:3px}
.cm-day input{position:absolute; opacity:0; width:0}
.cm-day b{display:grid; place-items:center; width:28px; height:30px; border-radius:7px; border:1px solid var(--line); color:var(--muted); cursor:pointer; font-weight:500}
.cm-day input:checked + b{background:var(--ice); color:var(--bg); border-color:var(--ice)}
.cm-next{display:grid; gap:4px; margin-top:12px; padding:10px 12px; border-left:4px solid var(--c); border-radius:0 10px 10px 0; background:rgba(159,208,228,.05)}
.cm-next button{justify-self:start}
@media (max-width:900px){ .tk-form{grid-template-columns:1fr} .tk-swap{justify-self:center} .tk-pt{grid-template-columns:54px 60px 1fr} .tk-why{grid-column:1/-1} }

/* ================= Parvlaevad ================= */
#ferryList{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr)); gap:10px}
.fe-card{border:1px solid var(--line); border-radius:14px; padding:12px 14px; border-left:5px solid #50c878}
.fe-card.mid{border-left-color:#f2933f} .fe-card.bad{border-left-color:#e3364c; background:rgba(227,54,76,.06)}
.fe-head{display:flex; justify-content:space-between; gap:10px; align-items:flex-start}
.fe-head b{display:block; font-size:15px} .fe-head small{color:var(--muted); font-size:12px}
.fe-badge{font-size:12px; padding:3px 9px; border-radius:999px; background:rgba(80,200,120,.15); color:#8fe3a8; white-space:nowrap}
.fe-card.mid .fe-badge{background:rgba(242,147,63,.15); color:#ffbd7a} .fe-card.bad .fe-badge{background:rgba(227,54,76,.18); color:#ff8a8a}
.fe-text{font-size:13px; margin:6px 0 8px; color:var(--ink)}
.fe-bar{display:grid; grid-auto-flow:column; grid-auto-columns:1fr; gap:1px; height:14px; border-radius:4px; overflow:hidden}
.fe-ticks{display:flex; justify-content:space-between; font-size:10.5px; color:var(--faint); margin-top:2px}

/* ================= Põllumajandus, seened, talv ================= */
.pol-row{display:flex; flex-wrap:wrap; gap:8px}
.pol{border:1px solid var(--line); border-left:4px solid var(--c,var(--faint)); border-radius:10px; padding:7px 12px; min-width:110px}
.pol span{display:block; font-size:12px; color:var(--muted)} .pol b{font-size:15px} .pol small{display:block; font-size:11px; color:var(--faint)}
.ag-item{display:grid; gap:2px; padding:9px 0; border-bottom:1px solid var(--line-soft); font-size:13.5px}
.ag-item b{font-size:13px; color:var(--muted); font-weight:600} .ag-item.ag-warn b{color:#ffbd7a}
.mu-top,.air-top{display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:center; margin-bottom:12px}
.mu-days{display:grid; grid-template-columns:repeat(6,1fr); gap:6px; height:110px; align-items:end; margin-bottom:6px}
.mu-days > div{display:flex; flex-direction:column; align-items:center; justify-content:flex-end; height:100%; gap:2px; font-size:11.5px; color:var(--muted)}
.mu-days i{display:block; width:60%; border-radius:4px 4px 0 0} .mu-days b{color:var(--ink); font-size:13px}
.wi-top{display:grid; grid-template-columns:auto 1fr; gap:20px; align-items:center; margin-bottom:12px}
.wi-ice{display:flex; gap:14px; align-items:center}
.wi-ice b{display:block; font-size:36px; font-stretch:75%; font-weight:750} .wi-ice span,.wi-ice small{display:block; color:var(--muted); font-size:12px}
.wi-gauge{position:relative; width:26px; height:150px; border-radius:8px; background:rgba(159,208,228,.08); overflow:visible; border:1px solid var(--line)}
.wi-gauge i{position:absolute; left:0; right:0; bottom:0; border-radius:0 0 7px 7px}
.wi-gauge span{position:absolute; right:32px; transform:translateY(50%); font-size:10px; color:var(--faint)}
.wi-gauge span::before{content:""; position:absolute; left:calc(100% + 4px); top:50%; width:26px; border-top:1px dashed rgba(159,208,228,.35)}
.wi-ice{padding-left:22px}
@media (max-width:700px){ .wi-top,.mu-top{grid-template-columns:1fr} }

/* ================= Elekter ja päike ================= */
.en-cards{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:10px}
.en-cards > div{border:1px solid var(--line); border-radius:12px; padding:10px 14px}
.en-cards > div.best{border-color:rgba(127,224,160,.5); background:rgba(127,224,160,.06)}
.en-cards span{display:block; font-size:12px; color:var(--muted)} .en-cards b{display:block; font-size:22px; font-stretch:82%} .en-cards small{display:block; font-size:12px; color:var(--faint)}
.en-set{margin-top:10px} .en-set summary{cursor:pointer; color:var(--ice); font-size:13px}
.en-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin-top:10px}
.en-grid label{display:flex; flex-direction:column; gap:3px; font-size:12px; color:var(--muted)}
.en-grid input,.en-grid select{background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:6px 8px; font:inherit; width:100px}
.sunmap-wrap{position:relative; height:min(420px,55vh); border-radius:12px; overflow:hidden; border:1px solid var(--line)}
#sunMap{position:absolute; inset:0; background:var(--map-bg)}
.sunmap-ctl{display:flex; align-items:center; gap:10px; margin-top:8px} .sunmap-ctl input{flex:1; accent-color:#ffd27a} .sunmap-ctl span{min-width:150px; font-size:13px}
@media (max-width:800px){ .en-cards{grid-template-columns:1fr} }

/* ================= Õhk ================= */
.air-word{font-size:22px; text-transform:capitalize}
.air-pol{display:grid; gap:8px}
.ap{display:grid; grid-template-columns:minmax(150px,1fr) 1.2fr auto; gap:10px; align-items:center; font-size:12.5px}
.ap-bar{position:relative; display:flex; height:8px; border-radius:4px; overflow:visible}
.ap-bar i{display:block; height:100%; opacity:.55} .ap-bar i:first-child{border-radius:4px 0 0 4px} .ap-bar i:last-of-type{border-radius:0 4px 4px 0}
.ap-bar b{position:absolute; top:-4px; width:3px; height:16px; background:#fff; border-radius:2px; box-shadow:0 0 0 1px rgba(0,0,0,.5); transform:translateX(-50%)}
.ap em{font-style:normal; color:var(--muted); white-space:nowrap}
.air-bw{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px}
.air-bw > div{border:1px solid var(--line); border-radius:12px; padding:10px 12px}
.air-bw span{display:block; font-size:12px; color:var(--muted)} .air-bw b{display:block; font-size:19px} .air-bw small{color:var(--faint); font-size:12px}
.air-rank{display:grid; gap:3px; max-height:360px; overflow:auto}
.air-rank > div{display:grid; grid-template-columns:24px 110px 1fr 30px; gap:8px; align-items:center; font-size:13px}
.air-rank i{display:block; height:8px; border-radius:4px} .air-rank .n{color:var(--faint)} .air-rank b{text-align:right}
@media (max-width:700px){ .ap{grid-template-columns:1fr} .air-bw{grid-template-columns:1fr} }

/* ================= Lennuilm ================= */
.av-top{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.4fr); gap:12px; margin-bottom:12px}
.av-drone{display:grid; gap:3px; border:1px solid var(--line); border-radius:12px; padding:12px 14px}
.av-drone.ok{border-color:rgba(80,200,120,.5); background:rgba(80,200,120,.06)} .av-drone.no{border-color:rgba(242,147,63,.5); background:rgba(242,147,63,.06)}
.av-drone span{font-size:12px; color:var(--muted)} .av-drone b{font-size:20px} .av-drone small{font-size:12px; color:var(--muted)}
.av-now{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px}
.av-now > div{border:1px solid var(--line); border-radius:12px; padding:10px 12px}
.av-now span{display:block; font-size:12px; color:var(--muted)} .av-now b{display:block; font-size:18px} .av-now small{font-size:11.5px; color:var(--faint)}
.av-ap{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:10px}
.av-a{border:1px solid var(--line); border-top:4px solid var(--c); border-radius:12px; padding:10px 12px; display:grid; gap:4px}
.av-h{display:flex; justify-content:space-between; align-items:center} .av-cat{font-weight:800; color:var(--c); letter-spacing:.04em}
.av-a > small{color:var(--muted); font-size:12px}
.av-g{display:grid; grid-template-columns:auto 1fr; gap:2px 10px; font-size:12.5px} .av-g span{color:var(--muted)}
.av-wt th{font-size:11.5px; color:var(--muted); font-weight:500; text-align:left}
.av-arr{display:inline-block; font-style:normal; color:var(--ice); margin-right:3px}
.av-flag{font-size:11px; background:rgba(242,147,63,.15); color:#ffbd7a; padding:1px 6px; border-radius:999px; margin-right:3px; font-weight:500}
@media (max-width:900px){ .av-top{grid-template-columns:1fr} .av-now{grid-template-columns:1fr 1fr 1fr} }
.vgrid .est-now{grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); gap:6px}
.vgrid .est-now > *{padding:7px 9px!important}
.vgrid .est-now b{font-size:18px!important}
.tk-pts.short .tk-pt.calm{display:none}
.tk-more{background:none; border:0; color:var(--ice); cursor:pointer; font-size:12.5px; padding:6px 0}
.av-wt{width:100%; border-collapse:collapse; font-size:13px}
.av-wt th,.av-wt td{padding:5px 8px; text-align:left; border-bottom:1px solid var(--line-soft); white-space:nowrap}
.av-wt td small{color:var(--faint)}
.mu-top .skyc-ring b,.air-top .skyc-ring b{width:78%; height:78%}

/* naaberjaamad: igal allikal oma värv; lennujaam lennukiga */
.st-label.ext-fi{--lk:#6ea8ff}.st-label.ext-fi em{color:#6ea8ff}
.st-label.ext-se{--lk:#f1cb4a}.st-label.ext-se em{color:#f1cb4a}
.st-label.ext-air{--lk:#ff7eb6}.st-label.ext-air::before{display:none}
.st-label.ext-air em{order:-1; margin:0 3px 0 0; display:inline-grid}
.lj-i{width:11px; height:11px; fill:#ff7eb6; color:#ff7eb6}
.lj-i path{fill:currentColor}
/* välgulöök */
.ltg{width:100%; height:100%; display:block; overflow:visible; filter:drop-shadow(0 0 2px rgba(0,0,0,.7))}
.ltg path{fill:var(--c); stroke:rgba(40,25,0,.55); stroke-width:1; stroke-linejoin:round}
.ltg.fresh{animation:ltgFlash 1.2s ease-out 3}
@keyframes ltgFlash{0%{filter:drop-shadow(0 0 8px #fff7b0) brightness(2)}100%{filter:drop-shadow(0 0 2px rgba(0,0,0,.7))}}
/* äikesepilv */
.tcloud{display:block; width:var(--s,40px); height:var(--s,40px)}
.tcloud svg{width:100%; height:100%; overflow:visible}
.tcloud .tc-b{fill:#3a4252; stroke:#ffb43d; stroke-width:1.6; filter:drop-shadow(0 0 6px rgba(255,180,61,.55))}
.tcloud .tc-bolt{fill:#ffe14a; animation:tcFlash var(--per,1.5s) steps(1) infinite}
.tcloud.near .tc-b{stroke:#ff6a3d; filter:drop-shadow(0 0 10px rgba(255,106,61,.8))}
@keyframes tcFlash{0%{opacity:1}12%{opacity:.15}20%{opacity:1}55%{opacity:0}100%{opacity:0}}
.tcloud-lg svg{width:16px; height:16px}
.tcloud-lg .tc-b{fill:#3a4252; stroke:#ffb43d; stroke-width:3}
.tcloud-lg .tc-bolt{fill:#ffe14a}

.cam-st-g{margin-top:6px}
.cam-tip .cam-st-g,.cam-pop .cam-st-g{display:grid; grid-template-columns:1fr 1fr; gap:2px 12px}

.aq-pin{display:inline-grid; place-items:center; min-width:26px; height:20px; padding:0 5px; border-radius:10px; background:rgba(8,14,22,.85);
  border:2px solid var(--c); color:var(--c); font-size:11px; font-weight:700; box-shadow:0 0 10px color-mix(in srgb, var(--c) 45%, transparent); transform:translate(-50%,-50%)}

.sun-field{image-rendering:auto; filter:blur(2px)}
.sun-pt{display:inline-block; transform:translate(-50%,-50%); font-size:10.5px; font-weight:650; padding:1px 4px; border-radius:6px; background:rgba(8,14,22,.55); color:#cfd8e0; white-space:nowrap}
.sun-pt.sun{color:#ffd27a}.sun-pt.mix{color:#e6d6a8}.sun-pt.cloud{color:#9aa8b3}.sun-pt.night{color:#8aa1b2; background:rgba(8,14,22,.35)}

/* kaamera: üks märk. Ääris = tee seisund (märg/jää värviga), sinine kuma = sajab. Lisatäppe pole. */
.cam-pin.wet{border-color:var(--c)}
.cam-pin.linn{width:14px; height:14px; border-radius:4px; border-width:1.5px; background:#7fb2e0}
.cam-pin.linn svg{width:9px; height:9px; fill:#0d2236}
.cam-pin.raining{box-shadow:0 0 0 2px rgba(61,143,224,.0), 0 0 10px 3px rgba(61,143,224,.75); animation:camRain 2s ease-in-out infinite}
@keyframes camRain{50%{box-shadow:0 0 0 2px rgba(61,143,224,.35), 0 0 4px 1px rgba(61,143,224,.4)}}
/* droonikaart */
.uas-wrap{height:min(62vh,560px); border-radius:10px; overflow:hidden; margin:8px 0}
#uasMap{height:100%; background:#0b1118}
.uas-ctl{display:flex; flex-wrap:wrap; gap:6px 16px; align-items:center; font-size:12.5px; color:var(--muted)}
.uas-leg{display:inline-flex; gap:4px 10px; flex-wrap:wrap; margin-left:auto}
.uas-leg i{display:inline-block; width:10px; height:10px; border-radius:2px; background:var(--c); margin-right:3px; vertical-align:-1px}
.uas-here{margin:2px 0 8px}
.uas-v{display:inline-block; font-weight:650; padding:3px 9px; border-radius:8px; background:rgba(80,200,120,.14); color:#7fe0a0}
.uas-v.PROHIBITED{background:rgba(227,54,76,.16); color:#ff8a96}
.uas-v.REQ_AUTHORISATION{background:rgba(242,147,63,.16); color:#ffb070}
.uas-v.CONDITIONAL{background:rgba(241,203,74,.16); color:#f1cb4a}
.uas-pop .uas-z{border-top:1px solid var(--line-soft); margin-top:8px; padding-top:6px}
.uas-pop{max-height:360px; overflow:auto}
.uas-msg{font-size:12px; color:var(--muted); margin:6px 0 2px; line-height:1.4}

.moon-cal-h{display:flex; justify-content:space-between; align-items:baseline; margin:14px 0 6px; font-size:13px}
.moon-cal{border-radius:10px; overflow:hidden; background:linear-gradient(180deg, #08111d, #03070d)}
.moon-cal canvas{display:block; width:100%; height:96px}
@media (max-width:900px){ .moon-info{grid-template-columns:repeat(2,minmax(0,1fr))} .moon-cal{overflow-x:auto} .moon-cal canvas{width:900px} }

.uas-pop-h{display:flex; justify-content:space-between; align-items:center; gap:10px}

/* kaamera lightbox */
.cam-lb{position:fixed; inset:0; z-index:5000; background:rgba(2,6,12,.82); backdrop-filter:blur(6px); display:none; align-items:center; justify-content:center; padding:20px}
.cam-lb.open{display:flex; animation:lbIn .18s ease-out}
@keyframes lbIn{from{opacity:0}to{opacity:1}}
body.lb-open{overflow:hidden}
.lb-box{width:min(1100px,100%); max-height:100%; overflow:auto; background:var(--glass,#0e1a26); border:1px solid var(--line); border-radius:16px; padding:14px 16px; box-shadow:0 20px 60px rgba(0,0,0,.6)}
.lb-h{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:10px}
.lb-h b{font-size:17px}
.lb-live{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; color:#ff8a8a; margin-left:8px; text-transform:uppercase; letter-spacing:.04em}
.lb-live i{width:7px; height:7px; border-radius:50%; background:#ff5a5a; animation:lbPulse 1.6s infinite}
@keyframes lbPulse{50%{opacity:.25}}
.lb-x{font-size:16px; padding:4px 10px}
.lb-stage{position:relative; border-radius:10px; overflow:hidden; background:#000; min-height:min(50vh,420px); display:grid; place-items:center}
.lb-img{display:block; width:100%; max-height:68vh; object-fit:contain}
.lb-prev,.lb-next{position:absolute; top:50%; transform:translateY(-50%); width:44px; height:64px; border:0; border-radius:10px; background:rgba(0,0,0,.45); color:#fff; font-size:34px; cursor:pointer}
.lb-prev{left:8px}.lb-next{right:8px}
.lb-prev:hover,.lb-next:hover{background:rgba(0,0,0,.7)}
.lb-info .cam-st-g{grid-template-columns:repeat(4,minmax(0,1fr))}
.lb-near{display:flex; gap:8px; align-items:center; overflow-x:auto; margin:10px 0 6px; padding-bottom:4px}
.lb-th{flex:none; width:120px; background:none; border:1px solid var(--line); border-radius:8px; padding:0; overflow:hidden; cursor:pointer; color:var(--muted); text-align:left}
.lb-th img{display:block; width:100%; height:68px; object-fit:cover}
.lb-th small{display:block; padding:2px 5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:10.5px}
.lb-th:hover{border-color:var(--ice)}
@media (max-width:700px){ .lb-info .cam-st-g{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ---------- kontod ---------- */
.acc-btn{padding:3px; border-radius:50%; margin-right:4px}
.acc-av{display:inline-grid; place-items:center; width:26px; height:26px; border-radius:50%; font-style:normal; font-size:11px; font-weight:700; color:#06101a;
  background:linear-gradient(135deg,#7cc0ff,#4f9fd6); flex:none}
.acc-av.big{width:42px; height:42px; font-size:15px}
.acc-av.r-admin{background:linear-gradient(135deg,#ffd27a,#f2933f)} .acc-av.r-superview{background:linear-gradient(135deg,#d6a8ff,#9b6bff)}
.acc-av.r-viewer{background:linear-gradient(135deg,#b8c4cc,#7d8a94)}
.acc-menu{position:fixed; z-index:4000; width:290px; background:var(--glass,#0e1a26); border:1px solid var(--line); border-radius:14px; padding:12px; box-shadow:0 18px 50px rgba(0,0,0,.55); display:grid; gap:4px}
.acc-menu[hidden]{display:none}
.acc-who{display:flex; gap:10px; align-items:center; padding-bottom:10px; border-bottom:1px solid var(--line-soft)}
.acc-who small{display:block; color:var(--muted); font-size:12px}
.acc-role{display:inline-block; margin-top:3px; font-size:11px; font-weight:650; padding:1px 7px; border-radius:6px; background:rgba(124,192,255,.15); color:#9fd0ff}
.acc-role.r-admin{background:rgba(242,147,63,.16); color:#ffc07a} .acc-role.r-superview{background:rgba(155,107,255,.18); color:#d6a8ff} .acc-role.r-viewer{background:rgba(184,196,204,.14); color:#c8d2d9}
.acc-packs{padding:6px 0 8px; border-bottom:1px solid var(--line-soft); margin-bottom:4px}
.acc-packs div{display:flex; flex-wrap:wrap; gap:4px; margin-top:4px}
.acc-pack{font-size:11.5px; padding:2px 8px; border-radius:999px; border:1px solid var(--line); color:var(--ink)}
.acc-menu button{background:none; border:0; text-align:left; padding:8px 8px; border-radius:8px; color:var(--ink); cursor:pointer; font-size:13.5px}
.acc-menu button:hover{background:rgba(159,208,228,.08)} .acc-menu .danger{color:#ff8a96}
.acc-setup{position:fixed; inset:0; z-index:6000; background:radial-gradient(circle at 50% 30%, #0d1828, #02050a 70%); display:grid; place-items:center; padding:20px}
.acc-card{display:grid; gap:10px; width:min(420px,100%); padding:26px; background:linear-gradient(160deg,#0f1c2a,#0a131d); border:1px solid #1f3346; border-radius:16px; box-shadow:0 30px 80px rgba(0,0,0,.5); color:var(--ink)}
.acc-card h2{margin:0; font-size:19px} .acc-logo{font-size:22px} .acc-logo i{font-style:normal; color:#7cc0ff}
.acc-card label{display:grid; gap:4px} .acc-card label span{font-size:12.5px; color:var(--muted)}
.acc-card input,.adm-new input,.adm-new select,.adm-users select{padding:9px 10px; border-radius:8px; border:1px solid var(--line); background:#08121b; color:var(--ink); font-size:14px}
.acc-primary{padding:10px 16px; border-radius:9px; border:0; background:linear-gradient(90deg,#3d8fe0,#4fb3ff); color:#fff; font-weight:650; cursor:pointer}
.acc-err{color:#ff8a96; margin:0; font-size:13px}
.acc-row{display:flex; justify-content:flex-end; gap:8px; align-items:center}
.acc-dlg{border:0; padding:0; background:none} .acc-dlg::backdrop{background:rgba(2,6,12,.7)}
.acc-toast{position:fixed; bottom:24px; left:50%; transform:translateX(-50%); z-index:7000; background:#14263a; border:1px solid var(--line); padding:9px 16px; border-radius:10px; box-shadow:0 10px 30px rgba(0,0,0,.5); animation:lbIn .2s}
/* lukus paketid */
.subtabs button.locked{opacity:.55} .subtabs button.locked::after{content:" 🔒"; font-size:10px}
.tab.locked > :not(#subTabs):not(.lock-ov){display:none !important}
.lock-ov{text-align:center; padding:40px 20px; max-width:560px; margin:30px auto}
.lock-ov .lock-ic{font-size:40px; margin-bottom:6px} .lock-ov h2{margin:4px 0 8px}
/* juhtpaneel */
.adm-head{display:flex; justify-content:space-between; align-items:baseline; margin:4px 0 12px} .adm-head h2{margin:0}
.adm-kpis{display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin-bottom:14px}
.adm-kpis div{padding:14px; border-radius:12px; background:var(--glass); border:1px solid var(--line)}
.adm-kpis b{display:block; font-size:26px; font-stretch:80%} .adm-kpis span{color:var(--muted); font-size:12px}
.adm-kpis .ok b{color:#7fe0a0} .adm-kpis .bad{border-color:rgba(227,54,76,.5)} .adm-kpis .bad b{color:#ff8a96}
.adm-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(270px,100%),1fr)); gap:12px; margin-bottom:12px}
.adm-card{padding:14px 16px; border-radius:12px; background:var(--glass); border:1px solid var(--line); min-width:0}
.adm-card.wide{margin-bottom:12px} .adm-card h3{margin:0 0 8px; font-size:14px} .adm-card h4{margin:12px 0 4px; font-size:12.5px; color:var(--muted)}
.adm-kv{display:grid; gap:3px} .adm-kv div{display:flex; justify-content:space-between; gap:10px; font-size:12.5px; border-top:1px solid var(--line-soft); padding-top:3px}
.adm-kv span{color:var(--muted)} .adm-kv b{font-weight:600; text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.adm-list{list-style:none; margin:8px 0; padding:0; display:grid; gap:5px}
.adm-list li{display:flex; align-items:center; gap:8px; font-size:12.5px} .adm-list li small{margin-left:auto; color:var(--muted); text-align:right}
.adm-list .acc-av{width:22px; height:22px; font-size:9.5px}
.adm-bad{color:#ff8a96; font-size:12.5px}
.adm-tbl{width:100%; border-collapse:collapse; font-size:12.5px}
.adm-tbl th{text-align:left; color:var(--muted); font-weight:500; padding:4px 8px; border-bottom:1px solid var(--line)}
.adm-tbl td{padding:5px 8px; border-bottom:1px solid var(--line-soft); vertical-align:middle}
.adm-tbl tr.bad td{color:#ff8a96}
.adm-log{max-height:280px; overflow:auto; font-size:11.5px; line-height:1.45; margin:0; white-space:pre-wrap; color:var(--muted)}
.adm-roles{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px}
.adm-roles div{display:grid; gap:4px} .adm-roles small{color:var(--muted); font-size:12px}
.adm-new{margin-bottom:12px} .adm-new h3{margin:0 0 10px; font-size:14px}
.adm-new-g{display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px}
.adm-new-g label{display:grid; gap:4px} .adm-new-g span{font-size:12px; color:var(--muted)}
.adm-new-p{display:flex; flex-wrap:wrap; gap:6px 14px; align-items:center; margin:10px 0; font-size:13px}
.adm-new-p span{color:var(--muted)}
.adm-link{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:10px; padding:10px; border-radius:10px; background:rgba(80,200,120,.08); border:1px solid rgba(80,200,120,.3); font-size:13px}
.adm-link input{flex:1; min-width:260px}
.adm-users td:first-child{display:flex; gap:10px; align-items:center} .adm-users small{display:block; color:var(--muted)}
.adm-users tr.off{opacity:.5}
.adm-pks{display:flex; flex-wrap:wrap; gap:4px 10px} .adm-pk{font-size:12.5px; white-space:nowrap} .adm-pk.all{opacity:.6}
.adm-act{white-space:nowrap; text-align:right} .adm-act .danger{color:#ff8a96}
@media (max-width:1100px){ .adm-kpis{grid-template-columns:repeat(3,minmax(0,1fr))} .adm-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .adm-new-g,.adm-roles{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){ .adm-kpis,.adm-grid,.adm-new-g,.adm-roles{grid-template-columns:1fr} .adm-users{display:block; overflow-x:auto} }

.acc-logo{width:120px; height:120px; margin:-14px auto -10px; display:block}
.brand img{border-radius:0; filter:drop-shadow(0 0 6px rgba(79,163,255,.45))}

.inv-url{width:100%; font-size:13px}
.acc-btnlink{display:inline-flex; align-items:center; padding:9px 14px; border-radius:9px; border:1px solid var(--line); color:var(--ink); text-decoration:none}
.adm-link[hidden]{display:none}

.adm-ntm{margin-top:8px} .adm-ntm summary{cursor:pointer; color:#ffb070} .adm-ntm form{display:grid; gap:6px; margin-top:6px}
.adm-ntm input{padding:8px; border-radius:8px; border:1px solid var(--line); background:#08121b; color:var(--ink)}
.adm-lbl{display:grid; gap:2px; margin-top:6px; font-size:13px; color:var(--ink)} .adm-lbl small{font-weight:400}
.adm-chk{display:flex; gap:8px; align-items:flex-start; font-size:13px; margin-top:6px} .adm-chk input{margin-top:3px; flex:none} .adm-chk small{display:block; margin-top:2px}

/* admin eelvaade */
.view-banner{position:sticky; top:0; z-index:3000; display:flex; gap:10px; align-items:center; justify-content:center; flex-wrap:wrap; padding:7px 14px;
  background:linear-gradient(90deg,#4a2d7a,#2d4a7a); color:#fff; font-size:13px}
.view-banner select{padding:4px 8px; border-radius:7px; border:1px solid rgba(255,255,255,.3); background:rgba(0,0,0,.25); color:#fff}
.view-banner button{color:#fff; border-color:rgba(255,255,255,.4)}
.acc-view{padding:8px 0 4px; border-top:1px solid var(--line-soft); margin-top:4px}
.acc-view div{display:flex; flex-wrap:wrap; gap:4px; margin-top:4px}
.acc-view button{padding:4px 9px !important; border:1px solid var(--line) !important; border-radius:999px !important; font-size:12px !important}
.acc-view button.on{background:rgba(155,107,255,.25) !important; border-color:#9b6bff !important}

.lock-tile{display:grid; place-items:center; gap:2px; text-align:center; border:1px dashed rgba(155,107,255,.55); border-radius:12px; background:rgba(155,107,255,.08);
  color:#d6a8ff; font-size:12.5px; cursor:pointer; padding:10px; min-width:110px}
.lock-tile small{color:var(--muted); font-size:11px}
.lock-tile:hover{background:rgba(155,107,255,.16)}
.rt-lock{background:none; border:1px dashed rgba(155,107,255,.55); color:#d6a8ff; border-radius:999px; padding:3px 10px; font-size:11.5px; cursor:pointer; flex:none}

/* paketid */
.pl-hero{display:flex; gap:16px; align-items:center; margin:6px 0 18px}
.pl-hero h1{margin:0; font-size:26px} .pl-hero p{margin:4px 0 0; color:var(--muted); max-width:720px}
.pl-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px}
.pl-card{position:relative; display:flex; flex-direction:column; gap:8px; padding:20px; border-radius:16px; background:var(--glass); border:1px solid var(--line)}
.pl-card.pop{border-color:#4fb3ff; box-shadow:0 0 0 1px #4fb3ff55, 0 20px 50px rgba(79,179,255,.12)}
.pl-card.mine{border-color:#7fe0a0}
.pl-tag{position:absolute; top:-11px; left:20px; background:linear-gradient(90deg,#3d8fe0,#4fb3ff); color:#fff; font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px}
.pl-card h2{margin:0; font-size:18px}
.pl-price b{font-size:32px; font-stretch:80%} .pl-price span{color:var(--muted); margin-left:4px}
.pl-tl{margin:0; color:var(--muted); font-size:13px; min-height:36px}
.pl-card ul{list-style:none; padding:0; margin:4px 0 8px; display:grid; gap:6px; font-size:13px; flex:1}
.pl-card li::before{content:"✓ "; color:#7fe0a0; font-weight:700}
.pl-btn{padding:11px; border-radius:10px; border:1px solid var(--line); background:none; color:var(--ink); font-weight:650; cursor:pointer}
.pl-btn.go{border:0; background:linear-gradient(90deg,#3d8fe0,#4fb3ff); color:#fff}
.pl-btn.cur{border-color:#7fe0a0; color:#7fe0a0} .pl-btn:disabled{cursor:default; opacity:.75}
.pl-btn.sm{padding:7px 10px; font-size:12.5px}
.pl-h2{margin:26px 0 10px; font-size:17px} .pl-h2 small{color:var(--muted); font-weight:400; font-size:12.5px; margin-left:6px}
.pl-addons{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px}
.pl-addon{padding:14px; border-radius:12px; background:var(--glass); border:1px solid var(--line); display:flex; flex-direction:column; gap:6px}
.pl-addon p{margin:0; color:var(--muted); font-size:12.5px; flex:1} .pl-addon.mine{border-color:#7fe0a0} .pl-ok{color:#7fe0a0; font-size:13px}
.pl-msg{padding:12px 16px; border-radius:12px; margin-bottom:14px; background:rgba(242,147,63,.12); border:1px solid rgba(242,147,63,.4)}
.pl-msg.ok{background:rgba(80,200,120,.12); border-color:rgba(80,200,120,.45)}
.pl-manage{margin-top:16px} .pl-legal{margin-top:18px}
.adm-steps{padding-left:18px; margin:6px 0} .adm-steps code{font-size:11px; word-break:break-all}
@media (max-width:1000px){ .pl-grid,.pl-addons{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:600px){ .pl-grid,.pl-addons{grid-template-columns:1fr} }

.hdr-clock{display:grid; justify-items:end; line-height:1.05; margin-left:auto; margin-right:14px; font-variant-numeric:tabular-nums; cursor:default; white-space:nowrap}
.hdr-clock b{font-size:17px; font-weight:650; letter-spacing:.02em}
.hdr-clock small{font-size:10.5px; color:var(--muted)}
@media (max-width:1100px){ .hdr-clock small{display:none} }
@media (max-width:760px){ .hdr-clock{display:none} }
.hdr-clock + .tabs{margin-left:0}

/* paadiilm */
.bt-ctl{display:flex; flex-wrap:wrap; gap:10px 16px; align-items:end}
.bt-ctl label,.bt-route-ctl label{display:grid; gap:3px; font-size:12px; color:var(--muted)}
.bt-ctl select,.bt-route-ctl select,.bt-route-ctl input{padding:8px 10px; border-radius:8px; border:1px solid var(--line); background:#08121b; color:var(--ink); font-size:14px}
.bt-ctl #btSrc{flex-basis:100%; font-size:11.5px}
.bt-verdict{margin:12px 0 10px; padding:12px 16px; border-radius:12px; font-size:16px; font-weight:600; background:rgba(80,200,120,.1); border-left:4px solid #50c878}
.bt-verdict.l1{background:rgba(241,203,74,.1); border-color:#f1cb4a} .bt-verdict.l2{background:rgba(227,54,76,.12); border-color:#e3364c}
.bt-now{display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:8px}
.bt-now > div{padding:10px 12px; border-radius:10px; background:rgba(159,208,228,.05); border:1px solid var(--line-soft); display:grid; gap:2px}
.bt-now span{font-size:11.5px; color:var(--muted)} .bt-now b{font-size:20px; font-stretch:85%; display:flex; align-items:center; gap:4px} .bt-now small{font-size:11.5px; color:var(--muted)}
.bt-now .warn{border-color:#f2933f}
.bt-arr{vertical-align:-2px; flex:none}
.bt-hours{overflow-x:auto}
.bt-tbl{border-collapse:collapse; font-size:12.5px; font-variant-numeric:tabular-nums}
.bt-tbl th,.bt-tbl td{padding:3px 5px; text-align:center; white-space:nowrap; border-bottom:1px solid var(--line-soft)}
.bt-tbl tbody th{text-align:left; color:var(--muted); font-weight:500; position:sticky; left:0; background:var(--panel-bg,#0b1520); z-index:1}
.bt-tbl thead th{color:var(--muted); font-weight:500} .bt-tbl thead th.nd{border-left:1px solid var(--line); color:var(--ink)}
.bt-tbl tr.sub td{color:var(--muted); font-size:11.5px}
.bt-lvl td i{display:block; height:10px; border-radius:3px; min-width:16px}
.bt-route-ctl{display:flex; flex-wrap:wrap; gap:10px; align-items:end; margin-bottom:10px}
.bt-rt{width:100%; border-collapse:collapse; font-size:12.5px; margin-top:8px} .bt-rt td,.bt-rt th{padding:4px 6px; border-bottom:1px solid var(--line-soft); text-align:left}
.bt-dot{display:inline-block; width:10px; height:10px; border-radius:50%; vertical-align:-1px}
.bt-map-wrap{height:min(60vh,520px); border-radius:10px; overflow:hidden} #btMap{height:100%; background:#0b1118}
.bt-moored{display:block; width:7px; height:7px; border-radius:50%; border:1px solid #000; margin:4px}
.bt-buoy{display:inline-block; transform:translate(-50%,-50%); font-size:10.5px; font-weight:650; padding:1px 5px; border-radius:6px; background:rgba(8,14,22,.85); border:1.5px solid #7cc0f0; color:#bfe3ff; white-space:nowrap}

/* ---------- külaline (ilma kontota) ---------- */
.acc-guest{display:flex; gap:8px; align-items:center}
.acc-guest .acc-btnlink{padding:6px 12px; font-size:13px; white-space:nowrap}
.acc-guest .acc-primary.acc-btnlink{border:0}
.acc-hero{grid-row:1; grid-column:1/-1; position:relative; display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:18px; align-items:center;
  padding:10px 44px 10px 20px; border-bottom:1px solid var(--line);
  background:radial-gradient(80% 160% at 0% 0%, rgba(79,179,255,.18), transparent 60%), var(--bg-2)}
body.has-hero .ov{grid-template-rows:auto 1fr auto}
body.has-hero .ov-now, body.has-hero .ov-map{grid-row:2}
body.has-hero .ov-bottom{grid-row:3}
.acc-hero h1{font-size:17px; margin:0 0 2px; font-weight:750; letter-spacing:-.01em}
.acc-hero p{margin:0; color:var(--muted); font-size:13px; max-width:78ch; line-height:1.4}
.acc-hero p b{color:var(--ink)}
.acc-hero-btns{display:flex; flex-wrap:wrap; gap:8px}
.acc-hero-btns .ghost{padding:8px 14px; font-size:13.5px; border-radius:9px}
.acc-hero-btns .acc-primary.acc-btnlink{border:0; padding:8px 14px; font-size:13.5px}
.acc-hero-steps{list-style:none; margin:0; padding:0; display:flex; gap:6px}
.acc-hero-steps li{display:grid; gap:1px; padding:5px 10px; border:1px solid var(--line); border-radius:9px; font-size:12.5px; white-space:nowrap}
.acc-hero-steps li span{color:var(--muted); font-size:11.5px}
.acc-hero-steps li.hl{border-color:#3d8fe0; background:rgba(61,143,224,.12)}
.acc-hero-x{position:absolute; top:50%; right:10px; transform:translateY(-50%); background:none; border:1px solid var(--line); border-radius:6px; color:var(--muted); font-size:14px; line-height:1; padding:4px 8px; cursor:pointer}
.acc-hero-mini{display:none}
.acc-hero.mini{display:block; padding:6px 44px 6px 20px}
.acc-hero.mini > :not(.acc-hero-mini):not(.acc-hero-x){display:none}
.acc-hero.mini .acc-hero-mini{display:block; font-size:12.5px; max-width:none}
@media (max-width:1100px){
  .acc-hero-steps{display:none}
  body.has-hero .ov{grid-template-rows:auto auto 60vh auto}
  body.has-hero .ov-now{grid-row:2} body.has-hero .ov-map{grid-row:3} body.has-hero .ov-bottom{grid-row:4} }
@media (max-width:760px){
  .acc-hero{grid-template-columns:1fr; gap:8px; padding:10px 40px 10px 14px}
  .acc-hero-x{top:10px; transform:none}
  .acc-guest .ghost{display:none} }
.acc-teaser{grid-column:1/-1}
.acc-teaser-h{display:flex; align-items:center; gap:10px; margin-bottom:6px}
.acc-teaser-h h2{margin:0; font-size:15px; color:var(--ink)}
.acc-teaser-h .pl-tag{position:static}
.acc-teaser .blur{font-style:normal; color:var(--faint); letter-spacing:-1px; filter:blur(2px)}
.acc-teaser .acc-row{margin-top:10px}
.pl-guest{padding:12px 16px; border:1px solid #3d8fe0; background:rgba(61,143,224,.1); border-radius:10px; margin-bottom:14px; font-size:14px}
a.pl-btn{display:block; text-align:center; text-decoration:none}
a.lock-tile, a.rt-lock{text-decoration:none}
a.lock-tile{color:inherit}
.adm-tg{display:flex; gap:8px; align-items:center; font-size:13px; margin:6px 0}
.fe-ais{margin:6px 0 8px; font-size:13px; color:var(--muted)}
.fe-ais b{color:var(--ink); font-weight:600}
.fe-go{color:#7fe0a0}
.diary .dy-d{font-weight:600}
.diary .dy-v{font-weight:600; color:var(--ink)}
.diary tr.partial{opacity:1} .diary tr.partial .dy-d{color:var(--muted)}
.lock-ov .ghost.acc-btnlink{padding:9px 14px; font-size:14px; border-radius:9px}
@media (max-width:760px){ .acc-guest .acc-primary.acc-btnlink{padding:6px 10px; font-size:12px} }
.acc-lock{opacity:.62; cursor:pointer}
.acc-lock:hover{opacity:.9}
.acc-nc-lock{display:grid; gap:6px; justify-items:start; font-size:13px}
.acc-nc-lock span{color:var(--muted)}
.acc-nc-lock .acc-btnlink{padding:7px 12px; font-size:13px; border:0}
.acc-rank-up{margin-top:12px; padding:10px 12px; border:1px dashed rgba(155,107,255,.55); background:rgba(155,107,255,.08); border-radius:10px; font-size:13px; color:var(--muted)}
.acc-rank-up b{color:var(--ink)} .acc-rank-up .acc-primary{margin-left:8px; padding:6px 12px; font-size:13px}
.beach-links{margin:4px 0 10px; font-size:13px; color:var(--muted)}
.mo-weeks{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; margin:10px 0 16px}
.mo-wk{border:1px solid var(--line); border-radius:10px; padding:10px 12px; display:grid; gap:2px; background:var(--bg-2)}
.mo-wk small{color:var(--faint); font-size:11.5px}
.mo-wk .mo-an{font-size:24px; font-weight:700; line-height:1.1}
.mo-wk.warm{border-color:rgba(242,147,63,.6)} .mo-wk.warm .mo-an{color:#f2933f}
.mo-wk.cold{border-color:rgba(124,192,240,.6)} .mo-wk.cold .mo-an{color:#7cc0f0}
.mo-wk > span{color:var(--muted); font-size:12px; margin-top:-2px}
.mo-row{display:flex; justify-content:space-between; font-size:13px; margin-top:4px} .mo-row i{color:var(--faint); font-style:normal}
.mo-prob{height:5px; background:rgba(124,192,240,.25); border-radius:3px; overflow:hidden; margin-top:6px} .mo-prob i{display:block; height:100%; background:#f2933f}
.mo-wk p{margin:4px 0 0; font-size:12.5px; color:var(--muted)}
.pl-mk{background:none; border:0}
.pl-ic{width:20px; height:20px; filter:drop-shadow(0 0 2px rgba(0,0,0,.8)); transition:transform .4s}
.pl-over{border:1px solid var(--line); border-radius:10px; padding:10px 12px; margin:6px 0 14px; display:grid; gap:8px}
.pl-over.on{border-color:#f1cb4a; background:rgba(241,203,74,.07)}
.pl-ov{display:flex; gap:14px; align-items:center; font-size:14px}
.pl-ov .pl-cd{font-size:22px; min-width:110px; color:#f1cb4a; font-variant-numeric:tabular-nums}
.pl-tbl td{font-size:13px} .pl-tbl small{color:var(--faint)}
#plPanel h3{font-size:13px; color:var(--muted); margin:6px 0}
#plAp{margin-left:auto}
.acc-push-kinds{display:grid; gap:8px; margin:10px 0}
.acc-push-kinds label{display:flex; gap:8px; align-items:center; font-size:14px}
.acc-push-kinds small{color:var(--faint)}
.alert-chip.storm.warn{border-color:#f2933f; background:rgba(242,147,63,.14)}
.alert-chip.storm.danger{border-color:#e3364c; background:rgba(227,54,76,.18); animation:ltnPulse 2s ease-in-out infinite}
.alert-chip.storm.danger b{color:#ff8a96}
@keyframes ltnPulse{0%,100%{box-shadow:0 0 0 0 rgba(227,54,76,.0)}50%{box-shadow:0 0 0 4px rgba(227,54,76,.25)}}
@media (prefers-reduced-motion:reduce){.alert-chip.storm.danger{animation:none}}
.ltn-push{margin-top:6px; font-size:12px}
.acc-dlg:focus-visible{outline:none}
.adm-scroll{overflow-x:auto; max-width:100%}
.adm-card > .adm-tbl, .adm-scroll > .adm-tbl{width:100%}
.adm-shadow td, .adm-shadow th{white-space:nowrap; vertical-align:middle}
.adm-shadow td:last-child{white-space:normal}
.adm-shadow small{color:var(--faint)}
.adm-card.wide{overflow-x:auto}
.adm-api td{white-space:nowrap} .adm-api td:last-child{white-space:normal; min-width:240px}
/* riietus ülevaates */
.ov-clothes{display:flex; gap:10px; align-items:flex-start; font-size:13.5px; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:rgba(159,208,228,.05)}
.ov-clothes .oc-ic{font-size:20px; line-height:1}
.ov-clothes small{display:block; color:var(--muted); font-size:12px; margin-top:2px}
/* tervis, kodu */
.hx-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr)); gap:10px; margin:6px 0 10px}
.hx{display:flex; gap:10px; padding:12px; border:1px solid var(--line); border-radius:10px; background:var(--bg-2)}
.hx .hx-ic{font-size:24px; line-height:1}
.hx small{display:block; color:var(--muted); font-size:12px} .hx b{display:block; font-size:17px; margin:2px 0}
.hx p{margin:0; font-size:13px; color:var(--muted)}
.hx.warn{border-color:#f2933f} .hx.warn b{color:#f2933f} .hx.bad{border-color:#e6534f} .hx.bad b{color:#ff8a96}
.kd-bars{display:flex; gap:4px; align-items:flex-end; height:40px; margin-top:8px} .kd-bars i{flex:1; background:#f2933f; opacity:.7; border-radius:2px 2px 0 0}
.kd-set form{display:grid; gap:6px; margin-top:8px; font-size:13px} .kd-set input{width:80px; margin:0 4px}
/* tuleoht */
.fire-now{display:flex; gap:16px; align-items:center; padding:14px; border:1px solid var(--c); border-radius:12px; background:color-mix(in srgb, var(--c) 10%, transparent)}
.fire-big{font-size:28px; font-weight:750; color:var(--c); text-transform:capitalize; min-width:150px}
.fire-now p{margin:4px 0}
.fire-days{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:6px; margin:12px 0}
.fd{border-top:3px solid var(--c); padding:6px 4px; text-align:center; font-size:12px; background:var(--bg-2); border-radius:0 0 8px 8px}
.fd small{display:block; color:var(--muted)} .fd b{display:block; font-size:12.5px} .fd span{color:var(--faint)}
.fire-h{font-size:13px; color:var(--muted); margin:10px 0 4px}
.fire-bars{display:flex; gap:3px; align-items:flex-end; height:60px} .fire-bars i{flex:1; border-radius:2px 2px 0 0}
@media (max-width:760px){ .fire-days{grid-template-columns:repeat(4,minmax(0,1fr))} .fire-now{flex-direction:column; align-items:flex-start} }
/* olude rühmad */
.st-sec{font-size:10.5px; text-transform:uppercase; letter-spacing:.06em; color:var(--faint); padding:0 4px 0 10px; align-self:center; white-space:nowrap}
.st-sec:first-child{padding-left:4px}

/* kasutajate ilmateated */
.ov-report{margin:8px 0 0;border:1px solid var(--line);border-radius:12px;background:var(--card,rgba(255,255,255,.03))}
.ov-report summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;gap:6px 12px;align-items:baseline;padding:9px 12px}
.ov-report summary::-webkit-details-marker{display:none}
.ov-report .rp-q{font-weight:600}
.ov-report .rp-sum{color:var(--muted);font-size:.88em}
.ov-report .rp-ok{color:#7fe0a0;font-size:.88em}
.rp-chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px}
.rp-chips button{border:1px solid var(--line);background:transparent;color:inherit;border-radius:999px;padding:6px 11px;font:inherit;font-size:.92em;cursor:pointer}
.rp-chips button:hover{border-color:var(--accent,#5fb3ff)}
.rp-chips button:disabled{opacity:.5}
.ov-report .hint{padding:0 12px 10px;margin:8px 0 0}
.rp-mark{background:none;border:0;font-size:20px;line-height:26px;text-align:center;filter:drop-shadow(0 1px 2px rgba(0,0,0,.7))}

/* kaardi ajamasin */
.tm-bar{bottom:12px;left:14px;right:14px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;border-radius:12px;
  background:rgba(12,20,30,.82);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.08);max-width:760px}
.tm-bar[hidden]{display:none}
.tm-bar input[type=range]{flex:1 1 180px;min-width:140px}
.tm-info{display:flex;flex-direction:column;line-height:1.2;min-width:150px}
.tm-info b{font-weight:600;text-transform:capitalize}
.tm-info small{color:var(--muted)}
.tm-legend{display:flex;gap:8px;font-size:.78em;color:var(--muted);flex-wrap:wrap}
.tm-legend span{display:inline-flex;align-items:center;gap:3px}
.tm-legend i{width:12px;height:10px;border-radius:2px;display:inline-block}
.tm-x{background:none;border:0;color:var(--muted);font-size:16px;cursor:pointer;margin-left:auto}
.tm-img{image-rendering:auto;pointer-events:none}
.tm-arrow{background:none;border:0;color:#fff;text-align:center;font-size:11px;line-height:1;text-shadow:0 0 3px #000,0 0 2px #000}
.tm-arrow span{display:block;font-size:15px;font-weight:700}
.tm-arrow b{font-weight:600;font-size:10px}
body.tm-on .map-bottom{display:none}
@media (max-width:640px){.tm-bar{left:8px;right:8px}.tm-legend{display:none}}

/* Minu Veder */
.ov-mine{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 0}
.ov-mine .om-h{font-size:.78em;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-right:4px}
.ov-mine button{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:inherit;
  border-radius:999px;padding:5px 11px;font:inherit;font-size:.9em;cursor:pointer;transition:border-color .15s,background .15s}
.ov-mine button:hover{border-color:var(--accent,#5fb3ff);background:rgba(95,179,255,.08)}
.ov-mine button i{font-style:normal}
.ov-mine button.lk{opacity:.7}
.ov-mine .om-edit{padding:5px 9px;color:var(--muted)}
.ov-mine .om-first{display:block;border-style:dashed;border-radius:12px;padding:8px 12px;text-align:left;width:100%}
.mine-dlg{border:1px solid var(--line);border-radius:18px;background:var(--bg-2);color:var(--ink);width:min(560px,94vw);padding:18px 20px}
.mine-dlg::backdrop{background:rgba(3,8,14,.62);backdrop-filter:blur(3px)}
.mine-dlg h2{margin:0 0 4px}
.mine-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;margin:12px 0}
.mine-grid label{display:flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:10px;padding:8px 10px;cursor:pointer;transition:border-color .15s,background .15s}
.mine-grid label.on{border-color:var(--accent,#5fb3ff);background:rgba(95,179,255,.1)}
.mine-grid input{position:absolute;opacity:0;pointer-events:none}
.mine-grid i{font-style:normal;font-size:1.15em}
.mine-grid small{margin-left:auto}
.mine-act{display:flex;justify-content:flex-end;gap:8px}

/* ---------- disainipass: laadimise skeletid ---------- */
@keyframes skel{0%{background-position:100% 0}100%{background-position:-100% 0}}
.skel{display:grid; gap:9px; padding:8px 0}
.skel i,.skel-line,.hour-strip:empty,.days5:empty,.smart-summary:empty{
  background:linear-gradient(90deg,var(--line-soft) 0%,rgba(159,208,228,.13) 45%,var(--line-soft) 90%); background-size:200% 100%;
  animation:skel 1.4s ease-in-out infinite; border-radius:7px}
.skel i{display:block; height:12px}
.skel i:first-child{height:16px; width:42%}
.skel i:nth-child(2){width:88%}
.skel i:nth-child(3){width:64%}
.skel-line{display:inline-block; width:min(60%,320px); height:12px; vertical-align:middle}
.hour-strip:empty{min-height:92px}
.days5:empty{min-height:120px}
.smart-summary:empty{min-height:18px; max-width:520px}

/* ---------- disainipass: ühtne tüpograafia ---------- */
h2,h3,.fire-big,.tm-info b{text-wrap:balance}
p,.hint,.note{text-wrap:pretty}
.panel h3:not([class]){font-size:13px; font-weight:600; color:var(--muted); margin:14px 0 6px; font-stretch:90%}
.panel p{max-width:75ch}
.panel b,.panel strong{font-weight:600}
.ov-report summary,.ov-mine button,.rp-chips button,.tm-bar{font-size:13px}
.ov-report .rp-sum,.ov-report .rp-ok,.tm-info small,.tm-legend{font-size:12px}
.ov-mine .om-h{font-size:11px}
.ov-report .hint{font-size:12px}

/* ---------- disainipass: elavad ilmaikoonid (suur ikoon, punktiprognoos) ---------- */
@keyframes wiSpin{to{transform:rotate(360deg)}}
@keyframes wiPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
@keyframes wiDrift{0%,100%{transform:translateX(0)}50%{transform:translateX(2.2px)}}
@keyframes wiDrop{0%{transform:translateY(-3px);opacity:0}25%{opacity:1}100%{transform:translateY(5px);opacity:0}}
@keyframes wiFlake{0%{transform:translate(0,-3px);opacity:0}30%{opacity:1}100%{transform:translate(1.5px,5px);opacity:0}}
@keyframes wiBolt{0%,86%,100%{opacity:1}88%{opacity:.25}90%{opacity:1}92%{opacity:.4}}
@keyframes wiFog{0%,100%{transform:translateX(-1.5px)}50%{transform:translateX(1.5px)}}
@keyframes wiMoon{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
:is(.now-icon,.pt-now,.hsh-head) svg *{transform-box:fill-box; transform-origin:center}
:is(.now-icon,.pt-now,.hsh-head) .wi-rays{transform-box:view-box; transform-origin:22px 20px; animation:wiSpin 40s linear infinite}
:is(.now-icon,.pt-now,.hsh-head) .wi-sun{animation:wiPulse 4s ease-in-out infinite}
:is(.now-icon,.pt-now,.hsh-head) .wi-moon{animation:wiMoon 8s ease-in-out infinite}
:is(.now-icon,.pt-now,.hsh-head) .wi-cloud{animation:wiDrift 7s ease-in-out infinite}
:is(.now-icon,.pt-now,.hsh-head) g + g > .wi-cloud{animation-duration:9s; animation-direction:reverse}
:is(.now-icon,.pt-now,.hsh-head) .wi-drop{animation:wiDrop 1.1s linear infinite}
:is(.now-icon,.pt-now,.hsh-head) .wi-flake{animation:wiFlake 2.4s ease-in infinite}
:is(.now-icon,.pt-now,.hsh-head) .wi-bolt{animation:wiBolt 3.2s linear infinite}
:is(.now-icon,.pt-now,.hsh-head) .wi-fog{animation:wiFog 6s ease-in-out infinite}
/* sisu ilmumine: paneelid hajuvad sisse, mitte ei hüppa */
@keyframes fadeUp{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.ov-clothes,.ov-report,.ov-mine,.fire-now,.hx-grid,.tm-bar{animation:fadeUp .28s ease-out}
@media (prefers-reduced-motion: reduce){
  .skel i,.skel-line,.hour-strip:empty,.days5:empty,.smart-summary:empty{animation:none}
  :is(.now-icon,.pt-now,.hsh-head) svg *{animation:none!important}
  .ov-clothes,.ov-report,.ov-mine,.fire-now,.hx-grid,.tm-bar{animation:none}
}

.pl-err{color:#ffbd7a; font-size:12px; max-width:320px}
.tk-road{margin:6px 0 10px}
.tk-roadbar{display:flex; height:12px; border-radius:6px; overflow:hidden; gap:1px; background:var(--line-soft)}
.tk-roadbar i{display:block; min-width:2px}
.tk-roadlbl{display:flex; justify-content:space-between; font-size:11px; color:var(--faint); margin-top:3px}
.tk-why em small{color:var(--faint); font-style:normal}

/* ===== Põld ja aed ===== */
.gd .gd-top{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:12px} .gd .gd-top h2{margin:0}
.gd-sec{margin-top:18px; padding-top:14px; border-top:1px solid var(--line-soft)}
.gd-sech{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; margin-bottom:8px}
.gd-sech h3, .gd-col h3{font-size:14px; margin:0} .gd-col h3{margin:12px 0 6px} .gd-col h3:first-child{margin-top:0}
.gd h3 small{color:var(--muted); font-weight:500; margin-left:4px}
.gt-cap{text-transform:capitalize} .gt-warn{color:#ffbd7a}
/* näidikud */
.gt-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px}
.gt{position:relative; display:flex; flex-direction:column; gap:3px; padding:11px 13px 12px; border-radius:12px; overflow:hidden;
  background:linear-gradient(160deg, color-mix(in srgb, var(--c) 14%, transparent), rgba(255,255,255,.015) 60%); border:1px solid color-mix(in srgb, var(--c) 35%, var(--line))}
.gt::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:var(--c); box-shadow:0 0 14px var(--c)}
.gt-k{font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); font-weight:700}
.gd .gt-v{font-size:25px; font-weight:700; line-height:1.1; font-variant-numeric:tabular-nums}
.gt-moonv{display:flex; align-items:center; gap:8px} .gt-moonv b{font-size:20px}
.gt-s{font-size:12px; color:var(--muted); line-height:1.35}
.gt-bar{display:block; height:5px; border-radius:3px; background:var(--line-soft); margin:3px 0 2px; position:relative}
.gt-bar i{display:block; height:100%; border-radius:3px; background:var(--c); box-shadow:0 0 8px var(--c)}
.gt-bar.heat{background:linear-gradient(90deg,#7cc0f0,#9fd356 40%,#f1cb4a 70%,#f2933f)} .gt-bar.heat i{position:absolute; top:-3px; width:3px; height:11px; background:#fff; box-shadow:0 0 6px #fff; border-radius:2px}
.gt-sun{width:100%; height:30px; margin:2px 0}
/* mida teha */
.gd-todo{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,1fr); gap:20px}
.gd-colh{display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px}
.gd-filter{display:flex; gap:4px; flex-wrap:wrap}
.gd-filter button{background:transparent; border:1px solid var(--line); color:var(--muted); border-radius:999px; padding:3px 11px; font:inherit; font-size:12.5px; cursor:pointer}
.gd-filter button.on{background:var(--ice); color:#0e1a25; border-color:var(--ice)}
.gd-list{display:grid; gap:6px}
.gd-it{display:flex; gap:6px; align-items:flex-start; border:1px solid var(--line-soft); border-left:3px solid var(--a); border-radius:8px; padding:7px 9px; background:rgba(255,255,255,.02)}
.gd-it.urgent{border-color:rgba(230,83,79,.55); border-left-color:#e6534f; background:rgba(230,83,79,.07)}
.gd-it.soon, .gd-it.wait{background:transparent}
.gd-it-b{flex:1; min-width:0}
.gd-it-h{display:flex; align-items:baseline; gap:7px; flex-wrap:wrap} .gd-it-h b{font-size:13.5px}
.gd-act{color:var(--a); font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em}
.gd-tag{font-size:10.5px; border:1px solid var(--line); border-radius:999px; padding:0 6px; color:var(--muted)} .gd-tag.red{color:#ff8c87; border-color:#e6534f}
.gd-why{font-size:12px; color:var(--muted); margin-top:2px; line-height:1.35}
.gd-best{display:inline-flex; flex-wrap:wrap; gap:4px; margin-top:4px}
.gd-bd{font-size:11.5px; padding:0 7px; border-radius:999px; border:1px solid var(--line); color:var(--ink); cursor:help; white-space:nowrap} .gd-bd.top{border-color:#f1cb4a; color:#f1cb4a}
.gd-star{background:none; border:0; color:var(--faint); font-size:15px; cursor:pointer; padding:0 1px; line-height:1.2} .gd-star.on{color:#f1cb4a}
.gd-tasks{margin:0; padding-left:16px; font-size:13px; color:var(--ink)} .gd-tasks li{margin-bottom:3px}
/* tööde aknad */
.gj-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:8px}
.gj{display:flex; flex-direction:column; gap:2px; border:1px solid var(--line-soft); border-radius:10px; padding:8px 10px; background:rgba(255,255,255,.02)}
.gj.ok{border-color:rgba(80,200,120,.35)} .gj.warn{border-color:rgba(242,147,63,.5); background:rgba(242,147,63,.06)}
.gj-h{font-size:11.5px; color:var(--muted); font-weight:600; display:flex; gap:6px} .gj-h i{font-style:normal}
.gj b{font-size:15px} .gj.ok b{color:#7fe0a0} .gj.warn b{color:#ffbd7a}
.gj small{font-size:11.5px; color:var(--muted); line-height:1.35}
/* kuukalender */
.gd-selc{font-size:12.5px; color:var(--muted); display:inline-flex; gap:6px; align-items:center}
.gd-selc select, #gdQ{background:var(--bg-2); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:5px 9px; font:inherit; font-size:13px}
#gdQ{min-width:240px}
.gd-selinfo{font-size:13px; margin:0 0 8px; color:#f1cb4a}
.gd-days{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(54px,1fr); gap:4px; overflow-x:auto; padding-bottom:6px; scrollbar-width:thin}
.gd-day{display:flex; flex-direction:column; align-items:center; gap:2px; border:1px solid var(--line-soft); border-radius:8px; padding:5px 2px; font-size:11px; cursor:help; min-height:118px}
.gd-day.we .gd-dw{color:#ffbd7a}
.gd-day.node{background:repeating-linear-gradient(135deg, transparent 0 6px, rgba(255,255,255,.04) 6px 12px)}
.gd-day.fit{border-color:rgba(159,208,228,.5)}
.gd-day.best{border:2px solid #f1cb4a; box-shadow:0 0 0 3px rgba(241,203,74,.15), 0 0 16px rgba(241,203,74,.25)}
.gd-dw{color:var(--muted); font-weight:700} .gd-dd{font-variant-numeric:tabular-nums; color:var(--ink)}
.gd-ph{min-height:12px; font-size:9.5px; color:#f3efd8; text-align:center; line-height:1.1}
.gd-el{background:var(--c); color:#13202b; font-weight:800; border-radius:4px; padding:0 4px; font-size:10.5px}
.gd-wx{display:flex; flex-direction:column; align-items:center; line-height:1.15} .gd-wx b{font-size:11.5px} .gd-wx i{font-style:normal; color:var(--muted)}
.gd-wx em{font-style:normal; color:#7cc0f0; font-size:10px} .gd-wx em.dry{color:var(--faint)} .gd-wx.dim{color:var(--faint)}
.gd-leg{display:flex; flex-wrap:wrap; gap:12px; font-size:11.5px; color:var(--muted); margin-top:6px}
.gd-leg i{display:inline-block; width:16px; text-align:center; border-radius:3px; color:#13202b; font-style:normal; font-weight:800; margin-right:4px; font-size:10px}
.gd-leg-node{padding:0 6px; border-radius:4px; background:repeating-linear-gradient(135deg, transparent 0 4px, rgba(255,255,255,.09) 4px 8px)}
/* viljakoristus */
.gr-off{margin:-2px 0 8px}
.gr-body{display:grid; grid-template-columns:200px minmax(0,1fr); gap:16px; align-items:center}
.gr-gauge{display:flex; flex-direction:column; align-items:center; text-align:center}
.gr-gauge svg{width:170px; height:auto} .gr-gauge b{font-size:30px; margin-top:-26px; font-variant-numeric:tabular-nums; text-shadow:0 0 18px currentColor}
.gr-gauge span{font-size:12px; color:var(--muted)} .gr-gauge small{font-size:12px; margin-top:2px}
.gc{width:100%; height:auto; display:block} .gc-tx{font-size:10.5px; fill:var(--muted)} .gc-tx.end{text-anchor:end}
.gr-leg, .tl-leg, .gd-legacts{display:flex; flex-wrap:wrap; gap:12px; font-size:11.5px; color:var(--muted); margin-top:4px}
.gr-leg i, .tl-leg i, .gd-legacts i{display:inline-block; width:14px; height:8px; border-radius:2px; margin-right:4px; vertical-align:middle}
.gr-facts{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:8px; margin-top:10px}
.gr-facts div{display:flex; flex-direction:column; gap:2px; border:1px solid var(--line-soft); border-radius:10px; padding:8px 10px}
.gr-facts span{font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; font-weight:700} .gr-facts b{font-size:15px} .gr-facts small{font-size:11.5px; color:var(--muted)}
/* aasta */
.tl-svg{width:100%; height:62px; display:block}
.gd-plan{margin-top:16px}
.gd-year{font-size:13px}
.gd-row-h{display:grid; grid-template-columns:20px minmax(150px,230px) minmax(0,1fr); align-items:center; gap:6px; padding:2px 0}
.gd-months{display:grid; grid-template-columns:repeat(12,1fr); font-size:10.5px; color:var(--faint)} .gd-months span{border-left:1px solid var(--line-soft); padding-left:3px}
.gd-grp{margin:10px 0 2px; font-size:11px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); font-weight:700}
.gd-name{background:none; border:0; color:var(--ink); text-align:left; font:inherit; cursor:pointer; padding:0; display:flex; align-items:center; gap:6px}
.gd-name:hover{color:var(--ice)}
.gd-dot{width:8px; height:8px; border-radius:50%; background:var(--c); box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 30%, transparent); flex:none}
.gd-bar{position:relative; height:13px; background:repeating-linear-gradient(90deg, var(--line-soft) 0 1px, transparent 1px calc(100%/12)); border-radius:3px}
.gd-band{position:absolute; top:2px; bottom:2px; border-radius:3px; opacity:.9}
.gd-today{position:absolute; top:-3px; bottom:-3px; width:2px; background:#fff; border-radius:1px; box-shadow:0 0 5px rgba(255,255,255,.7)}
.gd-row.open{background:rgba(159,208,228,.05); border-radius:6px}
.gd-det{padding:4px 8px 10px 26px; font-size:13px} .gd-det p{margin:4px 0}
@media (max-width:900px){ .gd-todo{grid-template-columns:minmax(0,1fr)} .gr-body{grid-template-columns:minmax(0,1fr)} }
@media (max-width:700px){
  .gt-row{grid-template-columns:repeat(2,minmax(0,1fr))} .gt-v{font-size:21px}
  .gd-row-h{grid-template-columns:18px minmax(100px,128px) minmax(0,1fr)} .gd-name{font-size:12px} #gdQ{min-width:0; width:100%}
  .gr-chart{overflow-x:auto; -webkit-overflow-scrolling:touch} .gc{min-width:680px}
  .gr-facts, .gj-row{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gr-gauge svg{width:140px}
}
.pl-lbl{color:var(--muted); font-size:11.5px}

/* suumi ajal: kallid filtrid maha, kihid oma kompositsioonikihil (sujuv 60 fps) */
.leaflet-zoom-anim .leaflet-zoom-animated{will-change:transform}
.leaflet-tile-container{will-change:transform}
/* Kaardi peal ei kasuta klaasihägu: radar liigub pidevalt ja hägu arvutataks iga kaadri järel uuesti
   (see tegi suumi ja lohistamise tõksuvaks). Läbipaistmatum taust näeb välja sama. */
#mapWrap .map-overlay, #mapWrap .map-overlay .ly-btn, #mapWrap .ly-menu, #mapWrap .map-bottom, #mapWrap .tm-bar, #mapWrap .lightning-sum,
#mapWrap .map-legend, #mapWrap .cursor-info, #mapWrap .lbl-modes, #mapWrap .layer-toggles{backdrop-filter:none!important; -webkit-backdrop-filter:none!important}
#mapWrap .ly-btn, #mapWrap .map-legend, #mapWrap .lightning-sum, #mapWrap .map-bottom, #mapWrap .tm-bar, #mapWrap .cursor-info{background:rgba(18,33,48,.94)}
.leaflet-marker-pane, .leaflet-tooltip-pane{transition:opacity .18s}

/* ===== Seenekohad ===== */
.ms-top{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:10px}
.ms-top h3, .ms h3{font-size:14px; margin:12px 0 6px}
.ms-chips{display:flex; flex-wrap:wrap; gap:6px}
.ms-chip{background:rgba(127,224,160,.08); border:1px solid rgba(127,224,160,.35); color:var(--ink); border-radius:999px; padding:3px 10px; font:inherit; font-size:12.5px; cursor:pointer}
.ms-chip b{color:#7fe0a0; margin-left:3px} .ms-chip.on{background:#7fe0a0; color:#0e1a25} .ms-chip.on b{color:#0e1a25}
.ms-chip.bad{border-color:rgba(230,83,79,.5); background:rgba(230,83,79,.08)} .ms-chip.bad b{color:#ff8c87}
.ms-near{margin:0; padding-left:18px; font-size:13px} .ms-near li{margin-bottom:5px}
.ms-go{background:none; border:1px solid var(--line); color:var(--ice); border-radius:6px; padding:0 6px; font:inherit; font-size:12px; cursor:pointer; margin-right:4px}
.ms-new{color:#7fe0a0; font-size:12px}
.ms-ctl{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:8px 0}
.ms-ctl select{background:var(--bg-2); color:var(--ink); border:1px solid var(--line); border-radius:6px; padding:4px 8px; font:inherit; font-size:13px}
.ms-ctl label{font-size:13px; color:var(--muted); display:inline-flex; gap:6px; align-items:center}
.ms-map-wrap{height:460px; border-radius:var(--radius-m); overflow:hidden; border:1px solid var(--line-soft)} #msMap{height:100%; background:var(--map-bg)}
.ms-season{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(220px,100%),1fr)); gap:8px}
.ms-season div{border:1px solid var(--line-soft); border-left:3px solid #7fe0a0; border-radius:6px; padding:6px 9px; display:grid; gap:2px; font-size:13px}
.ms-season div.bad{border-left-color:#e6534f} .ms-season small{color:var(--muted)}
.ms-latest{margin:0; padding-left:18px; font-size:13px; columns:2; column-gap:24px} .ms-latest li{margin-bottom:3px; break-inside:avoid}
@media (max-width:700px){ .ms-top{grid-template-columns:minmax(0,1fr)} .ms-map-wrap{height:360px} .ms-latest{columns:1} }

/* ===== Minu Veder kaardid ===== */
body:not(.wallpaper) #ovMine{display:block; overflow:visible; margin:10px 0 0}
#ovMine .mc-head{display:flex; justify-content:space-between; align-items:center; margin:2px 0 6px}
#ovMine .mc-head b{font-size:12px; text-transform:uppercase; letter-spacing:.07em; color:var(--muted)}
#ovMine .mc-head span{display:flex; gap:4px}
#ovMine .mc-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px}
body:not(.wallpaper) #ovMine .mc{display:flex; flex-direction:column; align-items:stretch; gap:4px; text-align:left; padding:9px 11px; border-radius:10px;
  border:1px solid var(--line); border-left:3px solid #50c878; background:rgba(255,255,255,.025); min-height:84px; cursor:pointer; color:inherit; font:inherit}
body:not(.wallpaper) #ovMine .mc:hover{background:rgba(95,179,255,.07); border-color:rgba(95,179,255,.5)}
body:not(.wallpaper) #ovMine .mc.warn{border-left-color:#f1cb4a} body:not(.wallpaper) #ovMine .mc.bad{border-left-color:#e6534f; background:rgba(230,83,79,.06)}
body:not(.wallpaper) #ovMine .mc.lk, body:not(.wallpaper) #ovMine .mc.loading{border-left-color:var(--line)}
.mc-h{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); font-weight:600}
.mc-h i{font-style:normal} .mc-h em{margin-left:auto; font-style:normal; opacity:.5}
.mc-v{display:flex; align-items:baseline; gap:4px; flex-wrap:wrap}
.mc-v b{font-size:22px; line-height:1.05; font-variant-numeric:tabular-nums}
.mc-v small{color:var(--muted); font-size:12px}
.mc-l{color:var(--muted); font-size:11.5px; flex-basis:100%}
.mc-t{font-size:12.5px; line-height:1.35; color:var(--ink); display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.mc-sk{height:18px; border-radius:4px; background:linear-gradient(90deg,var(--line-soft),rgba(255,255,255,.06),var(--line-soft)); background-size:200% 100%; animation:mcsk 1.2s infinite}
.mc-sk.s{height:10px; width:70%}
@keyframes mcsk{0%{background-position:100% 0}100%{background-position:-100% 0}}

.gd-wet{font-size:12.5px; color:#9fd0e4; background:rgba(79,159,214,.08); border:1px solid rgba(79,159,214,.3); border-radius:8px; padding:6px 10px; margin:0 0 8px}
.gd-more{margin-top:6px; background:none; border:1px dashed var(--line); color:var(--ice); border-radius:8px; padding:5px 10px; font:inherit; font-size:12.5px; cursor:pointer; width:100%}
body:not(.wallpaper) #ovMine .om-edit{border-radius:999px; padding:3px 9px; display:inline-flex}
body:not(.wallpaper) #ovMine .mc{white-space:normal; flex:initial; border-radius:10px; font-size:13px}

/* ===== Tuuleenergia ===== */
.wp-tiles{margin:6px 0 10px}
.wp-chart{margin:4px 0 12px}
.wp-grid{display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:14px}
.wp-map-wrap{height:430px; border-radius:var(--radius-m); overflow:hidden; border:1px solid var(--line-soft)} #wpMap{height:100%; background:var(--map-bg)}
.wp-farms h3{font-size:14px; margin:0 0 8px}
.wp-farm{display:grid; grid-template-columns:24px minmax(0,1fr) 92px; gap:8px; align-items:center; width:100%; text-align:left; background:none;
  border:0; border-bottom:1px solid var(--line-soft); color:inherit; font:inherit; padding:6px 2px; cursor:pointer}
.wp-farm:hover{background:rgba(124,212,255,.06)}
.wp-fn{display:flex; flex-direction:column; min-width:0} .wp-fn b{font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .wp-fn small{font-size:11.5px; color:var(--muted)}
.wp-fv{display:flex; flex-direction:column; align-items:flex-end; gap:3px} .wp-fv b{font-size:13px; font-variant-numeric:tabular-nums}
.wp-fv i{display:block; width:100%; height:4px; border-radius:2px; background:linear-gradient(90deg,var(--c) var(--w),var(--line-soft) var(--w))}
.wp-rot{display:block; overflow:visible; filter:drop-shadow(0 0 3px rgba(0,0,0,.6))}
.wp-blades{transform-origin:12px 12px; animation:wpspin 2s linear infinite}
@keyframes wpspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){ .wp-blades{animation:none!important} }
.wp-mk{background:none; border:0}
@media (max-width:800px){ .wp-grid{grid-template-columns:minmax(0,1fr)} .wp-map-wrap{height:340px} .wp-chart{overflow-x:auto} .wp-chart .gc{min-width:680px} }
.wp-tiles .gt-v{font-size:24px; font-weight:700}
.sp-ic{display:block; overflow:visible} .sp-ic.on{filter:drop-shadow(0 0 5px rgba(255,210,122,.8))}
.sp-ic.on .sp-rays{transform-origin:12px 12px; animation:wpspin 18s linear infinite}
#spMap{height:100%; background:var(--map-bg)}

/* ===== lehesisesed dialoogid ===== */
.ve-dlg{border:1px solid var(--line); border-radius:16px; background:var(--bg-2); color:var(--ink); width:min(440px,92vw); padding:18px 20px;
  box-shadow:0 30px 80px rgba(0,0,0,.55)}
.ve-dlg::backdrop{background:rgba(3,8,14,.6); backdrop-filter:blur(3px)}
.ve-dlg h2{margin:0 0 6px; font-size:17px}
.ve-text{margin:0 0 12px; color:var(--muted); font-size:13.5px; line-height:1.45}
.ve-in{width:100%; box-sizing:border-box; background:var(--bg); color:var(--ink); border:1px solid var(--line); border-radius:10px; padding:10px 12px; font:inherit; font-size:15px}
.ve-in:focus{outline:2px solid var(--ice); outline-offset:1px; border-color:transparent}
.ve-chips{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px}
.ve-chip{background:transparent; border:1px solid var(--line); color:var(--ink); border-radius:999px; padding:4px 12px; font:inherit; font-size:13px; cursor:pointer}
.ve-chip:hover{border-color:var(--ice); color:var(--ice)}
.ve-act{display:flex; justify-content:flex-end; gap:8px; margin-top:16px}
.ve-danger{background:#e6534f!important; border-color:#e6534f!important; color:#fff!important}

/* ===== OSM kihid, elektrivõrk ===== */
.ox-big{height:520px}
.ox-mine{display:grid; gap:8px; margin:6px 0 10px}
.ox-mine > div{border:1px solid rgba(124,192,240,.35); border-radius:10px; padding:8px 12px; background:rgba(124,192,240,.06)}
.ox-mine p{margin:3px 0 0; font-size:13px} .ox-mine p.bad{color:#ff8c87; font-weight:600}
.ox-ok{margin:4px 0 10px; color:#7fe0a0!important}
.ox-tips{border:1px solid rgba(230,83,79,.45); background:rgba(230,83,79,.07); border-radius:10px; padding:8px 12px; margin:8px 0; font-size:13px}
.ox-tips ul{margin:4px 0 0; padding-left:18px}
.ox-leg{margin:6px 0} .ox-leg i{display:inline-block; width:12px; height:8px; border-radius:6px; margin:0 3px 0 6px; vertical-align:middle}
.ox-spark{width:100%; height:60px; display:block; margin-top:8px; background:linear-gradient(0deg,rgba(230,83,79,.06),transparent)}
.ox-spark-l{display:flex; justify-content:space-between; font-size:11px; color:var(--faint)}
.ox-ic{display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:color-mix(in srgb, var(--c) 22%, transparent); font-size:13px}
.ox-ctl{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:4px 0 10px}
.ox-ctl label{font-size:13px; color:var(--muted); display:inline-flex; gap:6px; align-items:center}
.ox-ctl select{background:var(--bg-2); color:var(--ink); border:1px solid var(--line); border-radius:8px; padding:5px 8px; font:inherit; font-size:13px; max-width:min(420px,80vw)}
#gridMap, #evMap, #towerMap, #bathMap, #campMap, #trailMap{height:100%; background:var(--map-bg)}
#trailOut .wp-map-wrap{height:440px}
@media (max-width:800px){ .ox-big{height:380px} #trailOut .wp-map-wrap{height:340px} }