*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:#f3f6f8;color:#18313e;font-family:Arial,sans-serif;font-size:14px}
header{display:flex;align-items:center;gap:14px;background:white;border-bottom:3px solid #087c9e;padding:8px 18px}
header a{color:inherit;text-decoration:none}.logoLink{display:block}.logo{width:70px;height:70px;object-fit:contain}h1{margin:0;font-size:23px}
.lang{margin-left:auto;display:flex;gap:6px}.lang button{font-size:14px;font-weight:700;min-width:44px;background:white}.lang button.active{outline:2px solid #087c9e}
main{padding:12px;max-width:1600px;margin:auto}.toolbar,.addbar{display:flex;gap:7px;align-items:center;flex-wrap:wrap;background:white;padding:9px;margin-bottom:9px;border-radius:7px}
button,input,select{font:inherit;padding:7px 9px;border:1px solid #bccbd2;border-radius:5px;min-height:40px}button{cursor:pointer;background:#eef5f7}button:hover{background:#dcecef}.danger{color:#9d2525}
.toolbar #tripName{font-weight:bold;min-width:220px}.sharebox,.notice,.warnings{padding:10px;background:#eaf6fa;border:1px solid #9dcbd9;border-radius:6px;margin:8px 0}
.warnings{background:#fff5df;border-color:#e4bf68}.warnings div{margin-top:4px}.sharebox input{width:min(650px,70vw)}.hint{font-size:12px;margin-top:5px}.hidden{display:none!important}
.placewrap{position:relative}.suggestions{position:absolute;top:100%;left:0;z-index:1100;background:white;border:1px solid #bbb;min-width:300px;box-shadow:0 4px 12px #0002}
.suggestions div{padding:7px;cursor:pointer}.suggestions div:hover{background:#eaf4f7}
.summary{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}.summary span,.summary small{background:white;border:1px solid #dce5e8;border-radius:6px;padding:7px 10px}.summary small{color:#64747c}
.tempExtremes{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:8px;margin:8px 0}.tempExtremes>div{background:#fff;border:1px solid #dce5e8;border-radius:6px;padding:8px 10px}
.tempExtremes span{display:block;font-size:11px;color:#6b7b82;margin-bottom:3px}.tempExtremes strong{font-size:16px;font-weight:400}
.tablewrap{overflow:auto;background:white;border-radius:7px;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}table{border-collapse:collapse;width:100%;white-space:nowrap}
th,td{padding:7px 8px;border-bottom:1px solid #dfe6e9;text-align:center}th{background:#e7f1f4;position:sticky;top:0}td.place{text-align:left}.stayStart td.place{font-weight:700}.stayFollow td.place{padding-left:28px}
.good{background:#dff3e4}.mid{background:#fff1c7}.bad{background:#f8dddd}td.ratingCell{font-size:11px;color:#75858d}.ratingCell.good,.ratingCell.mid,.ratingCell.bad{background:transparent}.muted{color:#75858d}
.histDelta{font-size:10px;color:#8a6432;margin-top:2px}.rowActions{display:flex;gap:2px}.rowActions button{min-height:28px;padding:2px 5px}
.mapPanel,.chartPanel{background:white;padding:8px;margin-top:10px;border-radius:7px}.mapPanel #map{height:520px}.numberLabel{font-weight:bold;border:1px solid #667;background:white}
.chartPanel h2{font-size:16px;margin:8px 0}.chartWrap{height:280px;position:relative;margin-bottom:18px}.chartWrap canvas{max-width:100%!important}
#status{margin-top:8px;color:#64747c;font-size:12px}
footer{margin-top:14px;padding:12px 4px;border-top:1px solid #cfdadd;color:#66767d;font-size:12px;line-height:1.55}footer .legend{margin-bottom:5px}footer a{color:#087c9e}
.modal{position:fixed;inset:0;background:#0006;z-index:2000;display:flex;align-items:center;justify-content:center;padding:15px}.modalCard{background:white;border-radius:8px;padding:18px;width:min(520px,100%);box-shadow:0 10px 35px #0004}
.modalCard h2{margin-top:0}.modalCard label{display:block;margin:10px 0;position:relative}.modalCard input{width:100%}.modalButtons{display:flex;gap:8px;justify-content:flex-end}

@media(max-width:1024px){main{padding:8px}header{padding:7px 10px}.toolbar,.addbar{gap:6px;padding:7px}.tablewrap{width:100%;overflow-x:auto}table{font-size:13px}th,td{padding:6px 7px}.mapPanel #map{height:440px}.chartWrap{height:250px}}
@media(max-width:700px){body{font-size:13px}header{gap:8px}.logo{width:46px;height:46px}header h1{font-size:16px;line-height:1.15}header small{font-size:10px}
 main{padding:6px}.toolbar,.addbar{display:grid;grid-template-columns:1fr 1fr;gap:5px}.toolbar #tripName{grid-column:1/-1;min-width:0;width:100%}.toolbar button,.addbar button,.addbar label{width:100%}.addbar .placewrap{grid-column:1/-1}.addbar input{width:100%}
 .suggestions{min-width:0;width:100%}.summary{gap:4px}.summary span,.summary small{padding:5px 7px;font-size:11px}.tempExtremes{grid-template-columns:1fr 1fr;gap:5px}.tempExtremes>div{padding:6px}.tempExtremes strong{font-size:13px}.tempExtremes span{font-size:10px}
 table{font-size:12px}th,td{padding:5px 6px}.stayFollow td.place{padding-left:18px}.mapPanel #map{height:58vh;min-height:320px}.chartPanel{padding:7px}.chartWrap{height:220px;margin-bottom:12px}footer{font-size:11px;padding:9px 2px}.sharebox input{width:100%;margin:5px 0}}
@media(max-width:390px){.toolbar,.addbar{grid-template-columns:1fr}.toolbar #tripName,.addbar .placewrap{grid-column:auto}.tempExtremes{grid-template-columns:1fr}.chartWrap{height:200px}}

@media print{
 @page{size:landscape;margin:10mm}
 body{background:white;font-size:9pt}.noPrint,.lang,#status{display:none!important}header{border-bottom:1px solid #777;padding:3px 0}.logo{width:42px;height:42px}h1{font-size:16pt}
 main{max-width:none;padding:0}.summary,.tempExtremes{break-inside:avoid}.tablewrap{overflow:visible}.tablewrap table{white-space:normal;font-size:7.5pt}th,td{padding:3px 4px}.histDelta{font-size:7pt}
 .mapPanel.hidden,.chartPanel.hidden{display:none!important}.mapPanel #map{height:300px}.chartWrap{height:240px}.chartPanel{break-before:page}.mapPanel{break-before:page}footer{font-size:8pt}
}

/* V2.0.3 */
.tempExtremes strong{font-size:13px!important}
td:nth-child(5){font-size:12px}
.paramsPanel{background:#fff;border:1px solid #ccdadd;border-radius:7px;padding:10px;margin:8px 0}
.paramGrid{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:8px;margin:9px 0}
.paramGrid label{display:flex;flex-direction:column;gap:3px}.paramGrid input{width:100%}
@media(max-width:700px){.paramGrid{grid-template-columns:1fr 1fr}.tempExtremes strong{font-size:11px!important}td:nth-child(5){font-size:11px}}
@media(max-width:390px){.paramGrid{grid-template-columns:1fr}}
.printMode .noPrint{display:none!important}

/* V2.0.6 – vergangene und aktuelle Reisetage */
tbody tr.pastRow td{background:#eef0f1!important;color:#8a9296!important}
tbody tr.pastRow td.ratingCell{color:#9aa1a5!important}
tbody tr.todayRow td.dayNumber strong{font-weight:700}

.sameDayBadge{display:inline-block;margin-left:5px;font-weight:400;font-size:11px;color:#607d8b;vertical-align:1px}

/* V2.1.2 – Smartphone-Ansicht */
@media(max-width:600px){
 .tablewrap{overflow-x:hidden}
 table{width:100%;min-width:0;table-layout:auto;font-size:11px}
 th,td{padding:6px 4px;white-space:normal}
 th:nth-child(1),td:nth-child(1){width:26px;text-align:center}
 th:nth-child(2),td:nth-child(2){width:82px;white-space:nowrap}
 th:nth-child(3),td:nth-child(3){min-width:115px;line-height:1.2}
 th:nth-child(4),td:nth-child(4){width:30px;text-align:center}
 th:nth-child(5),td:nth-child(5){width:70px;white-space:nowrap;font-size:10px}
 th:nth-child(6),td:nth-child(6){width:38px;white-space:nowrap}
 th:nth-child(7),td:nth-child(7),th:nth-child(8),td:nth-child(8),th:nth-child(9),td:nth-child(9),th:nth-child(10),td:nth-child(10),th:nth-child(11),td:nth-child(11){display:none}
 .stayFollow td.place{padding-left:10px}
 .sameDayBadge{font-size:10px;margin-left:2px}
 .summary{display:grid;grid-template-columns:1fr 1fr;gap:5px}
 .tempExtremes{grid-template-columns:1fr 1fr}
 .tempExtremes strong{font-size:10px!important;line-height:1.15}
 .tempExtremes span{font-size:9px;line-height:1.15}
 .warnings,.paramsPanel{font-size:11px}
 .paramGrid{grid-template-columns:1fr}
 .mapPanel #map{height:55vh;min-height:300px}
 .chartWrap{height:210px}
}
@media(max-width:390px){table{font-size:10px}th,td{padding:5px 3px}.tempExtremes{grid-template-columns:1fr}}

/* V2.1.3 – kompakte Reiseende-Eingabe */
/* V2.4.53: Keep the label in normal flow, outside the native date editor.
   This also leaves an accessible visible label when a date is filled or focused. */
.endDateField{position:relative;display:inline-flex;align-items:center;gap:8px;max-width:100%}
.endDateField #endDateHint{
 position:static;transform:none;flex:0 0 auto;
 color:#4d5960;white-space:nowrap
}
.endDateField #endDate{width:138px;padding-left:9px}
.endDateField #endDate:focus{padding-left:9px}
@media(max-width:600px){
 .endDateField{width:100%}
 .endDateField #endDate{flex:1 1 0;width:auto;min-width:0}
}

/* V2.1.4 – Wettersymbole besser erkennbar */
tbody td:nth-child(4){
  font-size:20px;
  line-height:1;
  text-align:center;
  filter:saturate(1.35) contrast(1.18);
  text-shadow:0 0 1px rgba(0,0,0,.28);
}
@media(max-width:600px){
  tbody td:nth-child(4){
    font-size:22px;
    min-width:32px;
    filter:saturate(1.45) contrast(1.22);
  }
}

/* V2.1.5 – Regenwahrscheinlichkeit als prozentual gefüllter Kreis */
.rainProbability{text-align:center;white-space:nowrap}
.rainGauge{
 --rain:0deg;
 display:inline-grid;
 place-items:center;
 width:38px;
 height:38px;
 border-radius:50%;
 background:conic-gradient(#0788e6 0deg var(--rain),#ffc400 var(--rain) 360deg);
 position:relative;
 vertical-align:middle;
 box-shadow:inset 0 0 0 1px rgba(0,70,120,.10);
}
.rainGauge::after{
 content:"";
 position:absolute;
 inset:5px;
 border-radius:50%;
 background:#fff;
 box-shadow:0 0 0 1px rgba(0,0,0,.05);
}
.rainGauge span{
 position:relative;
 z-index:1;
 font-size:10px;
 line-height:1;
 font-weight:700;
 color:#17324a;
}
tbody tr.pastRow .rainGauge{opacity:.55}
@media(max-width:600px){
 .rainGauge{width:34px;height:34px}
 .rainGauge::after{inset:5px}
 .rainGauge span{font-size:9px}
 th:nth-child(6),td:nth-child(6){width:42px}
}

/* V2.1.7 – mobile Eingabe: Datum + Ort in einer Zeile */
@media(max-width:600px){
  .addbar{
    display:grid;
    grid-template-columns:minmax(118px, 0.78fr) minmax(0, 1.22fr);
    gap:5px;
    align-items:center;
  }
  .addbar label:has(#date){
    width:100%;
    min-width:0;
    display:flex;
    align-items:center;
  }
  .addbar label:has(#date)>span{
    display:none;
  }
  .addbar #date{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    padding-left:6px;
    padding-right:3px;
    font-size:12px;
  }
  .addbar .placewrap{
    grid-column:auto;
    width:100%;
    min-width:0;
  }
  .addbar #place{
    width:100%;
    min-width:0;
    box-sizing:border-box;
    font-size:12px;
  }
  .addbar #add{
    grid-column:1/-1;
    width:100%;
  }
}
@media(max-width:390px){
  .addbar{
    grid-template-columns:minmax(112px, .82fr) minmax(0, 1.18fr);
  }
  .addbar #date,.addbar #place{font-size:11px}
}

/* V2.1.8 – „Datum“ mobil wieder sichtbar, Datum + Ort bleiben in einer Zeile */
@media(max-width:600px){
  .addbar label:has(#date){
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:4px;
    align-items:center;
  }
  .addbar label:has(#date)>span{
    display:inline !important;
    font-size:11px;
    white-space:nowrap;
  }
  .addbar #date{
    min-width:0;
    width:100%;
  }
}
@media(max-width:390px){
  .addbar label:has(#date)>span{font-size:10px}
}

/* V2.1.9 – konsistente mobile Eingabe: beide Beschriftungen oberhalb */
@media(max-width:600px){
  .addbar{
    display:grid;
    grid-template-columns:minmax(125px,.82fr) minmax(0,1.18fr);
    gap:5px;
    align-items:end;
  }

  .addbar label:has(#date),
  .addbar .placewrap{
    display:flex !important;
    flex-direction:column;
    align-items:stretch;
    gap:3px;
    width:100%;
    min-width:0;
  }

  .addbar label:has(#date)>span,
  .addbar .placewrap>label,
  .addbar .placewrap>.placeLabel{
    display:block !important;
    font-size:10px;
    line-height:1;
    white-space:nowrap;
    margin:0;
  }

  .addbar #date,
  .addbar #place{
    width:100%;
    min-width:0;
    height:40px;
    box-sizing:border-box;
    margin:0;
  }

  .addbar #add{
    grid-column:1/-1;
    width:100%;
  }
}
@media(max-width:390px){
  .addbar{
    grid-template-columns:minmax(120px,.86fr) minmax(0,1.14fr);
  }
}

/* V2.2.0 – robuste Smartphone-Ausrichtung der Reiseeingabe */
@media(max-width:600px){
  .addbar{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1.45fr) !important;
    grid-template-rows:auto 42px 42px auto !important;
    column-gap:8px !important;
    row-gap:5px !important;
    align-items:stretch !important;
  }

  /* Datum: Label oberhalb, Feld darunter */
  .addbar label:has(#date){
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 42px !important;
    gap:5px !important;
    width:100% !important;
    min-width:0 !important;
    align-items:stretch !important;
  }
  .addbar label:has(#date)>span{
    display:block !important;
    align-self:end !important;
    margin:0 !important;
    padding:0 !important;
    font-size:11px !important;
    line-height:1.1 !important;
  }
  .addbar #date{
    width:100% !important;
    height:42px !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  /* Ort: Wrapper bekommt exakt dieselbe vertikale Struktur */
  .addbar .placewrap{
    grid-column:2 !important;
    grid-row:1 / span 2 !important;
    display:grid !important;
    grid-template-columns:1fr !important;
    grid-template-rows:auto 42px !important;
    gap:5px !important;
    width:100% !important;
    min-width:0 !important;
    align-items:stretch !important;
    position:relative !important;
  }
  .addbar .placewrap>label,
  .addbar .placewrap>.placeLabel{
    display:block !important;
    align-self:end !important;
    margin:0 !important;
    padding:0 !important;
    font-size:11px !important;
    line-height:1.1 !important;
  }
  .addbar #place{
    width:100% !important;
    height:42px !important;
    min-width:0 !important;
    margin:0 !important;
    box-sizing:border-box !important;
  }

  /* Falls "Ort" im aktuellen Markup ein direktes Element der addbar ist,
     wird es in dieselbe Label-Zeile gezwungen. */
  .addbar>span[data-i18n="place"],
  .addbar>label[for="place"]{
    grid-column:2 !important;
    grid-row:1 !important;
    align-self:end !important;
    margin:0 !important;
    padding:0 !important;
    font-size:11px !important;
    line-height:1.1 !important;
  }

  .addbar #add{
    grid-column:1 / -1 !important;
    grid-row:3 !important;
    width:100% !important;
    height:42px !important;
    margin:0 !important;
  }

  /* Die übrigen Reiseparameter beginnen erst unter dem Hinzufügen-Button. */
  .addbar .endDateField,
  .addbar label:has(#histYears),
  .addbar label:has(#units){
    grid-row:auto !important;
  }
}

/* V2.2.1 – einheitliche Typografie im mobilen Reise-Eingabebereich */
@media(max-width:600px){
  .addbar{
    font-size:14px !important;
  }

  /* Beschriftungen */
  .addbar label:has(#date)>span,
  .addbar .placewrap>label,
  .addbar .placewrap>.placeLabel,
  .addbar>span[data-i18n="place"],
  .addbar>label[for="place"]{
    font-family:inherit !important;
    font-size:12px !important;
    font-weight:400 !important;
    line-height:1.2 !important;
  }

  /* Alle Eingabefelder und Auswahlfelder gleich groß.
     16 px verhindert außerdem den automatischen Safari-Zoom beim Fokussieren. */
  .addbar input,
  .addbar select,
  .addbar button{
    font-family:inherit !important;
    font-size:16px !important;
    font-weight:400 !important;
    line-height:1.2 !important;
  }

  .addbar #date,
  .addbar #place{
    font-size:16px !important;
    height:42px !important;
  }

  /* iOS/Safari rendert Datumswerte sonst teilweise mit abweichender Typografie. */
  .addbar input[type="date"]{
    -webkit-appearance:none;
    appearance:none;
    text-align:left;
  }
  .addbar input[type="date"]::-webkit-date-and-time-value{
    text-align:left;
    font-family:inherit;
    font-size:16px;
    line-height:1.2;
  }

  .addbar #add{
    font-size:16px !important;
    font-weight:400 !important;
  }
}

/* V2.2.2 – Anleitung im Kopfbereich */
.headerActions{margin-left:auto;display:flex;align-items:center;gap:10px}
.helpLink{border:0;background:transparent;padding:5px 3px;min-height:0;color:#087ead;text-decoration:underline;cursor:pointer;font:inherit}
.helpLink:hover{text-decoration:none}
.helpCard{max-width:680px;text-align:left}
.helpContent{line-height:1.45}
.helpContent ol{padding-left:22px}
.helpContent li{margin:8px 0}
.helpNote{margin-top:14px;font-size:12px;color:#5c6870}
@media(max-width:600px){
 header{display:grid;grid-template-columns:auto 1fr auto;gap:8px}
 .headerActions{display:flex;flex-direction:column-reverse;align-items:flex-end;gap:4px}
 .helpLink{font-size:12px!important;padding:2px 0}
 .helpCard{width:calc(100vw - 24px);max-height:82vh;overflow:auto;box-sizing:border-box}
 .helpContent{font-size:14px}
}
/* V2.3.0 – unauffälliger Statistik-Link */
.statsLink{color:inherit;opacity:.45;text-decoration:none;font-size:10px}.statsLink:hover{opacity:.9;text-decoration:underline}

/* V2.4.0 – stündliche Wetterdetails */
.dateDetail{appearance:none;border:0;background:transparent;color:inherit;font:inherit;padding:0;margin:0;cursor:pointer;text-align:left;white-space:nowrap}
.dateDetail:hover{text-decoration:underline}
.dateArrow{display:inline-block;font-size:16px;font-weight:700;color:#087ead;line-height:1;vertical-align:-1px;margin-left:2px}
.hourlyCard{max-width:820px;width:min(820px,calc(100vw - 28px));max-height:84vh;overflow:auto;box-sizing:border-box}
.hourlyMeta{margin:-5px 0 12px;color:#5c6870}
.hourlyScroll{overflow-x:auto}
.hourlyTable{width:100%;border-collapse:collapse}
.hourlyTable th,.hourlyTable td{padding:8px 7px;border-bottom:1px solid #dfe5e8;text-align:left;vertical-align:middle}
.hourlyTable th{position:sticky;top:0;background:#fff;z-index:1}
.hourlyTable small{display:block;color:#68777e;font-size:11px;margin-top:2px;white-space:nowrap}
.hourlyIcon{font-size:20px}
.hourlyTable .rainGauge{transform:scale(.86);transform-origin:left center}
@media(max-width:600px){
 .dateDetail{font-size:inherit!important}
 .dateArrow{font-size:15px}
 .hourlyCard{width:calc(100vw - 18px);padding:14px 10px}
 .hourlyTable{font-size:12px;min-width:510px}
 .hourlyTable th,.hourlyTable td{padding:7px 5px}
}

/* V2.4.2 */
.sunTimes{display:inline-block;margin-left:10px;white-space:nowrap;font-weight:600;color:#52636b}
.sunTimes small{font-weight:400;font-size:10px;color:#7b878d;margin-left:3px}
@media(max-width:600px){.sunTimes{display:block;margin:4px 0 0;font-size:12px}}


/* V2.4.7 – kompaktere Stundenansicht */
.hourlyTable{
  table-layout:auto;
  width:100%;
}
.hourlyTable th,.hourlyTable td{
  padding:6px 4px;
  white-space:nowrap;
}
.hourlyTable th:nth-child(1),.hourlyTable td:nth-child(1){width:44px}
.hourlyTable th:nth-child(2),.hourlyTable td:nth-child(2){width:34px;text-align:center}
.hourlyTable th:nth-child(3),.hourlyTable td:nth-child(3){width:72px}
.hourlyTable th:nth-child(4),.hourlyTable td:nth-child(4){width:54px}
.hourlyTable th:nth-child(5),.hourlyTable td:nth-child(5){width:52px}
.hourlyTable th:nth-child(6),.hourlyTable td:nth-child(6){width:34px}
.hourlyTable th:nth-child(7),.hourlyTable td:nth-child(7){width:88px}
@media(max-width:600px){
  .hourlyTable{
    min-width:0;
    width:100%;
    font-size:11px;
  }
  .hourlyTable th,.hourlyTable td{padding:5px 2px}
  .hourlyTable th:nth-child(1),.hourlyTable td:nth-child(1){width:38px}
  .hourlyTable th:nth-child(2),.hourlyTable td:nth-child(2){width:28px}
  .hourlyTable th:nth-child(3),.hourlyTable td:nth-child(3){width:62px}
  .hourlyTable th:nth-child(4),.hourlyTable td:nth-child(4){width:48px}
  .hourlyTable th:nth-child(5),.hourlyTable td:nth-child(5){width:45px}
  .hourlyTable th:nth-child(6),.hourlyTable td:nth-child(6){width:28px}
  .hourlyTable th:nth-child(7),.hourlyTable td:nth-child(7){width:76px}
  .hourlyTable .rainGauge{transform:scale(.72);transform-origin:center}
  .hourlyIcon{font-size:17px}
}

/* V2.4.8 – nativer Teilen-Button für Geräte mit Web Share API */
.sendLink{white-space:nowrap}
@media(min-width:601px){.sendLink{display:none!important}}

/* V2.4.9 – übliches Teilen-Symbol statt Emoji */
.sendLink{display:inline-flex;align-items:center;gap:6px}
.sendLink .shareIcon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* V2.4.10 – betriebssystemabhängiges Teilen-Symbol */
.shareIconIOS{display:inline-flex;align-items:center}
.shareIconAndroid{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.shareIconAndroid circle{fill:currentColor;stroke:none}

/* V2.4.11 – identische vertikale Ausrichtung von „Link kopieren“ und „Link teilen“ */
.shareActions{display:flex;align-items:stretch;gap:8px;flex-wrap:wrap;margin-top:8px}
.shareActions button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:44px;
  line-height:1.2;
  margin:0;
}
.shareActions .actionIcon{
  width:20px;
  height:20px;
  flex:0 0 20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:20px;
}
.shareActions .shareIconIOS .shareIcon,
.shareActions .shareIconAndroid{
  width:20px;
  height:20px;
  display:block;
}
@media(max-width:600px){
  .shareActions{gap:6px}
  .shareActions button{min-height:44px;padding-top:8px;padding-bottom:8px}
}

/* V2.4.12 – mobiler Sticky-Header bis einschließlich Trennlinie */
@media(max-width:600px){
  header{
    position:-webkit-sticky;
    position:sticky;
    top:0;
    z-index:1000;
    background:#fff;
  }
  /* verhindert Durchscheinen/Übermalen beim Scrollen */
  header::after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:1px;
    background:transparent;
    pointer-events:none;
  }
}

/* V2.4.16 – UV-Index grafisch */
.uvDaily{display:flex;align-items:center;gap:5px;min-width:76px;white-space:nowrap}
.uvMiniTrack{display:inline-block;width:48px;height:9px;border-radius:5px;background:#e8edf1;overflow:hidden}
.uvMiniFill{display:block;height:100%;border-radius:5px}.uvDaily b{font-size:11px;min-width:24px;font-variant-numeric:tabular-nums}
@media(max-width:600px){
 th:nth-child(7),td:nth-child(7),th:nth-child(9),td:nth-child(9),th:nth-child(10),td:nth-child(10),th:nth-child(11),td:nth-child(11),th:nth-child(12),td:nth-child(12),th:nth-child(13),td:nth-child(13){display:none!important}
 th:nth-child(8),td:nth-child(8){display:table-cell!important;width:76px}
 .uvDaily{min-width:68px;gap:3px}.uvMiniTrack{width:40px;height:8px}.uvDaily b{font-size:10px;min-width:22px}
}

/* V2.4.18 UV-Skala */
.uvScale{display:inline-block;position:relative;width:54px;height:10px;border-radius:5px;background:linear-gradient(90deg,#2878d0 0 17%,#22a447 34%,#e0b400 55%,#f07c18 75%,#d92d3a 100%)}.uvScale i{position:absolute;top:-2px;width:3px;height:14px;background:#111;transform:translateX(-50%);border-radius:2px}@media(max-width:600px){.uvScale{width:42px;height:8px}.uvScale i{height:12px}}

/* V2.4.20 – Ortskarte */
.placeMapLink{appearance:none;border:0;background:transparent;padding:0;margin:0;color:inherit;font:inherit;text-align:left;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;cursor:pointer}
.placeMapLink:hover{text-decoration-style:solid}
.placeMapCard{width:min(760px,94vw);max-width:760px}
.placeMapHead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:8px}
.placeMapHead h2{margin:0 0 2px}
.placeMapHead .closeBtn{min-width:44px;min-height:44px;margin:0}
#placeMap{height:480px;min-height:320px;border-radius:8px;overflow:hidden;background:#e9eef2}
@media(max-width:600px){.placeMapCard{width:94vw;padding:12px}#placeMap{height:390px;min-height:300px}.placeMapLink{min-height:0}}

/* V2.4.21 – Wetter-Layer in der Ortskarte */
.placeLayerBar{display:flex;gap:5px;overflow-x:auto;padding:2px 0 8px;-webkit-overflow-scrolling:touch}
.placeLayerBar button{flex:0 0 auto;min-height:38px;padding:6px 9px}
.placeLayerBar button.active{background:#087ead;color:#fff;border-color:#087ead}
.placeMapStatus{min-height:18px;font-size:12px;color:#6b7379;margin-bottom:4px}
.placeMapLegend{display:flex;align-items:center;gap:7px;flex-wrap:wrap;padding-top:8px;font-size:12px}
.legendGradient{width:150px;max-width:42vw;height:10px;border-radius:5px;display:inline-block}
.radarGradient{background:linear-gradient(90deg,#a8d8ff,#2878d0,#1b9e77,#ffe34d,#ff7f00,#d7191c)}
.cloudGradient{background:linear-gradient(90deg,#eef2f5,#c7ced4,#7e8790,#fff)}
.tempGradient{background:linear-gradient(90deg,#4055d8,#34a7db,#4bc46b,#f0db42,#f08b31,#d83434)}
.windGradient{background:linear-gradient(90deg,#d8f0ff,#54b8dd,#3bb273,#f1d34b,#e65c3a)}
.radarControls{display:grid;grid-template-columns:44px minmax(0,1fr) 52px;align-items:center;gap:8px;padding-top:8px}
.radarControls button{min-width:44px;min-height:40px;padding:4px}
.radarControls input{width:100%;min-width:0}
.radarControls strong{text-align:right;font-size:12px}
@media(max-width:600px){.placeLayerBar button{font-size:12px}.legendGradient{width:110px}}

/* V2.4.22: Leaflet in Modal zuverlässig dimensionieren */
.placeMapCard{max-height:92vh;overflow:auto}.placeWeatherMap{width:100%;height:480px;min-height:320px;position:relative}.placeWeatherMap .leaflet-container{width:100%;height:100%}@media(max-width:600px){.placeWeatherMap{height:390px;min-height:300px}}

/* V2.4.23 – robuste Ortskarten-Geometrie */
#placeMapModal .placeMapCard{width:min(900px,calc(100vw - 24px));max-width:900px;box-sizing:border-box}
#placeMapModal #placeMap{display:block!important;width:100%!important;height:500px!important;min-height:500px!important;max-height:none!important;position:relative!important;background:#dfe8ed}
#placeMapModal #placeMap.leaflet-container{font:12px/1.5 "Helvetica Neue",Arial,Helvetica,sans-serif}
@media(max-width:600px){
 #placeMapModal{padding:8px}
 #placeMapModal .placeMapCard{width:calc(100vw - 16px);padding:10px}
 #placeMapModal #placeMap{height:400px!important;min-height:400px!important}
}

.weatherValueIcon{background:transparent!important;border:0!important}.weatherValueIcon span{display:inline-block;white-space:nowrap;transform:translate(-50%,-50%);padding:3px 6px;border-radius:5px;background:rgba(255,255,255,.9);border:1px solid #59636b;color:#111;font-weight:700;font-size:12px}.placeMapLegend{display:grid;grid-template-columns:auto minmax(120px,180px);gap:2px 8px}.placeMapLegend b{grid-row:1/3}.placeMapLegend .legendGradient{grid-column:2;width:100%;max-width:none}.legendScale{grid-column:2;display:flex;justify-content:space-between;font-size:10px;color:#4d5961}

/* V2.4.26 – Wetterkarten-Zeitachse, Overlay-Stärke, Windrichtung */
.weatherMapControls{display:grid;grid-template-columns:minmax(180px,1fr) minmax(260px,2fr);gap:10px;align-items:center;margin:7px 0}
.overlayControl,.timeControl{display:flex;align-items:center;gap:7px;font-size:12px}.overlayControl label{white-space:nowrap}.overlayControl input,.timeControl input{min-width:80px;flex:1}.timeControl strong{min-width:155px;font-size:11px}.weatherMapMode{font-size:11px;font-weight:600;color:#087ead;min-height:16px;margin:2px 0 5px}
.windArrow{display:inline-block;font-size:15px;line-height:1;transform-origin:center}
@media(max-width:600px){.weatherMapControls{grid-template-columns:1fr;gap:5px}.timeControl strong{min-width:125px;font-size:10px}.placeLayerBar{overflow-x:auto;flex-wrap:nowrap}.placeLayerBtn{white-space:nowrap}}
.qrCard{max-width:390px;text-align:center}.qrCanvas{display:flex;justify-content:center;align-items:center;min-height:270px;padding:8px;background:#fff}.qrCanvas img,.qrCanvas canvas{max-width:260px!important;width:100%!important;height:auto!important}.locationWeatherActions{display:flex;justify-content:flex-end;margin:0 0 8px}@media(max-width:600px){.qrCard{max-width:calc(100vw - 24px)}.qrCanvas img,.qrCanvas canvas{max-width:230px!important}}
/* V2.4.29 */
#showPlaceWeather{white-space:nowrap}
@media(max-width:600px){#showPlaceWeather{min-height:44px}}

/* V2.4.31 */
.endDateField{position:relative}
.endDateField #endDateHint.hidden{display:none!important}
@media(min-width:601px){.endDateField #endDateHint{pointer-events:none}}

/* V2.4.32 */
#overlayOpacity:disabled{opacity:.35;cursor:not-allowed}.placeMapLink{cursor:pointer}

/* V2.4.33 – robuste Bedienebene für Wetterkarten-/Overlay-Dialog */
.placeMapCard{position:relative;isolation:isolate}
.placeMapHead,.placeLayerBar,.weatherMapControls,.weatherMapMode,.placeMapStatus,.placeMapLegend,.radarControls{
 position:relative;z-index:1200;pointer-events:auto
}
.weatherMapControls input,.weatherMapControls button,.placeLayerBar button,.placeMapHead button,.radarControls input,.radarControls button{
 pointer-events:auto;touch-action:manipulation
}
#overlayOpacity,#weatherTimeSlider,#radarSlider{touch-action:pan-y;cursor:pointer}
#placeMap{position:relative;z-index:1}
.modalClose,.closeBtn{position:relative;z-index:1300;pointer-events:auto;cursor:pointer}

/* V2.4.34 – Wolkenlayer deutlich sichtbar */
.leaflet-tile.cloudWeatherTiles{
 filter:grayscale(1) contrast(2.15) brightness(.72);
 mix-blend-mode:multiply;
}
.cloudValueIcon span{
 background:rgba(35,45,55,.88)!important;
 color:#fff!important;
 border:1px solid rgba(255,255,255,.9)!important;
 box-shadow:0 1px 4px rgba(0,0,0,.45)!important;
}

/* V2.4.36 – kombinierte Wettericons mit echter Überlagerung */
.weatherIconStack{position:relative;display:inline-block;width:1.65em;height:1.35em;vertical-align:-.22em;line-height:1}
.weatherIconStack .wiBack,.weatherIconStack .wiFront{position:absolute;display:block;line-height:1}
.weatherIconStack .wiBack{left:.02em;top:.02em;font-size:1.02em}
.weatherIconStack .wiFront{right:-.02em;bottom:-.02em;font-size:.90em;z-index:2}
.weatherIconStack.wiNightRain .wiFront,.weatherIconStack.wiNightStorm .wiFront{font-size:.94em}
.weatherIconStack.wiNightFog .wiFront{right:-.08em;bottom:.02em}
.weatherIconStack.wiNightSnow .wiFront{right:.00em;bottom:.00em}

/* V2.4.37 */
.sunTimes b{white-space:nowrap;font-weight:600}

/* V2.4.38 – bidirektionale Navigation Stundenwetter ↔ Karte */
.placeMapHeadActions{display:flex;align-items:center;gap:8px}
#mapHourlyBtn{white-space:nowrap}
@media(max-width:600px){#mapHourlyBtn{font-size:.9rem;padding:7px 9px}.placeMapHeadActions{gap:5px}}

/* V2.4.40 – variabler Kartenumkreis + eindeutige Zeitkennzeichnung */
.radiusControl{min-width:150px;flex:1}
.radiusControl label{display:flex!important;justify-content:space-between;gap:8px;margin:0 0 3px!important}
.radiusControl input{width:100%}
.weatherMapMode{font-weight:700}

/* V2.4.42 */
.hourlyRowHint{margin:0 0 6px;padding:6px 9px;border-radius:7px;background:rgba(0,160,170,.09);font-size:.92em}

/* V2.4.43 – robuste mobile Links in Reisetabelle */
.dateDetail,.placeMapLink{position:relative;z-index:2;touch-action:manipulation;-webkit-tap-highlight-color:rgba(0,126,173,.16)}
@media(max-width:600px){
 .dateDetail,.placeMapLink{display:inline-flex;align-items:center;min-height:36px;max-width:100%;cursor:pointer}
 .dateDetail{padding:3px 2px}
 .placeMapLink{padding:3px 0}
 .dateCell,.place{position:relative}
}

/* V2.4.44 – Temperaturbalken */
.hourlyTempCell{min-width:126px}.hourlyTempNumbers{display:block;white-space:nowrap}
.hourlyTempBar{display:block;width:100%;height:7px;margin-top:4px;border-radius:5px;background:rgba(120,135,145,.16);overflow:hidden}
.hourlyTempBar i{display:block;height:100%;min-width:3px;border-radius:5px;transition:width .2s ease,background .2s ease}
@media(max-width:600px){.hourlyTempCell{min-width:105px}.hourlyTempBar{height:6px;margin-top:3px}}

/* V2.4.45 – Temperaturbalken mit fester 0-°C-Linie */
.hourlyTempBar.zeroScale{position:relative;overflow:visible;background:linear-gradient(90deg,rgba(50,120,210,.09) 0 30.77%,rgba(220,100,40,.07) 30.77% 100%)}
.hourlyTempBar.zeroScale .tempZero{position:absolute;top:-2px;bottom:-2px;width:2px;background:#263238;z-index:3;transform:translateX(-1px);border-radius:0}
.hourlyTempBar.zeroScale .tempValue{position:absolute;top:0;height:100%;min-width:2px;border-radius:4px;z-index:2}

/* V2.4.48 – kompakte Reiseansicht auf Smartphones */
.compactTripBar,.compactSheetClose,.compactBackdrop{display:none}
@media(max-width:600px){
 body.hasTripStops .compactTripBar.hidden{display:flex!important;position:sticky;top:var(--sticky-head-height,0);z-index:24;
  gap:6px;margin:5px 0 6px;padding:5px;background:rgba(255,255,255,.96);border:1px solid #d4e1e5;border-radius:9px}
 body.hasTripStops .compactTripBar button{flex:1;min-height:38px;padding:6px 8px;font-size:13px}
 body.hasTripStops .toolbar:not(.compactOpen),body.hasTripStops .addbar:not(.compactOpen){display:none!important}
 body.hasTripStops #summary,body.hasTripStops #tempExtremes{display:none!important}
 body.hasTripStops main{padding-top:2px}
 body.hasTripStops .tablewrap{margin-top:2px}
 body.hasTripStops .compactBackdrop:not(.hidden){display:block;position:fixed;inset:0;background:rgba(0,0,0,.34);z-index:80}
 body.hasTripStops .toolbar.compactOpen,body.hasTripStops .addbar.compactOpen{
  display:flex!important;position:fixed;left:8px;right:8px;bottom:8px;top:auto;z-index:81;max-height:82vh;overflow:auto;
  background:#fff;border:1px solid #c8d8dd;border-radius:14px;padding:42px 12px 14px;box-shadow:0 10px 35px rgba(0,0,0,.28);
  flex-direction:column;align-items:stretch;gap:8px
 }
 body.hasTripStops .toolbar.compactOpen input,body.hasTripStops .addbar.compactOpen input,
 body.hasTripStops .addbar.compactOpen select,body.hasTripStops .toolbar.compactOpen button,
 body.hasTripStops .addbar.compactOpen button{width:100%;min-height:42px}
 body.hasTripStops .compactOpen .compactSheetClose{display:block!important;position:absolute;right:10px;top:8px;width:34px!important;min-width:34px;min-height:30px!important;padding:2px;z-index:2}
 body.hasTripStops .addbar.compactOpen label{width:100%}
 body.hasTripStops .addbar.compactOpen .placewrap{width:100%}
}

/* V2.4.50 – Reiseende: mobile, nicht blockierende Validierung */
.fieldError{font-size:11px;color:#a32929;margin:3px 0 0;max-width:260px}
.endDateField:has(+ .fieldError:not(.hidden)) #endDate{border-color:#b53a3a}
@media(max-width:600px){#endDateError{width:100%;max-width:none}}

.mobileHeaderShare{display:none}
@media(max-width:600px){.mobileHeaderShare{display:inline-flex;align-items:center;gap:4px;min-height:34px;padding:5px 7px;white-space:nowrap}.mobileHeaderShare .shareIcon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}.mobileHeaderShare span{font-size:11px}.mobileShareCard{width:min(360px,94vw)}.mobileShareChoices{display:grid;gap:8px;margin-top:10px}.mobileShareChoices button{display:flex;align-items:center;gap:10px;width:100%;min-height:48px;text-align:left}}

/* V2.4.56: visible header, compact left editing, optional analysis columns.
   Column positions 2..12 stay unchanged to preserve existing weather styling. */
header{position:sticky;top:0;z-index:1000;background:#fff}
.srOnly{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.tableOptions{display:flex;align-items:center;margin:8px 0;font-size:12px}
.tableOptions label{display:flex;gap:7px;align-items:center;min-height:40px;cursor:pointer}
.tableOptions input{width:18px;height:18px;min-height:18px;flex:0 0 18px;accent-color:#087c9e}
#tripTable .extraColumn{display:none!important}
#tripTable.showExtraColumns .extraColumn{display:table-cell!important}
#tripTable .stopActionsCell,#tripTable .stopActionsHead{position:sticky;left:0;z-index:2;width:64px;min-width:64px;padding:3px;background:#fff;box-shadow:1px 0 #dfe6e9}
#tripTable .stopActionsHead{z-index:3;background:#e7f1f4}
.dayIndex{display:block;font-size:10px;color:#64747c}
.leftActions{display:flex;gap:4px;justify-content:center}
.leftActions button{padding:0;width:28px;min-width:28px;min-height:32px;font-size:18px;line-height:1}
button:focus-visible,input:focus-visible{outline:3px solid #087c9e;outline-offset:2px}
.stopActionDialog{border:1px solid #bccbd2;border-radius:10px;padding:0;max-width:420px;width:calc(100% - 24px);color:#193540}
.stopActionDialog::backdrop{background:#0007}
.stopActionCard{padding:18px}.stopActionCard h2{font-size:18px;margin:0 40px 12px 0}
#stopActionsClose{float:right;min-width:40px;font-size:20px}
.stopActionButtons{display:grid;gap:10px}.stopActionButtons button{min-height:44px}
.stopActionButtons button:disabled{cursor:not-allowed}
.orderBusy .stopActionButtons{pointer-events:none}
#stopActionError{color:#9d2525;font-size:13px}
@media(max-width:600px){
 #tripTable{font-size:11px}
 #tripTable th,#tripTable td{padding:5px 3px}
 #tripTable .stopActionsCell,#tripTable .stopActionsHead{width:62px;min-width:62px;padding:2px}
 #tripTable .dayIndex{display:none}
 #tripTable th:nth-child(2),#tripTable td:nth-child(2){width:74px;min-width:74px}
 #tripTable th:nth-child(3),#tripTable td:nth-child(3){min-width:82px;max-width:100px;white-space:normal;overflow-wrap:anywhere}
 #tripTable th:nth-child(4),#tripTable td:nth-child(4){width:24px}
 #tripTable th:nth-child(5),#tripTable td:nth-child(5){width:64px;font-size:10px}
 #tripTable .extraColumn{max-width:220px;white-space:normal}
 .stopActionDialog{max-height:80vh}
}
@media print{header{position:static}#tripTable .stopActionsCell,#tripTable .stopActionsHead{position:static;box-shadow:none}}

/* V2.4.57: explicit text colors prevent Safari's very pale disabled text.
   Inactive actions stay natively disabled and use a dashed neutral border
   instead of fading the entire control. Both themes maintain readable text. */
:root{color-scheme:light;--button-text:#18313e;--button-bg:#eef5f7;--disabled-text:#465966;--disabled-bg:#e8edf1;--disabled-border:#899ba7}
button{color:var(--button-text);-webkit-text-fill-color:currentColor}
button.danger{color:#9d2525}
.stopActionDialog button{appearance:none;-webkit-appearance:none;background:var(--button-bg)}
.stopActionButtons button:disabled{opacity:1;color:var(--disabled-text);-webkit-text-fill-color:var(--disabled-text);background:var(--disabled-bg);border:1px dashed var(--disabled-border)}
.stopActionButtons button:disabled span{color:inherit;-webkit-text-fill-color:inherit}
.tableOptions{flex-wrap:wrap;gap:4px 18px}
@media screen and (prefers-color-scheme:dark){
 :root{color-scheme:dark;--button-text:#e4edf3;--button-bg:#243946;--disabled-text:#b6c5d0;--disabled-bg:#202d37;--disabled-border:#758b9c}
 body{background:#101820;color:#e4edf3}
 header,.toolbar,.addbar,.tablewrap,.mapPanel,.chartPanel,.paramsPanel,.modalCard,.stopActionDialog,.suggestions,.tempExtremes>div,.summary span,.summary small{background:#18242e;color:#e4edf3;border-color:#425662}
 body.hasTripStops .compactTripBar.hidden,body.hasTripStops .compactOpen{background:#18242e;border-color:#425662}
 header{border-bottom-color:#4cbad2}
 button,.lang button,input,select,textarea{background:var(--button-bg);color:var(--button-text);border-color:#647d8c}
 input,select,textarea{background:#14232e;color:#e4edf3}
 input::placeholder,textarea::placeholder{color:#abbcc8;opacity:1}
 button:hover:not(:disabled),.suggestions div:hover{background:#334f5e}
 .dateDetail,.placeMapLink,.helpLink{background:transparent}
 .dateDetail,.placeMapLink{color:inherit}
 a,footer a,.helpLink,.dateArrow,.weatherMapMode{color:#78d6ec}
 header a{color:inherit}.lang button.active{outline-color:#78d6ec}
 th,.hourlyTable th{background:#223846;color:#e4edf3}
 th,td{border-bottom-color:#3c515f}
 #tripTable .stopActionsCell{background:#18242e;box-shadow:1px 0 #425662}
 #tripTable .stopActionsHead{background:#223846;box-shadow:1px 0 #425662}
 #tripTable tr.pastRow td{background:#202c35!important;color:#b6c5d0!important}
 .muted,.summary small,.tempExtremes span,footer,#status,.dayIndex,td.ratingCell,.helpNote,.hourlyMeta,.hourlyTable small,.sunTimes,.sunTimes small,.placeMapStatus,.legendScale,.endDateField #endDateHint{color:#b6c5d0}
 .histDelta{color:#e5c689}
 .sharebox,.notice{background:#163646;color:#e4edf3;border-color:#537c8d}
 .warnings{background:#3b301c;color:#f2dfb0;border-color:#957d45}
 button.danger,.fieldError,#stopActionError{color:#ffb6b6}
 .good{background:#183c2c}.mid{background:#40371c}.bad{background:#4a252b}
 .ratingCell.good,.ratingCell.mid,.ratingCell.bad{background:transparent}
 .modal{background:#0009}.stopActionDialog::backdrop{background:#0009}
 .tableOptions input{accent-color:#78d6ec}
 button:focus-visible,input:focus-visible{outline-color:#78d6ec}
 footer{border-color:#425662}
 .hourlyTempBar.zeroScale .tempZero{background:#dce7ee}
 .placeLayerBar button.active{background:#136987;color:#fff}
 .suite-launchpad{background:#243946!important;border-color:#647d8c!important}
 /* Keep map tiles, their own controls, QR code and the supplied logos intact. */
 .leaflet-container,.leaflet-control,.leaflet-popup-content-wrapper,.leaflet-popup-tip,.numberLabel{color:#18313e;color-scheme:light}
 .leaflet-container a{color:#087c9e}.leaflet-bar a{background:#fff;color:#18313e}
 .qrCanvas{background:#fff;color:#18313e;color-scheme:light}
 .rainGauge{color:#17324a}
}
@media print{:root{color-scheme:light}body{background:#fff;color:#18313e}}

/* Distance uses existing place-cell width; never adds intrinsic table width. */
.airDistance{display:block;contain:inline-size;white-space:normal;overflow-wrap:anywhere;font-size:.85em;font-weight:400;line-height:1.25;margin-top:4px;color:inherit}

/* Small explicit share target beside each name. Wrapping stays within the
   existing place column; links never trigger background app detection. */
.placeShareButton{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;min-width:28px;min-height:32px;padding:4px;margin:0 0 0 3px;white-space:normal;max-width:100%}
#placeShareClose{float:right;min-width:40px;min-height:40px;font-size:22px}
.placeShareChoices:not([hidden]){display:grid;gap:10px}
#placeShareDialog [hidden]{display:none!important}
.placeShareChoices a,.placeShareChoices button{display:flex;align-items:center;justify-content:center;min-height:44px;padding:8px;border:1px solid var(--disabled-border);border-radius:6px;background:var(--button-bg);color:var(--button-text);font:inherit;text-decoration:none;box-sizing:border-box}
.placeShareChoices a:focus-visible{outline:3px solid #087c9e;outline-offset:2px}
#placeShareDialog{max-height:90vh;overflow:auto}
#placeShareName{font-weight:bold;overflow-wrap:anywhere}
#placeShareHint,#placeShareStatus{font-size:13px;line-height:1.4}
#placeShareURL{box-sizing:border-box;width:100%;margin-top:12px}
@media(max-width:600px){.placeMapHead{flex-wrap:wrap}.placeMapHeadActions{flex-wrap:wrap;width:100%;gap:5px}.placeMapHeadActions button{min-height:40px}.placeMapHeadActions .closeBtn{margin-left:auto}}

/* Keep the existing action-column width: sharing occupies a second row.
   Continuation days retain their own share action when arrival is hidden. */
.leftShareActions{display:flex;justify-content:center;margin-top:3px}
.leftShareActions .placeShareButton{margin:0;padding:0;width:28px;min-width:28px;min-height:32px}

/* Local service icons: no third-party request when opening the menu. */
.placeShareChoices a,.placeShareChoices button{justify-content:flex-start;gap:12px;padding-left:16px}
.placeShareChoices img,.placeShareChoices svg{width:24px;height:24px;object-fit:contain;flex:0 0 24px}

/* Today's weather places are separate from the dated route table. */
.weatherPlacesPanel{margin:10px 0;padding:12px;border:1px solid #899ba7;border-radius:8px}
.weatherPlacesHead{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.weatherPlacesHead h2{font-size:17px;margin:0}.weatherPlacesPanel p{font-size:13px;line-height:1.4}
#weatherPlacesList{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:10px}
.weatherPlaceCard{border:1px solid #899ba7;border-radius:6px;padding:10px;min-width:0;overflow-wrap:anywhere}
.weatherPlaceCard h3{font-size:15px;margin:0}.weatherPlaceCard small{font-size:11px}
.weatherPlaceActions{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}.weatherPlaceActions button{min-height:36px;font-size:12px}
.suggestions button{display:block;text-align:left;width:100%;min-height:40px;white-space:normal}
#locationStatus:empty,#addLocationStatus:empty{display:none}
@media(max-width:600px){.weatherPlacesPanel{padding:8px}.weatherPlacesHead button{width:100%;min-height:40px}.addbar.compactOpen{max-height:calc(100dvh - var(--sticky-head-height) - 16px);overflow-y:auto}}