/* required styles */

.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
	}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
	}

.leaflet-container img.leaflet-tile {
	/* See: https://bugs.chromium.org/p/chromium/issues/detail?id=600120 */
	mix-blend-mode: plus-lighter;
}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

.leaflet-pane         { z-index: 400; }

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	z-index: 800;
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	z-index: 1000;
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
svg.leaflet-zoom-animated {
	will-change: transform;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline-offset: 1px;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.5;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(images/layers.png);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(images/layers-2x.png);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	font-size: 13px;
	font-size: 1.08333em;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
	background-image: url(images/marker-icon.png);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	line-height: 1.4;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
	text-decoration: underline;
	}
.leaflet-attribution-flag {
	display: inline !important;
	vertical-align: baseline !important;
	width: 1em;
	height: 0.6669em;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	white-space: nowrap;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	background: rgba(255, 255, 255, 0.8);
	text-shadow: 1px 1px #fff;
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 24px 13px 20px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
	}
.leaflet-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;
	pointer-events: auto;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
	color: #585858;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-interactive {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

/* Printing */

@media print {
	/* Prevent printers from removing background-images of controls. */
	.leaflet-control {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
		}
	}

*{box-sizing:border-box}html,body{margin:0;background:#151c28;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}body{overscroll-behavior:none}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #82dfff;outline-offset:4px}button{border:0;color:inherit;background:none;min-height:44px}#pages{height:100vh;height:100dvh;overflow-y:auto;scroll-snap-type:y mandatory;scroll-behavior:smooth}.screen{min-height:100vh;min-height:100dvh;scroll-snap-align:start;position:relative;padding:max(16px,env(safe-area-inset-top)) 28px max(12px,env(safe-area-inset-bottom));display:flex;flex-direction:column}.weather-screen{background:radial-gradient(ellipse at 5% 12%,#ffdf77a8,transparent 38%),radial-gradient(ellipse at 80% 28%,#fc8e2255,transparent 45%),linear-gradient(170deg,#b75b3d 0%,#ed9a3a 46%,#e9a345 66%,#685c65 83%,#172334 100%)}.weather-screen:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:repeating-linear-gradient(174deg,transparent 0,transparent 91px,#fff3 92px,transparent 94px,transparent 158px);opacity:.18}header{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1;height:46px;flex-shrink:0}.brand{font-size:12px;letter-spacing:5px;font-weight:650;opacity:.8}.icon-button{font-size:28px;min-width:44px;border-radius:12px}.icon-button:hover{background:#ffffff15}.weather-content{position:relative;width:100%;max-width:900px;margin:auto;display:flex;flex-direction:column;gap:14px}.clock{display:grid;grid-template-columns:1fr 1fr;gap:22px;width:76%;margin:20px auto 2px}.flip{position:relative;text-align:center;background:linear-gradient(#101f31 49.5%,#07121f 50%,#142136 51%,#101c2c);border:2px solid #593d30;border-radius:16px;box-shadow:0 6px 0 #0002,0 12px 22px #44220c30,inset 0 1px #ffffff2a;padding:4px 4px 16px}.flip:after{content:"";position:absolute;left:-7px;right:-7px;height:2px;background:#010914b3;top:48%;box-shadow:0 1px #80b9d633}.flip>span{display:block;font-size:clamp(95px,16vw,176px);font-weight:650;line-height:1.12;letter-spacing:-7px;color:#b0def1;text-shadow:0 2px 4px #0005;font-variant-numeric:tabular-nums}.flip small{display:block;font-size:10px;color:#9dc4dd;letter-spacing:.5px}.place-nav{display:flex;align-items:center;gap:10px}.place-nav>div{flex:1}.eyebrow{letter-spacing:2.5px;font-size:10px;font-weight:700;margin:0 0 6px;color:#ffedda}.place-nav h1{font-weight:500;font-size:clamp(24px,4vw,34px);margin:0}.panel{background:#35232d99;border:1px solid #ffdfac2e;border-radius:12px;box-shadow:0 5px 20px #321c2210}.current{min-height:112px;display:flex;position:relative;align-items:center;justify-content:space-between;padding:16px 22px;gap:12px}.current p{margin:5px 0;font-size:15px}.current .muted{font-size:12px;color:#c8e0ee}.hero-icon{position:absolute;left:45%;top:0;font-size:80px;filter:drop-shadow(0 5px 10px #36283855)}.temperature{font-size:64px;font-weight:300;line-height:1}.temperature sup{font-size:.6em}.daily{display:grid;grid-template-columns:repeat(5,1fr);overflow:hidden}.forecast-day{text-align:center;padding:12px 4px;border-right:1px solid #ffe5bb20}.forecast-day:last-child{border:0}.forecast-day .symbol{font-size:34px;display:block;line-height:1.3}.forecast-day small{font-size:10px;display:block;opacity:.75;margin:3px 0 8px}.forecast-day b{font-size:12px;display:block;font-weight:500}.forecast-day strong{font-size:17px}.low{color:#9bdaff;margin-left:10px}.hourly{display:flex;overflow-x:auto;padding:9px 3px;scrollbar-width:thin}.hour{min-width:12.5%;text-align:center;padding:0 5px}.hour>span{display:block;font-size:24px}.hour small{display:block;font-size:10px;opacity:.8}.hour strong{font-size:15px;color:#c2e9ff;display:block;margin-top:4px}.weather-bottom{margin-top:22px}.details{display:grid;grid-template-columns:1fr 1fr 1.1fr 1fr 1fr;align-items:center;min-height:80px;padding:12px 8px;text-align:center}.details small{font-size:8px;display:block;margin-bottom:10px;opacity:.8;letter-spacing:.6px}.details strong{font-size:16px;color:#a9dfff;font-weight:600}.wind span{display:block;font-size:25px;line-height:1;color:#bcecff}.wind strong{font-size:12px}.indoor-strip{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 5px;font-size:12px}.indoor-strip>span{letter-spacing:1px;font-size:9px}.status-dot{display:inline-block;background:#d2ad71;width:6px;height:6px;border-radius:50%;margin-right:5px}.status-dot.live{background:#a9efbe}#dots{display:flex;justify-content:center;gap:5px}#dots button{padding:8px;min-width:32px}#dots button:before{content:"";display:block;width:7px;height:7px;background:#fff4;border-radius:50%}#dots button.active:before{background:#b3e7ff;box-shadow:0 0 10px #9de8ff}.up-link{align-self:center;display:flex;flex-direction:column;align-items:center;font-size:24px;line-height:1}.up-link span{font-size:10px;opacity:.7;margin-top:4px}footer{display:flex;justify-content:space-between;gap:10px;font-size:8px;color:#ffffff80;margin-top:16px;position:relative}footer a{color:inherit;text-decoration:none}#weather-error{font-size:12px;color:#fff0c3}#weather-error:empty{display:none}.control-screen{background:radial-gradient(ellipse at 90% 0,#2a4752,transparent 60%),#14232d}.control-content{max-width:1000px;width:100%;margin:45px auto}.control-content h2{font-size:48px;font-weight:400;letter-spacing:-2px;margin:5px 0}.subtitle{color:#a5b8bd;font-size:15px}.control-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:32px}.control-card{padding:25px;border:1px solid #ffffff19;border-radius:20px;background:#ffffff06}.card-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.card-heading h3{font-size:18px;font-weight:500;margin:0}.pill{font-size:9px;color:#c4d2d6;background:#ffffff0c;border:1px solid #ffffff16;border-radius:20px;padding:7px 10px;white-space:nowrap}.climate{background:linear-gradient(130deg,#24444c,#23313c)}.climate-value{font-size:72px;font-weight:300;margin:30px 0}.climate-value small{font-size:28px;color:#a4cbd2}.small-values{display:flex;gap:30px}.small-values span{font-size:11px;color:#aac2c8}.small-values strong{display:block;font-size:22px;font-weight:400;color:#fff;margin-top:8px}.card-note{color:#a4b5bd;font-size:12px;line-height:1.65;margin:24px 0 0}.device-title{font-size:12px;color:#9fb2be;margin-top:24px}.solar-placeholder{display:flex;align-items:center;gap:24px;margin:26px 0}.solar-placeholder>span{font-size:48px;color:#f4c785}.solar-placeholder strong{font-weight:300;font-size:50px}.solar-placeholder small{font-size:20px;color:#b1c2c9}.switches{grid-column:1/-1}.empty-switch{display:flex;align-items:center;gap:20px;color:#b9c7cf;font-size:14px;margin-top:24px}.empty-switch>span{font-size:30px;color:#83a6b0}.gesture-note{font-size:11px;color:#9bb1ba;text-align:center;margin:35px 0}details{margin-top:20px;color:#bdd0d6;font-size:11px;line-height:1.7}summary{cursor:pointer;padding:8px 0}dialog{color:#e2edf0;background:#20323f;border:1px solid #5c727d;border-radius:20px;width:min(540px,92vw);padding:24px;max-height:85vh}dialog::backdrop{background:#09131dcc;backdrop-filter:blur(8px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center}.dialog-heading h2{font-size:25px;font-weight:400;margin:0}dialog p{font-size:12px;color:#afc6d0;line-height:1.6}.search-row{display:flex;gap:10px;margin:22px 0}.search-row input{min-width:0;flex:1;background:#142530;border:1px solid #566772;color:white;border-radius:10px;padding:12px}.search-row button{background:#b4e0ef;color:#172936;border-radius:10px;padding:10px 15px}#search-results button{display:block;text-align:left;width:100%;padding:12px;border-bottom:1px solid #ffffff15}#saved-places>div{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff15;padding:8px 0;font-size:13px}dialog>form>small{display:block;font-size:10px;color:#90a6b0;margin-top:20px}.remove{color:#e5b4a4;font-size:11px}@media(min-width:1000px){.weather-content{max-width:760px;gap:10px}.clock{width:60%;margin-top:8px}.flip>span{font-size:112px}.weather-bottom{margin-top:12px}.current{min-height:94px}.screen{padding-left:40px;padding-right:40px}}@media(max-width:600px){.screen{padding-left:14px;padding-right:14px}.weather-content{gap:10px}.clock{width:92%;gap:14px;margin-top:12px}.flip>span{font-size:22vw;letter-spacing:-4px}.flip small{font-size:8px}.hero-icon{font-size:52px;left:45%;top:20px}.current{min-height:100px;padding:12px}.current p{font-size:12px;max-width:150px}.current .muted{font-size:10px}.temperature{font-size:50px}.forecast-day strong{font-size:14px}.forecast-day .symbol{font-size:26px}.details{padding:10px 2px}.details small{font-size:6px;letter-spacing:0}.details strong{font-size:12px}.hour{min-width:16.66%}.control-grid{grid-template-columns:1fr}.switches{grid-column:auto}.control-content{margin-top:25px}.control-content h2{font-size:40px}.control-card{padding:20px}.weather-bottom{margin-top:12px}.indoor-strip{font-size:10px}footer{font-size:7px}}@media(prefers-reduced-motion:reduce){#pages{scroll-behavior:auto}}

.weather-screen[data-theme=day]{background:radial-gradient(ellipse at 12% 10%,#fff5bba8,transparent 43%),linear-gradient(170deg,#4b96bd,#75b4ca 45%,#d1bd91 75%,#244155)}.weather-screen[data-theme=dawn]{background:radial-gradient(ellipse at 10% 45%,#ffe6a4a0,transparent 50%),linear-gradient(170deg,#676e9c,#d69a98 35%,#f4bc7b 65%,#353b5a)}.weather-screen[data-theme=dusk]{background:radial-gradient(ellipse at 8% 30%,#ffe18190,transparent 40%),linear-gradient(170deg,#a55256,#e88838 45%,#ab714b 70%,#172334)}.weather-screen[data-theme=night]{background:radial-gradient(ellipse at 85% 12%,#63769955,transparent 35%),linear-gradient(165deg,#111c36,#243b59 55%,#182636 85%,#101c2b)}.weather-screen[data-theme=night] .panel{background:#101e35b0;border-color:#c1dcff20}.weather-screen[data-theme=night] .flip{border-color:#435771}.weather-screen[data-theme=night]:before{opacity:.07}


.scenery{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;opacity:.8}.landscape{width:100%;height:100%;display:block}.scenery .stars,.scenery .lightning,.scenery .rain-layer,.scenery .snow-layer{display:none}.scenery .cloud-bank{opacity:.2}.weather-screen[data-theme=night] .stars{display:block}.weather-screen[data-theme=night] .sun-disc{r:45;fill:#d3e2ef}.weather-screen[data-theme=night] .sun-halo{opacity:.07}.weather-screen[data-weather=clouds] .cloud-bank,.weather-screen[data-weather=rain] .cloud-bank,.weather-screen[data-weather=storm] .cloud-bank,.weather-screen[data-weather=snow] .cloud-bank,.weather-screen[data-weather=fog] .cloud-bank{opacity:1}.weather-screen[data-weather=rain] .sun-disc,.weather-screen[data-weather=storm] .sun-disc,.weather-screen[data-weather=snow] .sun-disc{opacity:.12}.weather-screen[data-weather=rain] .rain-layer,.weather-screen[data-weather=storm] .rain-layer,.weather-screen[data-weather=storm] .lightning,.weather-screen[data-weather=snow] .snow-layer{display:block}.weather-screen[data-weather=rain] .scenery,.weather-screen[data-weather=storm] .scenery{background:#22354e45}.weather-screen[data-weather=fog] .scenery{filter:blur(8px);background:#b6c8cf44}.weather-screen[data-weather=snow] .scenery{background:#b9d6e024}


.place-actions{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}.add-place{font-size:17px;border:1px solid #ffffff55;border-radius:12px;padding:8px 18px;background:#17263866;min-height:50px}.icon-button{min-width:54px;min-height:54px}.up-link{min-height:60px}.up-link span{font-size:15px;line-height:1.5}.indoor-strip{font-size:16px}.indoor-strip>span{font-size:12px}.forecast-day b{font-size:15px}.forecast-day small{font-size:13px}.hour small{font-size:14px}.details small{font-size:10px}.current .muted{font-size:15px}.dialog-heading h2{font-size:28px}dialog{width:min(650px,94vw);padding:26px}dialog p{font-size:18px;line-height:1.55}.search-row{gap:12px}.search-row input{font-size:20px;padding:15px}.search-row button{font-size:19px;min-height:56px;padding:12px 20px}#search-results button{font-size:19px;min-height:64px;line-height:1.45;border:1px solid #ffffff30;border-radius:12px;margin:10px 0;padding:16px;background:#ffffff08}#saved-places>div{font-size:19px;gap:20px}#saved-places>div>button:first-child{text-align:left;flex:1;min-height:56px;font-size:19px}.remove{font-size:15px;min-height:52px}dialog>form>small{font-size:14px}.saved-title{font-size:18px;font-weight:500;margin:28px 0 8px}.pill{font-size:12px}.card-note{font-size:16px}.small-values span{font-size:15px}.gesture-note{font-size:16px}details{font-size:16px}summary{min-height:48px}@media(max-width:600px){.search-row{flex-direction:column}.search-row input{width:100%}.up-link span{font-size:13px}.indoor-strip{font-size:13px}.indoor-strip>span{font-size:10px}.details small{font-size:8px}.forecast-day b{font-size:12px}.forecast-day small{font-size:11px}.pill{font-size:10px}.card-heading{align-items:flex-start;flex-wrap:wrap}}


.sensor-choice{display:block;font-size:16px;color:#bfd5da;margin-top:24px}.sensor-choice select{display:block;width:100%;margin-top:10px;font-size:18px;min-height:54px;border:1px solid #66828d;background:#1b303d;color:white;border-radius:10px;padding:12px}


.weather-screen{background-image:linear-gradient(#101d3926,#101a3426 65%,#0c192ad9),var(--weather-photo);background-size:cover;background-position:center;background-color:#324b66}.weather-screen[data-theme]{background-image:linear-gradient(#101d3926,#101a3426 65%,#0c192ad9),var(--weather-photo);background-size:cover;background-position:center}.weather-screen:before,.weather-screen .scenery{display:none}.weather-screen .panel{background:#102033bd;border:1px solid #ffffff35;backdrop-filter:blur(5px)}.place-nav h1,.place-nav .eyebrow{filter:drop-shadow(0 2px 4px #000b)}.weather-screen[data-theme=night]{background-color:#101b2d}.weather-screen[data-theme=dawn]{background-color:#a77b76}.weather-screen[data-theme=dusk]{background-color:#be7a4c}.weather-screen .current p{font-size:18px}.weather-screen .temperature{font-weight:400} .weather-content{gap:10px}.clock{margin-top:12px}.flip>span{font-size:min(16vw,16vh)}.weather-bottom{margin-top:12px}@media(max-width:600px){.flip>span{font-size:min(22vw,16vh)}.weather-screen .current p{font-size:14px}.current .muted{font-size:12px}}


.weather-symbol{display:inline-block;width:62px;height:62px;filter:drop-shadow(0 4px 3px #0006);vertical-align:middle}.weather-symbol svg{display:block;width:100%;height:100%;overflow:visible}.hero-icon{left:43%;top:-22px;width:140px;height:140px;z-index:1;pointer-events:none}.hero-icon .weather-symbol{width:140px;height:140px;filter:drop-shadow(0 6px 8px #08192b70)}.forecast-day .symbol{width:66px;height:66px;margin:0 auto;line-height:1}.forecast-description{display:block;font-size:12px;line-height:1.2;min-height:29px;margin:2px 0 8px;color:#edf4fa}.hour .weather-symbol{width:44px;height:44px}.forecast-day{padding:8px 3px 10px;background:linear-gradient(#ffffff0c,#00000008)}.forecast-day b{font-size:12px}.forecast-day small{margin:2px 0 8px}.forecast-day>div{border-top:1px solid #dce6ff1f;padding-top:7px}.forecast-day strong{display:inline;font-size:21px}.forecast-day .low{margin-left:12px;color:#7bc8fa}.flip{border-radius:12px;border:2px solid #826d5e;box-shadow:0 0 0 2px #0e1b2e99,0 8px 22px #0006,inset 0 1px 2px #ffffff55;background:linear-gradient(180deg,#14263c,#071221 48%,#23364c 50%,#081627 53%,#14243b)}.flip>span{font-weight:650;color:#b7e6fa;text-shadow:0 1px #f0fbff,0 3px 2px #0004,0 0 24px #64beff20;line-height:1.15}.flip:before{content:'';position:absolute;top:44%;left:-8px;right:-8px;height:13%;border-left:5px solid #07121d;border-right:5px solid #07121d;pointer-events:none}.flip:after{height:3px;box-shadow:0 1px #c6efff44}.weather-screen .panel{border-radius:9px;border:1px solid #ffffff4d;background:linear-gradient(#18283c9c,#061a2ac4);box-shadow:inset 0 1px #ffffff16,0 4px 14px #0002}.place-nav h1{font-size:36px;font-weight:500;letter-spacing:-.8px}.place-nav .eyebrow{font-size:11px;letter-spacing:1.5px}.current{min-height:95px;padding-top:22px;padding-bottom:15px}.current .temperature{font-size:70px;color:#cff0ff;text-shadow:0 2px 5px #0004}.weather-screen .current p{color:#c6efff;font-size:20px;font-weight:500}.weather-screen .current .muted{font-size:14px;color:#e7f5ff}.details strong{color:#8dd5ff}.details{background:#121f33cf!important;box-shadow:inset 0 1px #ffffff30}.brand{letter-spacing:4px}.hourly{padding-top:5px;padding-bottom:7px}.up-link span{background:#0c1d2e80;border-radius:20px;padding:7px 15px}.weather-screen .indoor-strip{border-radius:9px;padding:12px;background:#0d1c2d99;margin-top:10px}footer{font-size:9px}@media(max-width:600px){.hero-icon{left:40%;width:90px;height:90px;top:-6px}.hero-icon .weather-symbol{width:90px;height:90px}.forecast-day .symbol{width:49px;height:49px}.forecast-day b{font-size:9px}.forecast-description{font-size:10px;min-height:25px}.forecast-day strong{font-size:16px}.hour .weather-symbol{width:36px;height:36px}.place-nav h1{font-size:28px}.current .temperature{font-size:58px}.weather-screen .current p{font-size:16px}.weather-screen .current .muted{font-size:12px}}


[hidden]{display:none!important}.header-actions{display:flex;align-items:center;gap:4px}.header-label{display:inline-flex;align-items:center;justify-content:center;min-height:54px;min-width:54px;color:white;text-decoration:none;padding:8px 13px;font-size:16px;border-radius:10px;background:#11233775;text-shadow:0 1px 3px #0005}.header-label:hover{background:#213b50}.settings-screen{background:#162a38;scroll-snap-align:start}.settings-content{max-width:1100px;width:100%;margin:32px auto 60px}.settings-content>h2{font-size:42px;font-weight:400;margin:8px 0}.settings-intro,.settings-info{font-size:18px;color:#bfd1da;line-height:1.6}.settings-card{background:#203746;border:1px solid #627b8a55;border-radius:18px;padding:28px;margin:24px 0}.settings-card h3{font-size:25px;font-weight:500;margin:0 0 12px}.settings-card>p{font-size:17px;line-height:1.55;color:#c4d7e0}.settings-card label{display:block;font-size:18px;margin:22px 0 0;color:#edf7ff}.settings-card input,.settings-card select{display:block;width:100%;font-size:19px;min-height:56px;border:1px solid #7992a0;border-radius:10px;margin-top:10px;padding:14px;background:#122936;color:white}.settings-card input:focus,.settings-card select:focus{outline:3px solid #9ee1fb;outline-offset:2px}.settings-card input::placeholder{font-size:15px;color:#9eb6c4}.primary-button,.secondary-button{min-height:56px;border-radius:12px;font-size:18px;padding:14px 22px}.primary-button{background:#bce8f8;color:#122b39;font-weight:600}.secondary-button{border:1px solid #83a4b7;background:#142c3b}.settings-buttons{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}.connection-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.connection-grid>.settings-card{margin:0}.connection-result{min-height:28px;line-height:1.6;color:#d5f5ff!important}.settings-footnote{font-size:14px!important}.advanced-connection{margin-top:25px}.advanced-connection summary{font-size:17px}.advanced-connection p{font-size:16px;line-height:1.6;color:#bad1dc}#settings-message:not(:empty){font-size:18px;background:#40576a;border:1px solid #8aa9bc;border-radius:12px;padding:16px;line-height:1.6;margin:20px 0}button:disabled{opacity:.55;cursor:wait}#unlock-form{max-width:580px}#unlock-submit{margin-top:26px}@media(max-width:800px){.connection-grid{grid-template-columns:1fr}.header-label{font-size:14px;padding:8px}.settings-card{padding:22px}.brand{letter-spacing:2px;font-size:10px}}@media(max-width:500px){.weather-screen .brand{display:none}.settings-content>h2{font-size:34px}}

/* Tageszeitfarben: lokale Sonnenzeiten des ausgewählten Wetterorts. */
.weather-screen{--reading:#d8f1ff;--accent:#8dd5ff;--secondary:#e7f5ff;--tile:linear-gradient(#18283cbb,#061a2add);--tile-border:#ffffff4d;--clock-face:linear-gradient(180deg,#14263c,#071221 48%,#23364c 50%,#081627 53%,#14243b);--clock-digit:#b7e6fa;--clock-small:#b4d8eb;--clock-edge:#435771;--bar:#0d1c2dcc;--on-photo:#fff;--navigation:#102033ba;--photo-overlay:linear-gradient(#101d3926,#101a3426 65%,#0c192ad9)}
.weather-screen[data-theme=day]{--reading:#352816;--accent:#704307;--secondary:#55442d;--tile:linear-gradient(#fff9e9ed,#f1e5d0e8);--tile-border:#fff9e8bd;--clock-face:linear-gradient(180deg,#65503b,#392b1c 48%,#8a7155 50%,#3a2d20 53%,#5a4530);--clock-digit:#fff0c4;--clock-small:#f4dfb4;--clock-edge:#bfa179;--bar:#fff6e7e8;--on-photo:#fff9ee;--navigation:#493722d9;--photo-overlay:linear-gradient(#452d1414,#452d1408 65%,#2a201888)}
.weather-screen[data-theme=dawn]{--reading:#fff1ed;--accent:#ffd0bc;--secondary:#fbe4e4;--tile:linear-gradient(#563d50e8,#352536eb);--tile-border:#f8d4d870;--clock-face:linear-gradient(180deg,#63495b,#342936 48%,#785a6a 50%,#382c39 53%,#51394e);--clock-digit:#ffe0d3;--clock-small:#f6cdd0;--clock-edge:#b18a9d;--bar:#3f2e43e6;--on-photo:#fff3ed;--navigation:#443044cf;--photo-overlay:linear-gradient(#46304d18,#46284420 65%,#35263abd)}
.weather-screen[data-theme=dusk]{--reading:#fff2d9;--accent:#ffce87;--secondary:#ffe6bd;--tile:linear-gradient(#5b3829eb,#36231feb);--tile-border:#ffd7a66b;--clock-face:linear-gradient(180deg,#65402f,#34221c 48%,#8b5939 50%,#3c261c 53%,#523222);--clock-digit:#ffdc9b;--clock-small:#f8d5a4;--clock-edge:#ba895b;--bar:#3a251ee6;--on-photo:#fff2d9;--navigation:#4b2f20db;--photo-overlay:linear-gradient(#572a1318,#51271020 65%,#301d18c7)}
.weather-screen[data-theme]{background-image:var(--photo-overlay),var(--weather-photo);color:var(--on-photo)}
.weather-screen .flip{background:var(--clock-face);border-color:var(--clock-edge)}
.weather-screen .flip>span{color:var(--clock-digit);text-shadow:0 1px #ffffff50,0 3px 3px #0006}
.weather-screen .flip small{color:var(--clock-small)}
.weather-screen .panel,.weather-screen[data-theme=night] .panel{background:var(--tile);border-color:var(--tile-border);color:var(--reading)}
.weather-screen .current .temperature,.weather-screen .current p{color:var(--reading);text-shadow:none}
.weather-screen .current .muted,.weather-screen .forecast-description{color:var(--secondary)}
.weather-screen .forecast-day .low,.weather-screen .hour strong,.weather-screen .details strong,.weather-screen .wind span{color:var(--accent)}
.weather-screen .details{background:var(--tile)!important}
.weather-screen .forecast-day{border-color:var(--tile-border);background:linear-gradient(#ffffff0c,#00000006)}
.weather-screen .forecast-day>div{border-color:var(--tile-border)}
.weather-screen .indoor-strip,.weather-screen .up-link span{background:var(--bar);color:var(--reading)}
.weather-screen .place-nav .eyebrow{color:var(--on-photo)}
.weather-screen header .header-label,.weather-screen header .icon-button,.weather-screen .place-nav>.icon-button,.weather-screen .add-place{background:var(--navigation);color:var(--on-photo);border-radius:12px}
.weather-screen footer{color:var(--on-photo);text-shadow:0 1px 3px #000}
.weather-screen #dots button.active:before{background:var(--clock-digit);box-shadow:0 0 8px var(--clock-digit)}
.weather-screen[data-theme=day] .weather-symbol{filter:drop-shadow(0 3px 3px #49362044) saturate(.8)}
/* Plastische Wettertafel nach der iPad-Referenz. */
.weather-art{background-image:url('/weather-atlas.png');background-size:300% 300%;background-repeat:no-repeat}
.weather-screen .clock{width:82%;gap:24px;margin:18px auto 18px;max-width:720px;filter:drop-shadow(0 12px 15px #0005)}
.weather-screen .flip{border:2px solid var(--clock-edge);padding:10px 8px 16px;border-radius:16px;box-shadow:0 0 0 3px #0a0b0e66,0 5px 0 #0006,0 14px 28px #0005,inset 0 2px 2px #ffffff66,inset 0 -3px 5px #0008;background:linear-gradient(#ffffff16,transparent 35%,#00000015 48%,#00000066 49.5%,#ffffff12 51%,transparent 57%),var(--clock-face)}
.weather-screen .flip>span{font-size:clamp(112px,min(24vw,20vh),220px);font-weight:650;letter-spacing:-9px;line-height:1.08;text-shadow:0 1px #ffffff77,0 4px 3px #0008,0 0 30px #ffffff13}
.weather-screen .flip small{font-size:11px;letter-spacing:.7px;margin-top:9px;min-height:16px}
.weather-screen .flip:after{height:3px;top:46%;background:#03080cd9;box-shadow:0 1px 1px #ffffff66,0 3px 4px #0006}
.weather-screen .flip:before{top:41%;height:14%;border-left-width:6px;border-right-width:6px;left:-9px;right:-9px;filter:drop-shadow(1px 2px 1px #0008)}
.weather-screen .place-nav{padding:0 3px;margin:0 0 4px}
.weather-screen .place-nav h1{font-size:clamp(28px,4.7vw,42px);font-weight:550;text-shadow:0 2px 4px #0008}
.weather-screen .panel{border:1px solid var(--tile-border);box-shadow:0 1px 0 #ffffff55,inset 0 1px 0 #ffffff66,inset 0 -1px 0 #0006,0 8px 18px #0004;backdrop-filter:blur(9px);border-radius:12px}
.weather-screen .current{min-height:128px;padding:22px 24px;background:linear-gradient(180deg,#ffffff18 0%,#ffffff06 38%,#00000008 75%,#0000000b 100%),var(--tile)}
.weather-screen .hero-icon{left:calc(50% - 105px);top:-42px;width:210px;height:210px}
.weather-screen .hero-icon .weather-symbol{width:210px;height:210px;filter:drop-shadow(0 10px 9px #0006)}
.weather-screen .current .temperature{font-size:80px;letter-spacing:-3px;font-weight:350}
.weather-screen .current p{font-size:21px;font-weight:550;max-width:200px}
.weather-screen .current .muted{font-size:15px;font-weight:400}
.weather-screen .daily{margin-top:12px}
.weather-screen .forecast-day{padding:11px 3px 12px;background:linear-gradient(180deg,#ffffff12 0%,#ffffff04 38%,#00000008 75%,#0000000b 100%);border-right:1px solid var(--tile-border)}
.weather-screen .forecast-day .symbol{width:86px;height:86px;margin:0 auto -1px;filter:drop-shadow(0 4px 3px #0004)}
.weather-screen .forecast-description{font-size:12px;min-height:31px;line-height:1.3;margin:0 0 8px}
.weather-screen .forecast-day b{font-size:12px;letter-spacing:.2px;font-weight:650}
.weather-screen .forecast-day small{font-size:12px}
.weather-screen .forecast-day strong{font-size:23px;text-shadow:0 1px 1px #0002}
.weather-screen .hourly{padding:8px 3px 11px;margin-top:3px;background:linear-gradient(#ffffff10,transparent),var(--tile)}
.weather-screen .hour .weather-symbol{width:58px;height:58px;margin-bottom:1px}
.weather-screen .hour small{font-size:13px;opacity:.95}.weather-screen .hour strong{font-size:17px}
.weather-screen .details{min-height:84px;background:linear-gradient(180deg,#ffffff14 0%,#ffffff04 38%,#00000009 75%,#0000000d 100%),var(--tile)!important}
.weather-screen .details strong{font-size:18px}.weather-screen .details small{font-size:10px;opacity:1}
.weather-screen .wind span{font-size:32px;filter:drop-shadow(0 2px 2px #0005)}
.weather-screen header .header-label,.weather-screen header .icon-button{box-shadow:inset 0 1px #ffffff20,0 3px 8px #0002}
@media(max-width:600px){.weather-screen .clock{width:90%;gap:17px;margin-top:14px;margin-bottom:16px}.weather-screen .flip>span{font-size:clamp(84px,24vw,145px);letter-spacing:-6px}.weather-screen .flip small{font-size:8px;letter-spacing:.2px}.weather-screen .current{min-height:110px;padding:18px 15px}.weather-screen .hero-icon{left:calc(50% - 72px);width:144px;height:144px;top:-23px}.weather-screen .hero-icon .weather-symbol{width:144px;height:144px}.weather-screen .current .temperature{font-size:61px}.weather-screen .current p{font-size:16px;max-width:125px}.weather-screen .current .muted{font-size:12px}.weather-screen .forecast-day .symbol{width:60px;height:60px}.weather-screen .forecast-day b{font-size:9px}.weather-screen .forecast-day strong{font-size:17px}.weather-screen .forecast-description{font-size:10px;min-height:27px}.weather-screen .hour .weather-symbol{width:43px;height:43px}.weather-screen .details strong{font-size:13px}.weather-screen .details small{font-size:7px}}
.settings-card a{color:#c4eaff;text-underline-offset:3px}
.weather-chrome{transition:opacity .6s ease,visibility .6s ease}
.weather-screen.controls-hidden .weather-chrome{opacity:0;visibility:hidden;pointer-events:none}
#fullscreen-help h2{font-weight:500;font-size:28px}#fullscreen-help p{font-size:19px;line-height:1.6}#fullscreen-help button{width:100%;margin-top:10px}
@media(prefers-reduced-motion:reduce){.weather-chrome{transition:none}}
@media(display-mode:standalone),(display-mode:fullscreen){#fullscreen{display:none}}
.solar-card{grid-column:1/-1}.anker-systems{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:24px}.anker-bank{background:linear-gradient(135deg,#2b4855,#1a303e);border:1px solid #ffffff26;border-radius:16px;padding:22px;box-shadow:inset 0 1px #ffffff17,0 5px 14px #0002}.anker-bank h4{font-size:22px;font-weight:550;margin:0 0 8px;color:#f4dfb1}.anker-site{font-size:14px;color:#b7cbd4;margin:0 0 24px;line-height:1.5}.anker-values{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.anker-values span{display:block;font-size:13px;color:#b3c8d1}.anker-values strong{display:block;margin-top:10px;font-size:27px;font-weight:450;color:#fff}.anker-battery-bar{height:8px;background:#ffffff13;border-radius:6px;overflow:hidden;margin-top:24px}.anker-battery-bar span{display:block;height:100%;background:linear-gradient(90deg,#89c9cb,#dfedb8);border-radius:6px}.anker-time{font-size:12px;line-height:1.7;color:#b4c7cf;margin:18px 0 0}@media(max-width:650px){.anker-systems{grid-template-columns:1fr}.anker-bank{padding:20px}.anker-values strong{font-size:26px}}
/* Analoger Windkompass und veredelte Messwertleiste. Die Nadel zeigt die Herkunft. */
.weather-screen .weather-bottom{margin-top:28px}
.weather-screen .details{grid-template-columns:1fr 1fr 1.25fr 1fr 1fr;min-height:118px;padding:14px 10px 12px;overflow:visible;border-radius:14px;background:linear-gradient(180deg,#ffffff14 0%,#ffffff04 38%,#00000009 75%,#0000000d 100%),var(--tile)!important;box-shadow:inset 0 1px 1px #ffffff88,inset 0 -2px 2px #0005,0 7px 18px #0004}
.weather-screen .details>div:not(.wind){position:relative;padding:12px 6px;border-right:1px solid var(--tile-border)}
.weather-screen .details>div:last-child{border:0}.weather-screen .details small{font-size:10px;letter-spacing:.8px;font-weight:600;line-height:1.4;margin-bottom:10px;color:var(--secondary)}
.weather-screen .details strong{font-size:21px;font-weight:550;letter-spacing:-.3px;text-shadow:0 1px 1px #0002}
.weather-screen .wind{position:relative;display:flex;flex-direction:column;align-items:center;padding:0 5px;min-width:0;z-index:2}
.weather-screen .wind-compass{position:relative;width:100px;height:100px;margin:-38px auto 7px;border-radius:50%;background:radial-gradient(circle at 35% 25%,#ffffff30,transparent 52%),var(--clock-face);border:3px solid var(--clock-edge);box-shadow:0 0 0 2px #121719b3,0 5px 10px #0007,inset 0 0 0 2px #ffffff25,inset 0 -7px 12px #0008;color:var(--clock-digit)}
.weather-screen .compass-dial{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:visible}.weather-screen .compass-dial circle{fill:none;stroke:currentColor;stroke-width:.5;opacity:.5}.weather-screen .compass-ticks{fill:none;stroke:currentColor;stroke-width:1;opacity:.55}
.weather-screen .wind-compass b{position:absolute;font-size:10px;line-height:1;color:var(--clock-digit);text-shadow:0 1px 2px #000;font-weight:650}
.compass-n{top:12px;left:50%;transform:translateX(-50%)}.compass-e{right:12px;top:50%;transform:translateY(-50%)}.compass-s{bottom:11px;left:50%;transform:translateX(-50%)}.compass-w{left:11px;top:50%;transform:translateY(-50%)}
.weather-screen .wind .compass-pointer{position:absolute;display:block;top:50%;left:50%;width:35px;height:47px;margin:-23.5px 0 0 -17.5px;line-height:0;color:var(--clock-digit);transform-origin:50% 50%;filter:drop-shadow(1px 3px 2px #0009);transition:transform 1s ease;z-index:1}
.compass-pointer svg{display:block;width:100%;height:100%}.compass-pivot{position:absolute;top:50%;left:50%;width:6px;height:6px;border-radius:50%;margin:-3px;background:#e8e5da;box-shadow:0 1px 2px #000b;z-index:2}
.weather-screen .wind strong{display:block;font-size:22px;line-height:1.2;color:var(--accent)}.weather-screen .wind>small{font-size:12px;letter-spacing:0;font-weight:400;line-height:1.3;margin:5px 0 0;color:var(--secondary)}
@media(max-width:600px){.weather-screen .details{padding:12px 3px 9px;min-height:109px;grid-template-columns:1fr 1fr 1.25fr 1fr 1fr}.weather-screen .details>div:not(.wind){padding:10px 2px}.weather-screen .details small{font-size:7px;letter-spacing:.15px}.weather-screen .details strong{font-size:13px;letter-spacing:-.4px}.weather-screen .wind-compass{width:78px;height:78px;margin-top:-27px;border-width:2px}.weather-screen .wind strong{font-size:15px;letter-spacing:-.3px}.weather-screen .wind>small{font-size:9px;max-width:85px}.weather-screen .wind-compass b{font-size:8px}.compass-n{top:9px}.compass-e{right:8px}.compass-s{bottom:8px}.compass-w{left:8px}.weather-screen .wind .compass-pointer{width:27px;height:36px;margin:-18px 0 0 -13.5px}}
@media(prefers-reduced-motion:reduce){.weather-screen .wind .compass-pointer{transition:none}}

/* Anschauliche Energieflüsse je Solarbank */
.anker-bank{padding:26px 22px;background:radial-gradient(ellipse at 50% 25%,#315965 0%,#192e3b 75%);border-radius:22px;box-shadow:inset 0 1px 0 #ffffff25,0 14px 30px #0003}.anker-bank h4{font-size:24px;letter-spacing:-.5px}.anker-site{margin-bottom:28px}.energy-flow{display:grid;grid-template-columns:1fr 30px 1fr 30px 1fr;align-items:center;gap:3px;margin:12px 0 26px}.energy-end,.energy-storage{text-align:center;min-width:0}.energy-end svg{display:block;width:62px;height:62px;margin:0 auto 16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 4px 6px #0004)}.solar-end{color:#f5cc78}.output-end{color:#8bd8df}.energy-end strong{display:block;font-size:28px;font-weight:550;white-space:nowrap}.energy-end span,.energy-storage>span{display:block;font-size:12px;line-height:1.4;color:#d5e1e5;margin-top:9px}.battery-shell{position:relative;width:88px;height:118px;border:2px solid #b6d2d4;border-radius:14px;margin:0 auto 12px;background:linear-gradient(110deg,#ffffff14,#0002);box-shadow:inset 0 0 18px #0005,0 8px 15px #0003;isolation:isolate}.battery-shell:before{content:'';position:absolute;width:30px;height:6px;top:-8px;left:27px;border-radius:4px 4px 0 0;background:#a7c9ca}.battery-fill{position:absolute;bottom:3px;left:3px;right:3px;border-radius:9px;background:linear-gradient(90deg,#51a7a2,#9ad9b9);box-shadow:0 -1px 8px #99eccb77;transition:height 1s;z-index:-1;max-height:calc(100% - 6px)}.battery-shell strong{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;font-size:26px;color:#fff;text-shadow:0 2px 5px #000}.energy-link{height:3px;background:#ffffff21;position:relative;margin-top:-32px}.energy-link:after{content:'';position:absolute;right:-1px;top:-4px;border-left:6px solid #ffffff50;border-top:5px solid transparent;border-bottom:5px solid transparent}.energy-link.flowing{background:#7fdfbf77}.energy-link.flowing:before{content:'';position:absolute;top:-2px;width:7px;height:7px;border-radius:50%;background:#c3ffdc;box-shadow:0 0 9px #adffdb;animation:energy-travel 1.8s linear infinite}.energy-activity{display:flex;justify-content:center;align-items:center;gap:9px;padding:13px 8px;background:#0d202c77;border:1px solid #ffffff12;border-radius:12px;font-size:14px;color:#d9e6e7;text-align:center;min-height:44px;margin:0}.energy-activity i{width:8px;height:8px;background:#91a3ad;border-radius:50%;flex:none}.energy-activity i.active{background:#a0e5be;box-shadow:0 0 10px #a0e5be88}.anker-time{font-size:11px;color:#9db8c3}.solar-card>h3{font-size:28px}@keyframes energy-travel{from{left:0;opacity:0}20%{opacity:1}80%{opacity:1}to{left:90%;opacity:0}}@media(prefers-reduced-motion:reduce){.energy-link.flowing:before{animation:none;left:45%}}@media(max-width:950px){.anker-systems{grid-template-columns:1fr}}@media(max-width:420px){.anker-bank{padding:22px 12px}.energy-flow{grid-template-columns:1fr 18px 1fr 18px 1fr}.energy-end strong{font-size:24px}.energy-end svg{width:52px;height:52px}.battery-shell{width:76px;height:108px}.battery-shell:before{left:21px}.energy-end span{font-size:11px}}

.solar-glance{flex:0 1 285px;text-align:left;padding:10px 12px!important;line-height:1.35;border:1px solid var(--panel-edge,#ffffff40);border-radius:12px;background:var(--panel-face,#102236d9);color:var(--ink,#d7efff);box-shadow:inset 0 1px #ffffff20,0 4px 14px #0002;z-index:2}.solar-glance strong,.solar-glance span,.solar-glance small{display:block}.solar-glance strong{font-size:21px;font-weight:650;color:var(--reading,#f5d697)}.solar-glance span{font-size:11px;margin-top:3px}.solar-glance small{font-size:11px;opacity:.9;margin-top:4px}.place-nav>div{min-width:0}.place-nav h1{overflow-wrap:anywhere}.split-flow{position:relative;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:125px 155px;gap:10px 0;padding:8px 0 0}.split-flow>.solar-end{grid-area:1/1;align-self:center}.split-flow>.output-end{grid-area:1/3;align-self:center}.split-flow>.energy-storage{grid-area:2/2;align-self:center;z-index:1}.split-flow .energy-end svg{width:48px;height:48px;margin-bottom:5px}.split-flow .energy-end strong{font-size:25px}.flow-meter{text-align:center;align-self:center;z-index:1;background:#1c3642e8;border:1px solid #ffffff15;border-radius:10px;padding:9px 3px;margin:0 6px}.flow-meter strong{display:block;font-size:22px;color:#dff3ef}.flow-meter span{display:block;font-size:11px;color:#c2d7dc;margin-top:4px}.flow-direct{grid-area:1/2}.flow-charge{grid-area:2/1}.flow-discharge{grid-area:2/3}.flow-direct strong{color:#f5cc78}.flow-paths{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.flow-paths svg{width:100%;height:100%;overflow:visible}.flow-paths path{stroke:#b7d7d83d;stroke-width:2;vector-effect:non-scaling-stroke;fill:none}.flow-paths path.flowing{stroke:#a9e9c9;stroke-dasharray:5 5;animation:flow-dash 1s linear infinite}.flow-explanation{font-size:11px;line-height:1.5;color:#a7c0c9;margin:-14px 0 16px}.energy-history{margin-top:24px;border-top:1px solid #ffffff25;padding-top:20px}.energy-history h5{font-size:18px;font-weight:500;margin:0;color:#e8eef0}.energy-today{font-size:35px;color:#f5d18a;margin:10px 0 2px}.energy-date{color:#abc4cd;font-size:12px}.energy-chart{height:140px;margin-top:20px}.energy-chart svg{width:100%;height:100%}.chart-hours{display:flex;white-space:pre;font-size:9px;color:#a9c0c8;overflow:hidden;text-align:center}.chart-caption{font-size:11px;color:#a8bfc6;line-height:1.5}.energy-shares{display:flex;justify-content:space-between;gap:10px;padding:15px 0;color:#d4e7e9;font-size:12px}.energy-lifetime{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border-top:1px solid #ffffff15;padding-top:15px}.energy-lifetime span{display:block;font-size:10px;line-height:1.5;color:#b6cbd2}.energy-lifetime strong{display:block;font-size:17px;margin-top:6px;font-weight:500;color:#f1e1bd}@keyframes flow-dash{to{stroke-dashoffset:-20}}@media(prefers-reduced-motion:reduce){.flow-paths path.flowing{animation:none}}@media(max-width:600px){.solar-glance{flex-basis:215px;padding:7px 9px!important}.solar-glance strong{font-size:17px}.solar-glance span,.solar-glance small{font-size:9px}.place-nav{gap:5px}.place-nav h1{font-size:24px!important}.place-nav .eyebrow{font-size:8px!important;letter-spacing:.5px}.place-nav>.icon-button{min-width:28px}.split-flow .energy-end strong{font-size:22px}.flow-meter strong{font-size:20px}}@media(max-width:390px){.solar-glance{flex-basis:175px}.solar-glance span{font-size:8px}.place-nav h1{font-size:20px!important}.place-nav .eyebrow{display:none}.flow-meter{margin:0 2px}}

.anker-summary{margin-top:22px;padding:22px;border:1px solid #d1dfb843;border-radius:16px;background:linear-gradient(110deg,#315554,#213849)}.anker-summary h4{margin:0 0 18px;font-size:20px;color:#f4dfb1}.combined-values{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.combined-values span{display:block;font-size:12px;line-height:1.5;color:#c1d6db}.combined-values strong{display:block;font-size:29px;white-space:nowrap;color:#f5e6bf;margin-top:8px;font-weight:550}.anker-summary p{font-size:11px;line-height:1.5;color:#b3cbd0;margin:18px 0 0}@media(max-width:600px){.combined-values{grid-template-columns:repeat(2,1fr)}.combined-values strong{font-size:26px}.solar-glance strong{font-size:15px}}

.combined-values{grid-template-columns:repeat(3,minmax(0,1fr))}.combined-values strong{font-size:26px}@media(max-width:600px){.combined-values{grid-template-columns:repeat(2,minmax(0,1fr))}.combined-values strong{font-size:24px}}

.chart-hours{display:flex;justify-content:space-between;white-space:normal;font-variant-numeric:tabular-nums}

/* Gut ablesbare gemeinsame Solarleistung */
.place-nav{display:grid;grid-template-columns:44px minmax(0,1fr) minmax(310px,1.15fr) 44px;gap:12px;align-items:center}.solar-glance{width:100%;padding:16px 20px!important;min-height:160px;border-radius:16px;border-color:#b5dced80;background:var(--panel-face,#102236ed)}.solar-glance strong{font-size:52px!important;line-height:1.05;letter-spacing:-1px}.solar-glance .solar-watts{font-weight:700;font-variant-numeric:tabular-nums;display:block}.solar-glance strong .solar-destination{font-size:23px;line-height:1.25;letter-spacing:0;margin-top:5px;font-weight:550}.solar-glance>span{font-size:20px!important;line-height:1.4;margin-top:12px;font-weight:550}.solar-glance>small{font-size:18px!important;line-height:1.35;margin-top:8px;opacity:1}.solar-glance:focus-visible{outline-width:4px}@media(max-width:650px){.place-nav{grid-template-columns:36px minmax(0,1fr) 36px;gap:10px}.place-nav>div{grid-column:2;grid-row:1}.place-nav #previous{grid-column:1;grid-row:1}.place-nav #next{grid-column:3;grid-row:1}.place-nav .solar-glance{grid-column:1/-1;grid-row:2;min-height:150px;padding:16px 20px!important;display:grid;grid-template-columns:1fr 1.2fr;gap:5px 16px;align-items:center}.solar-glance strong{grid-column:1;grid-row:1/3;font-size:48px!important}.solar-glance strong .solar-destination{font-size:21px}.solar-glance>span{grid-column:2;grid-row:1;font-size:19px!important;margin-top:0}.solar-glance>small{grid-column:2;grid-row:2;font-size:17px!important;margin-top:0}}

/* Wetterseite nutzt genau eine Bildschirmhöhe; Haussteuerung bleibt wischbar. */
.weather-screen{height:100vh;height:100dvh;min-height:100vh;min-height:100dvh;padding:34px max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));overflow:hidden;flex:none}.weather-screen>header{position:absolute;top:0;left:16px;right:16px;height:34px;z-index:6}.weather-screen>footer{position:absolute;bottom:2px;left:20px;right:20px;font-size:8px;z-index:3}.weather-screen .weather-content{height:100%;min-height:0;margin:0 auto;max-width:900px;display:grid;grid-template-areas:'clock' 'place' 'current' 'daily' 'hourly' 'bottom' 'actions';grid-template-rows:19fr 16fr 12fr 19fr 10fr 19fr 5fr;gap:7px}.weather-content>*,.weather-screen .panel{min-height:0;min-width:0}.weather-screen .clock{grid-area:clock;height:100%;width:76%;margin:0 auto;gap:18px}.weather-screen .flip{height:100%;padding:0 4px 8px;display:flex;flex-direction:column;justify-content:center}.weather-screen .flip>span{font-size:clamp(68px,13dvh,144px);line-height:1;letter-spacing:-5px}.weather-screen .flip small{font-size:10px;margin-top:8px}.weather-screen .place-nav{grid-area:place;height:100%;margin:0;padding:0;grid-template-columns:36px minmax(0,1fr) minmax(300px,1.2fr) 36px;gap:9px}.weather-screen .place-nav h1{font-size:clamp(26px,3.7vw,38px)!important}.weather-screen .place-nav .eyebrow{font-size:10px!important}.weather-screen .solar-glance{min-height:0;height:100%;padding:10px 14px!important;display:grid;grid-template-columns:1fr 1.25fr;grid-template-rows:1fr 1fr;gap:3px 12px;align-items:center}.weather-screen .solar-glance strong{grid-column:1;grid-row:1/3;font-size:44px!important}.weather-screen .solar-glance strong .solar-destination{font-size:20px;line-height:1.15;margin-top:3px}.weather-screen .solar-glance>span{grid-column:2;grid-row:1;font-size:18px!important;line-height:1.3;margin:0}.weather-screen .solar-glance>small{grid-column:2;grid-row:2;font-size:16px!important;line-height:1.25;margin:0}.weather-screen .current{grid-area:current;min-height:0;height:100%;padding:10px 18px}.weather-screen .current .temperature{font-size:clamp(44px,7dvh,68px)}.weather-screen .hero-icon{width:clamp(85px,13dvh,140px);height:clamp(85px,13dvh,140px);left:calc(50% - 60px);top:-12px}.weather-screen .hero-icon .weather-symbol{width:100%;height:100%}.weather-screen .daily{grid-area:daily;height:100%}.weather-screen .forecast-day{height:100%;padding:4px 3px;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;gap:1px}.weather-screen .forecast-day .symbol{width:clamp(40px,6dvh,72px);height:clamp(40px,6dvh,72px);margin:0}.weather-screen .forecast-description{font-size:12px;line-height:1.1;min-height:0;margin:0;max-width:100%;height:25px;display:flex;align-items:center;justify-content:center}.weather-screen .forecast-day b,.weather-screen .forecast-day small{font-size:11px;margin:0;line-height:1.15}.weather-screen .forecast-day>div{width:100%;padding-top:3px}.weather-screen .forecast-day strong{font-size:20px}.weather-screen .hourly{grid-area:hourly;height:100%;padding:3px;align-items:center}.weather-screen .hour .weather-symbol{width:clamp(32px,4.5dvh,50px);height:clamp(32px,4.5dvh,50px);margin:0}.weather-screen .hour small{font-size:11px}.weather-screen .hour strong{font-size:16px;margin:0}.weather-screen .weather-bottom{grid-area:bottom;min-height:0;margin:0;display:grid;grid-template-rows:minmax(0,1fr) 32px;gap:5px}.weather-screen .details{height:100%;min-height:0;padding:5px 6px;align-items:center}.weather-screen .details>div:not(.wind){padding:5px 2px}.weather-screen .details small{font-size:9px;margin:0 0 7px;letter-spacing:.3px}.weather-screen .details strong{font-size:19px}.weather-screen .wind-compass{width:clamp(46px,6.5dvh,74px);height:clamp(46px,6.5dvh,74px);margin:0 auto 3px;border-width:2px}.weather-screen .wind .compass-pointer{width:25px;height:34px;margin:-17px 0 0 -12.5px}.weather-screen .wind-compass b{font-size:8px}.weather-screen .wind .compass-n{top:7px}.weather-screen .wind .compass-e{right:7px}.weather-screen .wind .compass-s{bottom:7px}.weather-screen .wind .compass-w{left:7px}.weather-screen .wind strong{font-size:18px}.weather-screen .wind>small{font-size:10px;margin:2px 0 0}.weather-screen .indoor-strip{margin:0;padding:5px 12px;font-size:12px;display:flex;align-items:center}.weather-screen .place-actions{grid-area:actions;align-self:center;margin:0;display:flex;justify-content:center;align-items:center;gap:16px}.weather-screen .add-place{min-height:28px;padding:2px 12px;font-size:12px}.weather-screen .up-link{position:absolute;right:0;bottom:0;min-height:28px;font-size:12px;margin:0;padding:0 8px}.weather-screen .up-link span{display:none}.weather-screen #weather-error{position:absolute;top:40%;left:5%;right:5%;z-index:5}.weather-screen #weather-error:empty{display:none}
@media(max-width:650px){.weather-screen .place-nav{grid-template-columns:28px minmax(0,1fr) minmax(200px,1.3fr) 28px;gap:5px}.weather-screen .place-nav>div{grid-area:auto}.weather-screen .place-nav #previous,.weather-screen .place-nav #next,.weather-screen .place-nav .solar-glance{grid-area:auto}.weather-screen .solar-glance{padding:8px!important;gap:3px 6px}.weather-screen .solar-glance strong{font-size:36px!important}.weather-screen .solar-glance strong .solar-destination{font-size:17px}.weather-screen .solar-glance>span{font-size:16px!important}.weather-screen .solar-glance>small{font-size:14px!important}.weather-screen .place-nav h1{font-size:24px!important}.weather-screen .place-nav .eyebrow{display:none}.weather-screen .details strong{font-size:15px}.weather-screen .details small{font-size:7px}.weather-screen .forecast-description{font-size:10px}.weather-screen .forecast-day b,.weather-screen .forecast-day small{font-size:9px}}
@media(orientation:landscape) and (max-height:850px){.weather-screen .weather-content{max-width:1100px;grid-template-areas:'clock place' 'current current' 'daily daily' 'hourly hourly' 'bottom bottom' 'actions actions';grid-template-columns:1fr 1.1fr;grid-template-rows:24fr 15fr 21fr 12fr 23fr 5fr}.weather-screen .clock{width:90%}.weather-screen .place-nav{grid-template-columns:0 minmax(0,.7fr) minmax(220px,1.3fr) 0;gap:4px}.weather-screen .place-nav>.icon-button{min-width:0;width:0;overflow:hidden;padding:0}.weather-screen .place-nav .eyebrow{display:none}.weather-screen .solar-glance strong{font-size:42px!important}.weather-screen .forecast-day .symbol{width:40px;height:40px}.weather-screen .hero-icon{height:100px;width:100px;top:-12px}}

.weather-screen .daily,.weather-screen .hourly{margin:0;overflow:hidden}.weather-screen .hour{height:100%;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0 3px;line-height:1.15}.weather-screen .hour .weather-symbol{flex-shrink:0}.weather-screen .place-actions{height:100%;min-height:0;max-height:100%}.weather-screen .place-actions nav button{min-height:24px}.weather-screen .place-actions #dots{margin:0}

/* Ruhige Wetter-Kachel statt übergroßer Anzeige. */
.weather-screen .solar-glance{height:min(100%,96px);padding:9px 13px!important;align-self:center;border-color:#c6dbe640;box-shadow:inset 0 1px #ffffff12,0 3px 10px #0002}.weather-screen .solar-glance strong{font-size:32px!important;letter-spacing:-.5px}.weather-screen .solar-glance strong .solar-destination{font-size:16px;font-weight:450}.weather-screen .solar-glance>span{font-size:15px!important;font-weight:500}.weather-screen .solar-glance>small{font-size:14px!important;color:var(--secondary,#c8dce5)}
/* Status bleibt auch als Text verständlich. */
[data-state=connected]{--connection-color:#66d49a}[data-state=stale]{--connection-color:#f4ac50}[data-state=disconnected]{--connection-color:#ed7375}.pill[data-state]:before,.anker-bank h4[data-state]:before{content:'';display:inline-block;width:8px;height:8px;flex:none;margin-right:8px;border-radius:50%;background:var(--connection-color);box-shadow:0 0 6px color-mix(in srgb,var(--connection-color) 35%,transparent);vertical-align:middle}.solar-glance[data-state]{border-left:3px solid var(--connection-color)}.status-dot[data-state]{background:var(--connection-color)!important}
/* Gleiche Energie-Symbole in der bisherigen Gesamtkachel (266 px). */
.anker-summary{height:266px;min-height:266px;box-sizing:border-box;padding:14px 18px;display:grid;grid-template-rows:24px 102px 76px 16px;gap:5px}.anker-summary h4{margin:0;font-size:20px;line-height:24px}.aggregate-flow-host{min-height:0}.anker-summary .aggregate-flow{height:102px;margin:0;padding:0;grid-template-rows:44px 54px;gap:4px 0;max-width:740px;margin:auto}.anker-summary .aggregate-flow .energy-end{display:grid;grid-template-columns:30px auto;grid-template-rows:24px 16px;column-gap:8px;justify-content:center;align-items:center}.anker-summary .aggregate-flow .energy-end svg{width:28px;height:28px;grid-row:1/3;margin:0}.anker-summary .aggregate-flow .energy-end strong{font-size:21px}.anker-summary .aggregate-flow .energy-end span{font-size:10px;margin:0}.anker-summary .aggregate-flow .flow-meter{padding:4px;margin:0 8px;max-width:150px;justify-self:center;width:90%}.anker-summary .aggregate-flow .flow-meter strong{font-size:19px;line-height:1.1}.anker-summary .aggregate-flow .flow-meter span{font-size:10px;margin-top:2px}.anker-summary .aggregate-flow .battery-shell{height:37px;width:60px;border-radius:7px;margin:4px auto 1px}.anker-summary .aggregate-flow .battery-shell:before{width:20px;height:3px;top:-5px;left:18px}.anker-summary .aggregate-flow .battery-shell strong{font-size:17px}.anker-summary .aggregate-flow .energy-storage>span{font-size:9px;margin:0;line-height:1.1}.anker-summary .summary-note{margin:0;font-size:10px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.energy-periods{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px;margin:14px 0 8px}.energy-period{min-width:0;padding:9px 0;border-top:1px solid #ffffff24}.energy-period>span{display:block;color:#c1d6dc;font-size:12px;line-height:1.35;min-height:32px}.energy-period strong{display:block;font-size:18px;line-height:1.3;color:#f2dcaa;margin-top:5px;white-space:nowrap}.energy-period small{display:block;font-size:13px;line-height:1.3;color:#b9d6cb;margin-top:4px}.compact-periods{margin:0;gap:12px;align-items:start}.compact-periods .energy-period{padding:5px 0 0}.compact-periods .energy-period>span{font-size:11px;min-height:16px;white-space:nowrap}.compact-periods .energy-period strong{font-size:18px;margin-top:3px}.compact-periods .energy-period small{font-size:12px;margin-top:2px}.energy-lifetime{grid-template-columns:repeat(2,1fr)}.energy-lifetime strong{font-size:20px}.energy-history .energy-date{display:block;margin-top:7px}.energy-history .energy-periods{grid-template-columns:repeat(3,minmax(0,1fr))}.energy-history .energy-period strong{font-size:20px}.energy-history .energy-period>span{min-height:18px}.energy-history .energy-period small{font-size:14px}#energy-settings-form{margin-bottom:22px}#electricity-rate{max-width:240px}@media(max-width:650px){.anker-summary{padding-left:12px;padding-right:12px}.compact-periods{gap:5px}.compact-periods .energy-period>span{font-size:10px;white-space:normal;min-height:26px}.compact-periods .energy-period strong{font-size:14px}.compact-periods .energy-period small{font-size:11px}.anker-summary .aggregate-flow .energy-end{grid-template-columns:24px auto;column-gap:4px}.anker-summary .aggregate-flow .energy-end svg{width:22px;height:22px}.anker-summary .aggregate-flow .energy-end strong{font-size:17px}.anker-summary .aggregate-flow .flow-meter strong{font-size:17px}.weather-screen .solar-glance strong{font-size:30px!important}.weather-screen .solar-glance strong .solar-destination{font-size:15px}.weather-screen .solar-glance>span{font-size:14px!important}.weather-screen .solar-glance>small{font-size:13px!important}}

.solar-glance[data-state] .solar-watts:before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--connection-color);vertical-align:middle;margin-right:9px}

.weather-screen .solar-glance[data-state]{border-left:1px solid #c6dbe640}

/* Safari 12: viewport sizing without dvh, clamp(), min() or max(). */
.legacy-browser #pages{height:var(--portal-height)}
.legacy-browser .screen{padding:16px 28px 12px}
.legacy-browser .weather-screen{height:var(--portal-height);min-height:var(--portal-height);padding:34px 16px 12px}
.legacy-browser .weather-screen .flip>span{font-size:var(--legacy-clock-size)}
.legacy-browser .weather-screen .place-nav h1{font-size:32px!important}
.legacy-browser .weather-screen .solar-glance{height:96px;max-height:100%}
.legacy-browser .weather-screen .current .temperature{font-size:56px}
.legacy-browser .weather-screen .hero-icon{width:120px;height:120px}
.legacy-browser .weather-screen .forecast-day .symbol{width:calc(var(--portal-vh) * 6);height:calc(var(--portal-vh) * 6);min-width:40px;min-height:40px;max-width:72px;max-height:72px}
.legacy-browser .weather-screen .hour .weather-symbol{width:40px;height:40px}
.legacy-browser .weather-screen .wind-compass{width:56px;height:56px}
.legacy-dialogs dialog:not([open]){display:none}
.legacy-dialogs dialog[open]{display:block;position:fixed;top:50%;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);margin:0;width:600px;max-width:calc(100% - 32px);max-height:calc(var(--portal-height) - 32px);overflow:auto;z-index:1002}
.legacy-dialogs .dialog-open:after{content:'';position:fixed;top:0;right:0;bottom:0;left:0;background:#071321bd;z-index:1001}
@media(orientation:landscape) and (max-height:850px){.legacy-browser .weather-screen .hero-icon{width:100px;height:100px}}

/* Die tatsächlich abgegebene Leistung steht im Energiefluss im Vordergrund. */
.split-flow>.output-end{border:1px solid #9bdfc573;background:#143d3ee8;border-radius:12px;padding:10px 4px;position:relative;z-index:2;color:#b0f1d3}
.split-flow>.output-end strong{font-size:32px;font-weight:700;line-height:1.1}
.split-flow>.output-end span{color:#e1faed;font-size:13px;font-weight:600}
.split-flow>.output-end svg{width:40px;height:40px}
.anker-summary .aggregate-flow>.output-end{padding:3px 5px;grid-template-columns:24px auto;grid-template-rows:24px 12px;margin:0 3px}
.anker-summary .aggregate-flow>.output-end strong{font-size:25px;line-height:24px}
.anker-summary .aggregate-flow>.output-end span{font-size:10px;line-height:12px}
.anker-summary .aggregate-flow>.output-end svg{width:24px;height:24px}
.flow-paths path{stroke:#b7d7d88c;stroke-width:2.5}
.weather-screen .solar-glance,.weather-screen .solar-glance[data-state]{background:var(--tile);border-color:var(--tile-border);color:var(--reading)}
.weather-screen .solar-glance strong,.weather-screen .solar-glance .solar-watts{color:var(--accent)}
.weather-screen .solar-glance>span,.weather-screen .solar-glance .solar-destination{color:var(--reading)}
.energy-history .energy-periods{grid-template-columns:repeat(5,minmax(0,1fr))}
.energy-history .energy-period strong{font-size:18px}
.energy-history .energy-period>span{min-height:32px}
@media(max-width:650px){.energy-history .energy-periods{grid-template-columns:repeat(3,minmax(0,1fr))}.anker-summary .aggregate-flow>.output-end strong{font-size:22px}.anker-summary .aggregate-flow>.output-end span{font-size:9px}}

/* Einzelanlagen: jeder Zeitraum erhält eine eigene, gut lesbare Zeile. */
.anker-bank .energy-history .energy-periods{display:grid;grid-template-columns:1fr;gap:0;margin:14px 0 12px}
.anker-bank .energy-history .energy-period{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,.85fr);gap:8px;align-items:center;padding:10px 0}
.anker-bank .energy-history .energy-period>span{min-height:0;font-size:14px;line-height:1.35}
.anker-bank .energy-history .energy-period strong{font-size:18px;white-space:normal;margin:0;text-align:right;line-height:1.35}
.anker-bank .energy-history .energy-period small{font-size:15px;text-align:right;margin:0;line-height:1.35;white-space:normal}
.energy-lifetime{align-items:start;gap:18px}.energy-lifetime>div{min-width:0}
.energy-lifetime>div>span{font-size:14px;line-height:1.4;min-height:40px}
.energy-lifetime strong{font-size:23px;line-height:1.3;margin:7px 0 10px;white-space:normal}
.energy-lifetime .co2-comparison{font-size:14px;line-height:1.5;color:#d6e6df;margin:8px 0}
.energy-lifetime small,.energy-lifetime .co2-source{display:block;font-size:11px;line-height:1.5;color:#b3cad1;margin-top:5px}
.energy-lifetime .co2-source{text-underline-offset:3px}
@media(max-width:420px){.energy-lifetime{grid-template-columns:1fr}.energy-lifetime>div>span{min-height:0}.anker-bank .energy-history .energy-period strong{font-size:16px}.anker-bank .energy-history .energy-period small{font-size:14px}}

.energy-period-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,.85fr);gap:8px;padding:0 0 8px;color:#b3cad1;font-size:12px}.energy-period-heading>span:not(:first-child){text-align:right}

/* Gemeinsame Bilanz direkt unter West + Ost, außerhalb des kompakten Flussbildes. */
.aggregate-lifetime{margin-top:12px;padding:12px 18px;border:1px solid #d1dfb82c;border-radius:14px;background:#203b4566}
.aggregate-lifetime .energy-lifetime{border:0;padding:0}
.aggregate-lifetime .energy-lifetime>div>span{min-height:0}
.weather-screen .solar-glance>.glance-banks{display:flex;flex-direction:column;justify-content:center;gap:5px;margin:0;line-height:1.1}
.weather-screen .glance-banks .glance-bank{display:flex;align-items:center;gap:7px;margin:0;font-size:14px;line-height:1.1;white-space:nowrap}
.weather-screen .glance-bank .bank-side{display:inline-block;width:34px;font-size:14px;margin:0}
.weather-screen .glance-bank .bank-percent{font-size:14px;font-weight:600;min-width:35px}
.weather-screen .glance-bank .mini-battery{display:inline-block;position:relative;width:39px;height:18px;border:1.5px solid currentColor;border-radius:4px;margin:0 3px 0 0;padding:2px;flex:none;color:var(--reading)}
.mini-battery:after{content:'';position:absolute;right:-4px;top:4px;width:3px;height:7px;border-radius:0 2px 2px 0;background:currentColor}
.mini-battery-fill{display:block;height:100%;min-width:1px;background:#80d4ab;border-radius:1px}
.mini-battery[data-level=low] .mini-battery-fill{background:#ed8c79}.mini-battery[data-level=medium] .mini-battery-fill{background:#efc36b}.mini-battery[data-level=unknown] .mini-battery-fill{display:none}
@media(max-width:650px){.weather-screen .glance-banks .glance-bank{gap:4px}.weather-screen .glance-bank .mini-battery{width:32px}.aggregate-lifetime{padding:12px}}

.bank-divider{margin:26px 0 0;padding:20px 0 0;border-top:2px solid #c2dbd85c}.bank-divider h4{font-size:22px;font-weight:550;line-height:1.3;color:#edf4ee;margin:0}.bank-divider p{font-size:14px;color:#b7cfd4;margin:6px 0 0;line-height:1.4}.bank-divider+.anker-systems{margin-top:16px}

.sonoff-device{padding:16px;margin-top:12px;border:1px solid #b4d6d333;border-radius:12px;background:#18303c99}.sonoff-device h4{font-size:20px;margin:0 0 8px}.sonoff-device p{font-size:14px;line-height:1.5}.sonoff-device strong{display:block;font-size:22px;margin:10px 0}.sonoff-device small{font-size:12px;color:#b3cad1}.sonoff-device h4[data-state]:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--connection-color);margin-right:8px}

/* iOS 12: native momentum scrolling and button layout without CSS Grid. */
.legacy-browser #pages{overflow-x:hidden;scroll-snap-type:none;-webkit-scroll-snap-type:none;scroll-behavior:auto;-webkit-overflow-scrolling:touch;touch-action:pan-y}
.legacy-browser .screen{width:100%;min-width:0;scroll-snap-align:none}
.legacy-browser .control-content,.legacy-browser .settings-content{width:100%;max-width:1100px;min-width:0;margin-left:auto;margin-right:auto}
.legacy-browser .control-grid,.legacy-browser .control-card,.legacy-browser .anker-bank{min-width:0;max-width:100%}
.legacy-browser .weather-screen .solar-glance{position:relative;display:block;height:96px;max-height:100%;overflow:hidden}
.legacy-browser .weather-screen .solar-glance>strong{position:absolute;top:12px;left:12px;width:45%;margin:0;display:block;text-align:left;font-size:30px!important;line-height:1.05}
.legacy-browser .weather-screen .solar-glance>strong .solar-destination{font-size:15px;line-height:1.2;margin-top:4px}
.legacy-browser .weather-screen .solar-glance>.glance-banks{position:absolute;top:12px;right:12px;left:auto;width:124px;display:block;margin:0}
.legacy-browser .weather-screen .glance-banks .glance-bank{display:block;height:21px;margin:0;line-height:18px;font-size:14px}
.legacy-browser .weather-screen .glance-bank .bank-side{display:inline-block;width:34px;vertical-align:middle}
.legacy-browser .weather-screen .glance-bank .mini-battery{display:inline-block;width:34px;vertical-align:middle;margin:0 7px 0 3px}
.legacy-browser .weather-screen .glance-bank .bank-percent{display:inline-block;vertical-align:middle;font-size:14px}
.legacy-browser .weather-screen .solar-glance>small{position:absolute;bottom:9px;right:12px;left:12px;display:block;margin:0;font-size:12px!important;line-height:15px;text-align:right;white-space:nowrap}
.legacy-browser .weather-screen *,.legacy-browser .control-screen *{filter:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;animation:none!important;transition:none!important}
.legacy-browser .panel,.legacy-browser .anker-bank{box-shadow:none}

.legacy-browser.portal-standalone .weather-screen{padding-top:52px}.legacy-browser.portal-standalone .weather-screen>header{top:18px}

.weather-screen .carport-reading{position:absolute;left:62%;right:15%;top:50%;transform:translateY(-50%);text-align:center;color:var(--reading);line-height:1.15;z-index:2}
.carport-reading>span{display:block;font-size:12px;line-height:1.25;margin-bottom:4px;font-weight:500}
.carport-reading>span:before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--connection-color);margin-right:5px;vertical-align:middle}
.carport-reading>strong{display:block;font-size:19px;font-weight:600;line-height:1.2;white-space:nowrap}
.carport-reading>small{display:block;font-size:10px;line-height:1.2;margin-top:2px;color:var(--secondary)}
@media(max-width:650px){.weather-screen .carport-reading{left:63%;right:15%}.carport-reading>span{font-size:10px}.carport-reading>strong{font-size:16px}.carport-reading>small{font-size:9px}}

.sensor-label-choice{display:block;margin:16px 0;color:#c8dce1;font-size:14px}.sensor-label-choice input{display:block;width:100%;margin-top:8px;padding:12px;border:1px solid #bdd8dc66;border-radius:9px;background:#152d38;color:#eef7f5;font:inherit;min-height:44px}.climate .sensor-choice select{min-height:48px;font-size:17px}.climate .card-note{font-size:14px;line-height:1.5}

.carport-reading>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Local measurements appear only at the sensor's home location. */
#carport-reading[hidden], .indoor-strip[hidden] { display: none !important; }

#solar-glance[hidden] { display: none !important; }

.sonoff-switch-buttons{display:flex;gap:14px;margin:16px 0}.sonoff-switch-button{flex:1;min-height:64px;padding:12px 16px;border:2px solid #a9c4ce;border-radius:12px;font-size:24px;font-weight:700;color:#f5fbff;background:#18313d;cursor:pointer}.sonoff-switch-button.on[aria-pressed=true]{background:#19634f;border-color:#69e1ad}.sonoff-switch-button.off[aria-pressed=true]{background:#465663;border-color:#e8eff5}.sonoff-switch-button:disabled{opacity:.45;cursor:default}.sonoff-switch-button:focus{outline:3px solid #ffdd8d;outline-offset:3px}.sonoff-device h4{font-size:22px;line-height:1.3}.sonoff-current-state{display:block;font-size:22px;margin:12px 0}.sonoff-connection,.sonoff-channel,.sonoff-control-note,.sonoff-command-message{font-size:16px;line-height:1.45}.sonoff-command-message{color:#ffdf9f;min-height:24px}.sonoff-control-note{color:#d1dfe5}@media(max-width:420px){.sonoff-switch-buttons{gap:10px}.sonoff-switch-button{font-size:21px;padding:12px 8px}}

/* Statuspunkt oben rechts, getrennt von der Wattzahl. */
.solar-glance{position:relative}.solar-glance[data-state] .solar-watts:before{display:none!important}.solar-glance[data-state]:after{content:'';position:absolute;right:12px;top:10px;width:9px;height:9px;border-radius:50%;background:var(--connection-color);pointer-events:none}

.weather-screen .weather-bottom{grid-template-rows:minmax(0,1fr) 28px 22px}.weather-update{display:block;color:var(--on-photo,#e1edf3);font-size:13px;line-height:20px;padding:0 8px;text-shadow:0 1px 3px #000;text-align:left;white-space:nowrap}.weather-screen .weather-bottom.without-local-sensor{grid-template-rows:minmax(0,1fr) 22px}@media(max-width:430px){.weather-update{font-size:11px;padding:0 4px}}


/* Confirmed switch states, readable even on Safari 12. */
.sonoff-switch-button.on{border-color:#54c78f;color:#c9f8df}.sonoff-switch-button.off{border-color:#e48080;color:#ffdada}.sonoff-switch-button.on[aria-pressed=true]{background:#19634f;border-color:#69e1ad;color:#fff}.sonoff-switch-button.off[aria-pressed=true]{background:#963c42;border-color:#f59191;color:#fff}.weather-update-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:3px 12px;border-radius:7px;background:#10233380;color:var(--reading,#d9ecf5);font-size:12px;min-width:0}.weather-update-row .weather-update{padding:0;color:inherit;line-height:18px;font-size:12px;text-shadow:none;letter-spacing:.4px}.weather-update-row #synology-status{white-space:nowrap;font-size:11px}.weather-update-row #synology-status:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px;background:var(--connection-color)}.weather-screen .weather-bottom{grid-template-rows:minmax(0,1fr) 28px 28px}.weather-screen .weather-bottom.without-local-sensor{grid-template-rows:minmax(0,1fr) 28px}#sonoff-name-fields fieldset{margin:18px 0;padding:16px;border:1px solid #65828d;border-radius:12px}#sonoff-name-fields legend{font-size:19px}#sonoff-name-fields p[data-state=connected]{color:#75dda5}#sonoff-name-fields p[data-state=disconnected]{color:#f29494}#sonoff-name-fields p[data-state=stale]{color:#edbf78}@media(max-width:550px){.weather-update-row{flex-wrap:wrap;gap:0;padding:2px 8px}.weather-update-row .weather-update{font-size:10px;letter-spacing:0}.weather-update-row #synology-status{font-size:10px}.weather-screen .weather-bottom{grid-template-rows:minmax(0,1fr) 28px 40px}}

.roller-buttons{display:flex;gap:10px;margin:16px 0}.roller-buttons button{flex:1;min-height:64px;border:2px solid #78909c;border-radius:12px;font-size:23px;font-weight:650;background:#243d48}.roller-buttons button:disabled{opacity:.5;cursor:default}

#sonoff-account-inputs{border:0;padding:0;margin:18px 0 0;min-width:0}#sonoff-account-inputs[hidden]{display:none!important}#sonoff-link-protection{font-size:16px;line-height:1.5}#sonoff-account-saved[data-state=connected]{color:#97f0bf;border-color:#70d6a5}#sonoff-account-form>.card-heading{flex-wrap:wrap;gap:12px}

.sonoff-switch-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:80px}.sonoff-button-feedback{display:block;min-height:18px;font-size:13px;line-height:18px;font-weight:600;border-radius:6px;padding:0 7px}.sonoff-button-feedback[data-feedback=confirmed]{color:#a3f2be;background:#10382ddd}.sonoff-button-feedback[data-feedback=pending]{color:#ffe18a;background:#4b391c}.sonoff-button-feedback[data-feedback=failed]{color:#ffb5b5;background:#5c2028}.sonoff-switch-button:disabled .sonoff-button-feedback{opacity:1}.sonoff-switch-button[data-feedback=pending]:disabled{opacity:.85}


.sonoff-diagnosis{margin:14px 0;padding:14px 16px;border:1px solid #daa958;border-radius:10px;background:#5a3d1a40}.sonoff-diagnosis>strong{color:#ffcf83;font-size:18px}.sonoff-diagnosis ul{padding-left:22px;margin-bottom:0}.sonoff-diagnosis li{font-size:15px;line-height:1.5;margin:8px 0}

.cover-control{padding:16px 0;border-top:1px solid #8fb2bc40}.cover-control h5{font-size:23px;margin:0 0 8px}.cover-state{font-size:16px!important}.cover-command-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:80px!important}.roller-buttons .cover-command-button[aria-pressed=true]{border-color:#73dfae;background:#205344}.roller-buttons .cover-command-button:disabled{opacity:.45}

/* Feedback belongs to the corner; the confirmed device state alone determines button colors. */
.sonoff-switch-button,.cover-command-button{position:relative}
.sonoff-switch-button .sonoff-button-feedback,.cover-command-button .sonoff-button-feedback{position:absolute;top:7px;right:8px;min-height:0;max-width:calc(100% - 16px);font-size:11px;line-height:17px;padding:0 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.sonoff-button-feedback[data-feedback=""]{display:none}
.sonoff-switch-button:disabled,.sonoff-switch-button[data-feedback=pending]:disabled,.roller-buttons .cover-command-button:disabled{opacity:1;cursor:default}

/* Gemeinsame Bedienung; Rückmeldung ausschließlich je Ausgang. */
.sonoff-group-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin:8px 0 14px}.sonoff-group-button{min-height:44px;padding:9px 14px;border:1px solid #91acb7;border-radius:9px;background:#243e49;font-size:16px;font-weight:650}.sonoff-group-button.on{border-color:#69dca5}.sonoff-group-button.off{border-color:#ef9292}.sonoff-group-button:disabled{opacity:.5}

/* Einstellungen als eigene Ansicht: keine Sprünge zur Wetterseite beim Laden. */
#pages.settings-open{scroll-snap-type:none;scroll-behavior:auto}#pages.settings-open>.weather-screen,#pages.settings-open>.control-screen{display:none}

.portal-publication{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 18px;margin-top:28px;padding:14px 0 4px;border-top:1px solid #b4d6d326;color:#b9cdd4;font-size:12px;line-height:1.5}

/* Bildkacheln statt WebGL: auch auf Safari iOS 12. */
#radar-dialog{position:fixed;top:12px;left:12px;right:12px;bottom:12px;margin:0;width:auto;max-width:none;height:auto;max-height:none;padding:16px;background:#172e3c;border:1px solid #839ca9;border-radius:16px;z-index:4000;overflow:hidden}#radar-dialog[open]{display:flex;flex-direction:column}#radar-dialog:not([open]){display:none}#radar-dialog::backdrop{background:#06111be6}.radar-header{display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:10px}.radar-header h2{font-size:24px;margin:0}.radar-header button,.radar-tools button{min-height:46px;padding:8px 16px;border:1px solid #9cc4d6;border-radius:9px;background:#294958;font-size:18px;font-weight:650}#radar-status{margin:8px 0;font-size:15px;min-height:21px}.radar-map{flex:1;min-height:120px;position:relative;overflow:hidden;background:#c5d3d8}.radar-map img{position:absolute;width:256px;height:256px;max-width:none}.radar-marker{position:absolute;left:50%;top:50%;width:17px;height:17px;margin:-8px;border:3px solid white;border-radius:50%;background:#b72a34;box-shadow:0 0 0 2px #253d4e;z-index:4}.radar-tools{display:flex;align-items:center;gap:10px;padding:10px 0;flex-shrink:0}.radar-tools input{min-width:30px;flex:1;height:44px}.radar-footer{font-size:12px;line-height:1.5;display:flex;flex-wrap:wrap;justify-content:space-between;gap:3px 15px}.radar-footer a{color:#b9e9ff}.radar-colors{display:inline-block;width:70px;height:9px;background:linear-gradient(90deg,#50c8fa,#2463e2,#61d64d,#f9e53e,#f42e44);margin-right:5px}.radar-trigger{cursor:pointer}.radar-trigger:focus{outline:2px solid #9de3ff;outline-offset:2px}@media(max-width:500px){#radar-dialog{top:5px;left:5px;right:5px;bottom:5px;padding:10px}.radar-header h2{font-size:20px}.radar-tools{gap:5px}.radar-tools button{padding:6px 10px;font-size:16px}}

#radar-dialog{transform:none}



.settings-screen>.portal-publication{margin-top:auto;padding-top:18px;width:100%;flex-shrink:0}.settings-screen .settings-content{padding-bottom:28px}

.radar-map{touch-action:none;cursor:grab}.radar-plane{position:absolute;top:0;left:0;width:100%;height:100%}.radar-forecast{flex-shrink:0;border-top:1px solid #aac8d44d;padding-top:8px}.radar-forecast h3{font-size:16px;margin:0 0 6px}#radar-forecast-hours{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch}.radar-forecast-hour{min-width:82px;text-align:center;border-right:1px solid #a8c8d333;padding:4px 8px}.radar-forecast-hour small,.radar-forecast-hour strong,.radar-forecast-hour span{display:block}.radar-forecast-hour strong{font-size:17px;color:#b4e8ff;margin:3px 0}.radar-forecast-hour span{font-size:13px}.radar-forecast p{font-size:11px;color:#bbd0dc;margin:5px 0 8px}@media(max-height:600px){.radar-forecast-hour{padding:0 6px}.radar-forecast h3{font-size:14px}.radar-forecast-hour strong{font-size:14px}}

/* Einstellungen sind kein durch Scrollen erreichbarer Bildschirm. */
#pages:not(.settings-open)>.settings-screen{display:none}#pages.settings-open>.settings-screen{display:flex}.settings-tools{margin:20px 0}.settings-tools button{min-height:48px;padding:12px 18px;border-radius:10px;font-size:17px}.settings-content>.climate{margin:24px 0;max-width:580px}.settings-content>.climate h3{margin-top:0}#changelog-dialog{max-width:760px;width:92%;padding:22px;background:#19333f}#changelog-dialog[open]{display:block}.changelog-content{line-height:1.6}.changelog-content h3{font-size:18px;color:#d0edfa}.changelog-content article{border-top:1px solid #a5c5d533;padding-top:12px;margin-top:22px}.changelog-content li{margin:8px 0}.changelog-content ul{padding-left:22px}

.radar-tabs{display:flex;gap:10px;flex-shrink:0;margin-top:10px}.radar-tabs button{padding:9px 14px;border:1px solid #7c9cac;border-radius:9px;font-size:16px;background:#223e4c}.radar-tabs button[aria-pressed=true]{background:#356477;border-color:#9ce0ff}#radar-future{flex:1;min-height:160px;width:100%;border:0;background:#29414d}#radar-future[hidden],.radar-tools[hidden],.radar-footer[hidden],.radar-map[hidden]{display:none!important}

#radar-map .leaflet-tile{width:256px;height:256px;position:absolute}#radar-map .leaflet-pane{z-index:200}#radar-map .leaflet-overlay-pane{z-index:400}#radar-map .leaflet-control-container{display:none}#radar-map{isolation:isolate}.radar-future-help{font-size:14px;color:#cce8f5;margin:0 0 6px}

/* Die ruhende Wetterseite nutzt auch die frei gewordene Bedienfläche. */
.weather-screen .weather-content{max-width:1200px}
.weather-screen .clock{width:86%}
.weather-screen .flip>span{font-size:calc(var(--portal-height,100vh) * .15);font-size:clamp(54px,15dvh,184px)}
.weather-screen .current .temperature{font-size:92px;font-size:clamp(72px,10.4dvh,110px)}
.legacy-browser .weather-screen .current .temperature{font-size:92px}
.weather-screen.controls-hidden,.legacy-browser .weather-screen.controls-hidden{padding-top:10px;padding-bottom:10px}
.weather-screen.controls-hidden .place-actions{display:none}
.weather-screen.controls-hidden .place-nav{grid-template-columns:0 minmax(0,1fr) minmax(260px,1.2fr) 0;gap:0}
.weather-screen.controls-hidden .place-nav>.icon-button{min-width:0;width:0;padding:0;overflow:hidden}
@media(min-height:700px){
 .weather-screen .weather-content{grid-template-rows:22fr 12fr 13fr 19fr 10fr 20fr 4fr}
 .weather-screen.controls-hidden .weather-content{grid-template-rows:22fr 12fr 14fr 19fr 11fr 22fr 0;row-gap:6px}
}
@media(orientation:portrait){
 .weather-screen .weather-content{max-width:none}
 .weather-screen,.legacy-browser .weather-screen{padding-left:12px;padding-right:12px}
 .weather-screen.controls-hidden,.legacy-browser .weather-screen.controls-hidden{padding-left:10px;padding-right:10px}
}
@media(orientation:landscape) and (max-height:850px){
 .weather-screen .clock{width:94%}
 .weather-screen.controls-hidden .place-nav{grid-template-columns:0 minmax(0,.7fr) minmax(220px,1.3fr) 0}
 .weather-screen .weather-content{grid-template-rows:24fr 15fr 21fr 12fr 23fr 5fr}
 .weather-screen.controls-hidden .weather-content{grid-template-rows:26fr 16fr 22fr 12fr 24fr 0}
}
@media(max-width:600px){
 .weather-screen .flip>span{font-size:24vw}
 .weather-screen .current .temperature,.legacy-browser .weather-screen .current .temperature{font-size:72px}
 .weather-screen.controls-hidden .place-nav{grid-template-columns:0 minmax(0,1fr) minmax(165px,1.1fr) 0}
}

.weather-screen .weather-update-row{background:var(--bar)}

.weather-screen .carport-reading{right:21%;left:61%}
@media(max-width:600px){.weather-screen .carport-reading{right:24%;left:57%}}

/* Messstand im selben Stil wie die lokale Messwertzeile. */
.weather-screen .weather-update-row{border-radius:9px;padding:5px 12px;font-size:12px;line-height:18px}
.weather-screen .weather-update-row .weather-update{font-size:12px;letter-spacing:.6px;font-weight:500}
.weather-screen.controls-hidden .weather-bottom{grid-template-rows:minmax(0,1fr) 28px}
.weather-screen.controls-hidden .weather-bottom.without-local-sensor{grid-template-rows:minmax(0,1fr)}
.weather-screen.controls-hidden .weather-update-row{position:absolute;right:0;bottom:-8px;padding:0 4px;background:transparent}
.weather-screen.controls-hidden .weather-update-row .weather-update{display:none}
.weather-screen.controls-hidden .weather-update-row #synology-status{font-size:10px;color:var(--on-photo);text-shadow:0 1px 3px #000}
@media(max-width:550px){.weather-screen .weather-update-row{padding:3px 12px}.weather-screen .weather-update-row .weather-update{font-size:10px;letter-spacing:0}}

/* Klappuhr: nur die geänderte Ziffer wird kurz animiert. */
.weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:calc(var(--portal-height,100vh) * .17);font-size:clamp(54px,17dvh,208px)}
.legacy-browser .weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:var(--legacy-clock-size)}
.weather-screen .clock{width:90%}
.weather-screen #synology-status{position:absolute;top:8px;right:10px;z-index:6;font-size:10px;line-height:14px;font-weight:500;letter-spacing:0;color:var(--clock-small);text-shadow:none;white-space:nowrap}
.weather-screen #synology-status:before{content:'';display:inline-block;width:5px;height:5px;border-radius:50%;margin-right:4px;background:var(--connection-color)}
.weather-screen .weather-bottom{grid-template-rows:minmax(0,1fr) 28px 28px}
.weather-screen .weather-bottom.without-local-sensor{grid-template-rows:minmax(0,1fr) 28px}
.weather-screen.controls-hidden .weather-update-row{display:none}
.clock-turn{position:absolute;perspective:700px;pointer-events:none;z-index:4;text-align:center;line-height:1;font-variant-numeric:tabular-nums}
.clock-leaf{position:absolute;left:0;width:100%;height:50%;overflow:hidden;background:var(--clock-face);backface-visibility:hidden;-webkit-backface-visibility:hidden;transform-style:preserve-3d}
.clock-leaf>span{position:absolute;left:0;right:0;top:0;display:block;font:inherit;line-height:1;letter-spacing:inherit;color:inherit;text-shadow:inherit}
.clock-old-top{top:0;transform-origin:50% 100%;animation:clock-turn-top .64s ease-in both;z-index:3}
.clock-old-bottom{top:50%;animation:clock-old-bottom .64s linear both;z-index:1}
.clock-new-bottom{top:50%;transform-origin:50% 0;animation:clock-turn-bottom .64s ease-out both;z-index:2}
@keyframes clock-turn-top{0%{transform:rotateX(0)}49%,100%{transform:rotateX(-90deg)}}
@keyframes clock-turn-bottom{0%,49%{transform:rotateX(90deg)}100%{transform:rotateX(0)}}
@keyframes clock-old-bottom{0%,49%{visibility:visible}50%,100%{visibility:hidden}}
@media(min-height:700px){.weather-screen .weather-content{grid-template-rows:26fr 11fr 14fr 20fr 10fr 15fr 4fr}.weather-screen.controls-hidden .weather-content{grid-template-rows:26fr 11fr 15fr 21fr 11fr 16fr 0}}
@media(orientation:landscape) and (max-height:850px){.weather-screen .clock{width:94%}.weather-screen .weather-content{grid-template-rows:26fr 15fr 20fr 12fr 22fr 5fr}.weather-screen.controls-hidden .weather-content{grid-template-rows:28fr 16fr 21fr 12fr 23fr 0}}
@media(max-width:600px){.weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:26vw}.weather-screen #synology-status{font-size:8px;top:5px;right:6px}}
@media(prefers-reduced-motion:reduce){.clock-turn{display:none}}

/* Lokale Messwerte stehen bereits in der aktuellen Wetterkachel. */
.weather-screen .indoor-strip{display:none!important}
.weather-screen .weather-bottom,.weather-screen .weather-bottom.without-local-sensor{grid-template-rows:minmax(0,1fr) 28px}
.weather-screen.controls-hidden .weather-bottom,.weather-screen.controls-hidden .weather-bottom.without-local-sensor{grid-template-rows:minmax(0,1fr)}

/* Große Hochformat-Tablets: Wetterwerte wachsen mit der nutzbaren Höhe. */
@media(orientation:portrait) and (min-width:700px) and (min-height:1000px){
 .weather-screen .current>div:first-child{max-width:30%}
 .weather-screen .current p{font-size:28px;max-width:none}
 .weather-screen .current .muted{font-size:19px;max-width:none}
 .weather-screen .carport-reading{left:61%;right:22%}
 .weather-screen .carport-reading>span{font-size:16px}
 .weather-screen .carport-reading>strong{font-size:26px}
 .weather-screen .carport-reading>small{font-size:13px}
 .weather-screen .current .temperature,.legacy-browser .weather-screen .current .temperature{font-size:calc(var(--portal-height) * .105)}
 .weather-screen .hero-icon,.legacy-browser .weather-screen .hero-icon{width:calc(var(--portal-height) * .145);height:calc(var(--portal-height) * .145);left:46%;top:50%;transform:translate(-50%,-50%)}
 .weather-screen .hero-icon .weather-symbol{width:100%;height:100%}
}

/* Alte iPad-GPU: einfacher Klappwechsel statt perspektivischer 3D-Flächen. */
.legacy-browser .weather-screen .clock{filter:none}
.legacy-browser .clock-turn{perspective:none;text-shadow:none}
.legacy-browser .clock-leaf{background:#18283c;will-change:transform;transform-style:flat}
.legacy-browser .weather-screen[data-theme=day] .clock-leaf{background:#493723}
.legacy-browser .weather-screen[data-theme=dawn] .clock-leaf{background:#493346}
.legacy-browser .weather-screen[data-theme=dusk] .clock-leaf{background:#493023}
.legacy-browser .clock-old-top{animation:clock-simple-top .48s ease-in both}
.legacy-browser .clock-new-bottom{animation:clock-simple-bottom .48s ease-out both}
.legacy-browser .clock-old-bottom{animation:clock-old-bottom .48s linear both}
@keyframes clock-simple-top{0%{transform:scaleY(1)}49%,100%{transform:scaleY(0)}}
@keyframes clock-simple-bottom{0%,49%{transform:scaleY(0)}100%{transform:scaleY(1)}}
/* Ziffern und Beschriftung etwas tiefer, ohne Layoutsprung. */
.weather-screen .flip{padding-top:10px}

.weather-screen .flip>#seconds{position:absolute;right:14px;bottom:9px;display:block;font-size:20px;line-height:1;font-weight:500;letter-spacing:0;color:var(--clock-small);text-shadow:none;font-variant-numeric:tabular-nums}

/* Wetter links, Solar hochkant in der Mitte, lokale Werte und Temperatur rechts. */
.weather-screen .place-nav,.weather-screen.controls-hidden .place-nav{grid-template-columns:36px minmax(0,1fr) 36px;gap:9px}
.weather-screen.controls-hidden .place-nav{grid-template-columns:0 minmax(0,1fr) 0;gap:0}
.weather-screen .current{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr);gap:8px;padding:10px 16px}
.weather-screen .current>div:first-child{grid-column:1;align-self:end;max-width:none!important;z-index:1}
.weather-screen .current p{font-size:18px;max-width:none;margin:3px 0}
.weather-screen .current .muted{font-size:12px;max-width:none}
.weather-screen .current .hero-icon,.legacy-browser .weather-screen .current .hero-icon{position:absolute;left:18%;top:36%;transform:translate(-50%,-50%);width:100px;height:100px}
.weather-screen .current .hero-icon .weather-symbol{width:100%;height:100%}
.weather-screen .current .solar-glance{grid-column:2;grid-row:1;height:100%;width:100%;max-height:none;min-height:0;padding:8px!important;display:flex;flex-direction:column;justify-content:center;gap:5px;border-radius:10px;box-shadow:none;text-align:center;background:#ffffff0a}
.weather-screen .current .solar-glance strong{font-size:25px!important;line-height:1.05}
.weather-screen .current .solar-glance .solar-destination{font-size:11px;line-height:1.1;margin:3px 0 0}
.weather-screen .current .solar-glance>.glance-banks{gap:4px;align-items:center}
.weather-screen .current .solar-glance .glance-bank{gap:4px}
.weather-screen .current .solar-glance .bank-side{width:28px;font-size:11px}
.weather-screen .current .solar-glance .mini-battery{width:29px;height:14px;padding:1px}
.weather-screen .current .solar-glance .bank-percent{font-size:11px;min-width:28px}
.weather-screen .current .solar-glance>small{display:none}
.weather-screen .current .solar-glance:after{top:5px;right:5px;width:6px;height:6px}
.weather-screen .current .carport-reading{grid-column:3;grid-row:1;position:static;transform:none;min-width:0}
.weather-screen .current .temperature{grid-column:4;grid-row:1;justify-self:end}
@media(orientation:portrait) and (min-width:700px) and (min-height:1000px){
 .weather-screen .current p{font-size:25px}.weather-screen .current .muted{font-size:17px}
 .weather-screen .current .hero-icon,.legacy-browser .weather-screen .current .hero-icon{width:calc(var(--portal-height) * .11);height:calc(var(--portal-height) * .11)}
 .weather-screen .current .solar-glance strong{font-size:32px!important}
 .weather-screen .current .solar-glance .solar-destination{font-size:14px}
}
@media(max-width:600px){
 .weather-screen .current{padding:8px;gap:4px;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,.8fr)}
 .weather-screen .current .hero-icon,.legacy-browser .weather-screen .current .hero-icon{width:65px;height:65px;left:16%}
 .weather-screen .current p{font-size:14px}.weather-screen .current .muted{font-size:10px}
 .weather-screen .current .solar-glance{padding:5px!important}.weather-screen .current .solar-glance strong{font-size:20px!important}
 .weather-screen .current .carport-reading>strong{font-size:14px}.weather-screen .current .carport-reading>span{font-size:9px}
 .weather-screen .current .temperature,.legacy-browser .weather-screen .current .temperature{font-size:52px}
}

.weather-screen .current>div:first-child{align-self:center;max-width:50%!important}
.weather-screen .current .hero-icon,.legacy-browser .weather-screen .current .hero-icon{left:25%;top:45%}

/* Eigenes Raster statt absoluter Wolke über dem Wettertext. */
.weather-screen .current>div:first-child{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:1fr 1fr;column-gap:6px;align-self:stretch;max-width:none!important;min-width:0}
.weather-screen .current #description{grid-column:1;grid-row:1;align-self:end;overflow-wrap:break-word}
.weather-screen .current #feels{grid-column:1;grid-row:2;align-self:start}
.weather-screen .current .hero-icon,.legacy-browser .weather-screen .current .hero-icon{position:static;grid-column:2;grid-row:1/3;align-self:center;justify-self:center;transform:none;left:auto;top:auto;width:100px;height:100px;max-width:100%;max-height:100%}
.weather-screen .current .solar-glance,.weather-screen .current .solar-glance[data-state]{border:0!important;background:none;box-shadow:none;border-radius:0}
@media(orientation:portrait) and (min-width:700px) and (min-height:1000px){.weather-screen .current .hero-icon,.legacy-browser .weather-screen .current .hero-icon{width:140px;height:140px}}
@media(max-width:600px){.weather-screen .current>div:first-child{column-gap:2px}.weather-screen .current .hero-icon,.legacy-browser .weather-screen .current .hero-icon{width:58px;height:58px}}

.weather-screen .flip{padding-top:18px}
.weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:calc(var(--portal-height,100vh) * .182);font-size:clamp(54px,18.2dvh,224px)}
.legacy-browser .weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:var(--legacy-clock-size)}
@media(max-width:600px){.weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:27vw}}

/* Fremde Orte ohne lokale Energie-/Sensordaten erhalten die zentrale Wettergrafik. */
.weather-screen .current.without-local-readings{display:flex;justify-content:space-between}
.weather-screen .current.without-local-readings>div:first-child{display:block;align-self:center;max-width:32%!important}
.weather-screen .current.without-local-readings .hero-icon,.legacy-browser .weather-screen .current.without-local-readings .hero-icon{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:140px;height:140px;max-width:30%;max-height:95%}
@media(max-width:600px){.weather-screen .current.without-local-readings .hero-icon,.legacy-browser .weather-screen .current.without-local-readings .hero-icon{width:90px;height:90px}}

.weather-screen .place-nav .eyebrow{margin:6px 0 0}
@media(orientation:portrait) and (min-width:601px){
 .weather-screen .clock{width:94%}
 .weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:calc(var(--portal-height) * .195);font-size:clamp(54px,19.5dvh,240px)}
 .legacy-browser .weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:var(--legacy-clock-size)}
}
@media(orientation:portrait) and (min-height:700px){
 .weather-screen .weather-content{grid-template-rows:28fr 9fr 14fr 20fr 10fr 15fr 4fr}
 .weather-screen.controls-hidden .weather-content{grid-template-rows:28fr 9fr 15fr 21fr 11fr 16fr 0}
}
@media(orientation:landscape) and (max-height:850px){.weather-screen .flip>span:not(#synology-status):not(#seconds),.legacy-browser .weather-screen .flip>span:not(#synology-status):not(#seconds){font-size:calc(var(--portal-height) * .16)}}

.solar-card{scroll-snap-align:start;scroll-margin-top:12px}

.weather-screen .clock{position:relative;top:14px}

/* Safari 12: Blockfluss ohne Flex-/Grid-Reste im Solar-Knopf. */
.weather-screen .current .solar-glance{display:block;height:auto;max-height:100%;min-width:0;padding:5px!important;align-self:center;line-height:1.15}
.weather-screen .current .solar-glance>strong{display:block;position:static;width:100%;margin:0;font-size:27px!important;line-height:1.1;white-space:nowrap}
.weather-screen .current .solar-glance .solar-watts{display:inline;white-space:nowrap}
.weather-screen .current .solar-glance .solar-destination{display:block;font-size:12px;line-height:1.2;margin:3px 0 0}
.weather-screen .current .solar-glance>.glance-banks{display:block;position:static;width:100%;margin:7px 0 0;line-height:18px}
.weather-screen .current .solar-glance .glance-bank{display:block;position:static;white-space:nowrap;margin:2px 0;line-height:18px}
.weather-screen .current .solar-glance .bank-side{display:inline-block;vertical-align:middle;width:28px;font-size:11px;margin:0}
.weather-screen .current .solar-glance .mini-battery{display:inline-block;vertical-align:middle;margin:0 5px 0 0;width:29px;height:14px}
.weather-screen .current .solar-glance .bank-percent{display:inline-block;vertical-align:middle;font-size:11px;min-width:0;width:27px;margin:0}
.weather-screen .current .solar-glance[data-state]:after{display:none}
.weather-screen .current .solar-glance[data-state] .solar-watts:before{content:'';display:inline-block!important;width:6px;height:6px;margin:0 5px 0 0;border-radius:50%;vertical-align:middle;background:var(--connection-color)}
.clock-turn.clock-glide{perspective:none;overflow:hidden;text-shadow:none;line-height:1}
.clock-glide>span{position:absolute;top:0;left:0;right:0;display:block;font:inherit;line-height:1;letter-spacing:inherit;color:inherit;text-shadow:none;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.clock-slide-old{animation:clock-glide-out .65s cubic-bezier(.22,.61,.36,1) both}
.clock-slide-new{animation:clock-glide-in .65s cubic-bezier(.22,.61,.36,1) both}
@keyframes clock-glide-out{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-100%,0)}}
@keyframes clock-glide-in{from{transform:translate3d(0,100%,0)}to{transform:translate3d(0,0,0)}}
@media(max-width:600px){.weather-screen .current .solar-glance>strong{font-size:19px!important}.weather-screen .current .solar-glance .solar-destination{font-size:10px}.weather-screen .current .solar-glance .bank-side{width:22px;font-size:9px}.weather-screen .current .solar-glance .mini-battery{width:22px;margin-right:4px}.weather-screen .current .solar-glance .bank-percent{width:22px;font-size:9px}}

/* Nur das iPad mit iOS 12 gleitet; andere Geräte behalten die Klappuhr. */
.clock-turn.clock-flip{perspective:700px}
.clock-flip .clock-leaf{background:var(--clock-face);transform-style:preserve-3d}
.clock-flip .clock-old-top{animation:clock-turn-top .64s ease-in both}
.clock-flip .clock-new-bottom{animation:clock-turn-bottom .64s ease-out both}
.clock-flip .clock-old-bottom{animation:clock-old-bottom .64s linear both}

.battery-state{display:block;margin-top:5px;padding:3px 7px;border-radius:7px;background:#36505b;color:#d8edf2;font-size:11px;line-height:1.25;max-width:150px;text-align:center;white-space:normal}.battery-state[data-tone=warning]{background:#5b4525;color:#ffdc98;border:1px solid #c39c54}.battery-state-note{font-size:12px;line-height:1.45;color:#bed1d8;margin:8px 0 14px}

.sonoff-test-controls{margin-top:16px;padding-top:12px;border-top:1px solid #49616d}.sonoff-test-controls summary{cursor:pointer;font-weight:600;padding:8px 0}.sonoff-test-controls>p{font-size:13px;line-height:1.4}.sonoff-test-controls button{min-height:48px}

.sonoff-identify-match{margin:12px 0;padding:14px;border:1px solid #6a9390;border-radius:10px;background:#203f46}.sonoff-identify-match p{line-height:1.4}

.sonoff-filters,.sonoff-organization-grid{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin:14px 0}.sonoff-filters label{flex:1 1 160px;margin:0}.sonoff-filters select{width:100%;min-height:42px;background:#142e3a;color:#e3f1f5;border:1px solid #78939f;border-radius:7px;padding:8px}.sonoff-organization-grid>div{flex:1 1 260px;min-width:0}.sonoff-catalog-row{margin:12px 0;padding:10px;border:1px solid #49616d;border-radius:8px}.sonoff-organization-label{font-size:12px;color:#bed5d8;margin:6px 0}.sonoff-filters button{min-height:42px}

.sonoff-settings-panel>summary{font-size:18px;font-weight:600;cursor:pointer;padding:6px 0}.sonoff-settings-panel[open]>summary{margin-bottom:18px}.sonoff-settings-panel #sonoff-names-form{margin:0}.sonoff-assignment-tags,.sonoff-display-tags{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 16px}.sonoff-tag{display:inline-block;padding:7px 12px;border:1px solid #78939f;border-radius:20px;background:#18323e;color:#d9edf2;font-size:13px;line-height:1.4;margin:3px}.sonoff-assignment-tags button[aria-pressed=true]{background:#b9e8f6;color:#102b35;border-color:#b9e8f6}.sonoff-assignment-tags button[aria-pressed=true]:before{content:"✓ ";}.sonoff-display-tags .group-tag{border-color:#c3a86c;color:#f3dca4}.sonoff-device-tag-field>p{margin:12px 0 4px;font-size:13px}.sonoff-catalog-row .tag-delete{margin-left:8px;color:#ffd5d5;border-color:#b77b7b}

.settings-product{margin:18px 0;border:1px solid #46616d;border-radius:12px;background:rgba(27,51,63,.6)}
.settings-product>summary{cursor:pointer;font-size:21px;font-weight:600;padding:18px}
.settings-product-content{padding:0 14px 4px}
.settings-product-content>.settings-card,.settings-product-content>.control-card{margin-top:0;margin-bottom:14px}

.sonoff-organization-grid{align-items:flex-start}.sonoff-catalog-row{margin:7px 0;padding:0;background:#18323e}.sonoff-catalog-row>summary{cursor:pointer;padding:11px 12px;font-size:16px;font-weight:600;color:#edf8fc}.sonoff-catalog-row>summary span{float:right;font-size:12px;font-weight:400;color:#b9d7e2;margin-left:12px}.sonoff-catalog-row[open]{padding-bottom:10px}.sonoff-catalog-row>label{margin:10px 12px}.sonoff-catalog-row>button{margin-left:12px}.sonoff-organization-grid>div>button{margin-bottom:12px}#sonoff-name-fields legend{font-size:22px;font-weight:700;line-height:1.4;color:#f2fbff;background:#284c5d;border:1px solid #7396a5;border-radius:8px;padding:9px 14px;max-width:100%;box-sizing:border-box}#sonoff-name-fields fieldset{border-color:#789cab;background:rgba(14,35,46,.35)}

.sonoff-settings-panel>.settings-card{margin:0;padding:0;border:0;background:transparent;box-shadow:none}

#program-dialog{width:min(680px,94vw);max-height:92vh;overflow:auto;box-sizing:border-box;padding:20px;border:1px solid #7699a8;border-radius:14px;background:#18323e;color:#eaf6fb}#program-dialog::backdrop{background:rgba(0,0,0,.65)}.program-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.program-header h2{font-size:23px;line-height:1.3}.program-header button{min-height:48px}#program-help{font-size:15px;line-height:1.6;color:#c3dbe5}.program-favorite{border:1px solid #7496a6;border-radius:12px;margin:18px 0;padding:16px}.program-favorite legend{font-size:21px;font-weight:700;padding:0 8px}.program-favorite label{display:block;font-size:17px;margin:12px 0}.program-favorite input:not([type=checkbox]),.program-favorite select{display:block;width:100%;min-height:48px;box-sizing:border-box;font-size:19px;padding:8px;color:#eaf6fb;background:#102b37;border:1px solid #829eaa;border-radius:7px;margin-top:7px}.program-favorite .program-enable{display:flex;align-items:center;gap:12px;padding:12px;background:#274e5d;border-radius:8px;font-size:19px;font-weight:600}.program-enable input{width:26px;height:26px;flex-shrink:0}.program-times{display:flex;flex-wrap:wrap;gap:16px}.program-times label{flex:1 1 210px}.program-days,.program-day-shortcuts{display:flex;flex-wrap:wrap;gap:8px}.program-days label{padding:10px 8px;background:#264957;border-radius:7px;display:flex;align-items:center;gap:6px;min-height:30px}.program-days input{width:23px;height:23px}.program-day-shortcuts button{min-height:44px}.program-days-title{font-size:18px;font-weight:600}.program-overview{border-top:1px solid #496774;margin-top:14px;padding-top:10px;font-size:14px;line-height:1.5}.program-overview p{margin:5px 0}.program-open{font-size:17px;min-height:48px;margin-top:8px}.program-active{color:#8de2af}.program-soon{color:#ffdc82}.program-error{color:#ffabab}#program-save{min-height:52px;width:100%;font-size:20px}#program-result{line-height:1.5;font-size:17px}

/* Channel-local time plans, with touch targets retained for iOS 12. */
.sonoff-switch-buttons.has-program,.roller-buttons.has-program{display:flex;gap:10px;align-items:stretch;margin:12px 0 6px}
.sonoff-switch-buttons.has-program>.sonoff-switch-button{flex:1 1 0;min-width:0;min-height:64px;font-size:21px;padding:12px 8px}
.roller-buttons.has-program>.cover-command-button{flex:1 1 0;min-width:0;font-size:21px;padding:10px 6px}
.has-program>.program-channel-button{flex:0 0 88px;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:64px;padding:5px;border:1px solid #6a94a5;border-radius:11px;background:#203e4d;color:#d6eef8;font-size:12px;font-weight:600;cursor:pointer}
.has-program>.program-channel-button[data-active=true]{border-color:#6ee2af;background:#1c5149;color:#c5ffe4}
.program-clock{display:block;width:27px;height:27px}.program-clock svg{display:block;width:100%;height:100%}.program-channel-button small{font-size:10px}
.program-overview{border:0;padding:0;margin:3px 0 12px;font-size:13px}.program-overview p{margin:3px 0}.program-overview[hidden]{display:none}
#program-dialog{width:680px;max-width:calc(100vw - 24px);max-height:94vh;overflow:auto;padding:0;background:#142b38;color:#e8f5fb;border:1px solid #5a8195;border-radius:22px;box-shadow:0 24px 100px #0009}
.program-header{position:sticky;top:0;z-index:3;display:flex;align-items:center;justify-content:space-between;padding:18px 22px;background:#1b3949;border-bottom:1px solid #426171}
#program-device-name{font-size:10px;letter-spacing:1.5px;font-weight:700;text-transform:uppercase;color:#90b8ce;margin:0 0 5px}.program-header h2{font-size:25px;margin:0;line-height:1.25}.program-header button{min-height:44px;flex-shrink:0;border-radius:12px}
.program-intro{font-size:15px;margin:16px 22px;color:#b3cfde}
#program-favorite-tabs{display:flex;gap:10px;margin:0 22px 14px}.program-favorite-tab{display:flex;align-items:center;gap:9px;flex:1 1 0;min-width:0;min-height:64px;padding:10px 12px;background:#1b3545;border:1px solid #49697b;border-radius:14px;color:#b9d2e0;text-align:left;cursor:pointer}.program-favorite-tab[aria-selected=true]{background:#264e63;border:2px solid #9adbf6;color:#f0fbff;padding:9px 11px}.program-tab-number{font-size:25px;color:#91bed5}.program-tab-name{font-size:17px;font-weight:650;flex:1;overflow-wrap:break-word;min-width:0}.program-favorite-tab small{font-size:11px;white-space:nowrap}
#program-fields{padding:0 22px}.program-favorite{margin:0;padding:0;border:0}.program-favorite[hidden]{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.program-favorite .program-enable{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:58px;padding:0 16px;margin:0 0 14px;border:1px solid #4d7183;border-radius:14px;background:#1d3b4c;font-size:18px}.program-enable input.program-enabled{position:absolute;right:16px;top:14px;width:52px;height:30px;opacity:0;margin:0;z-index:1;cursor:pointer}.program-toggle-track{display:block;width:52px;height:30px;flex-shrink:0;border-radius:20px;background:#527080;box-shadow:inset 0 0 0 1px #7793a1}.program-toggle-track:after{content:'';display:block;width:24px;height:24px;border-radius:50%;background:#d8e8ef;margin:3px;transition:transform .15s}.program-enabled:checked+.program-toggle-track{background:#2c9775;box-shadow:inset 0 0 0 1px #73d7b4}.program-enabled:checked+.program-toggle-track:after{transform:translateX(22px);background:#fff}.program-enabled:focus+.program-toggle-track{outline:3px solid #ffdf8d;outline-offset:3px}.program-favorite[data-enabled=true] .program-enable{background:#1c4c44;border-color:#4dba95}
.program-favorite .program-name-label{font-size:12px;color:#9ab7c8;margin:0 0 14px}.program-favorite input.program-name{min-height:42px;margin-top:4px;font-size:17px;background:#173140;border-color:#3e5b6c;border-radius:9px;padding:6px 12px}
.program-times{display:flex;flex-wrap:nowrap;gap:12px;margin:0 0 20px}.program-times label.program-time-card{display:flex;flex:1 1 0;min-width:0;flex-direction:column;align-items:center;box-sizing:border-box;margin:0;padding:14px 8px 16px;border:1px solid #538c85;border-radius:18px;background:linear-gradient(145deg,#245853,#193e43);color:#b5f1d6}.program-times label.program-time-end{background:linear-gradient(145deg,#414563,#26394e);border-color:#6d799b;color:#d9d8fb}.program-action-icon{font-size:29px;line-height:1.1;margin-bottom:5px}.program-action-title{font-size:15px;font-weight:600}.program-favorite .program-time-card input{font-size:36px;font-weight:600;text-align:center;width:100%;max-width:220px;min-width:0;min-height:58px;margin:6px 0 0;padding:4px;border:0;background:transparent;color:#f2fbff;box-shadow:none;border-radius:7px}.program-time-card input:focus{outline:2px solid #b5e6fa}.program-time-card input::-webkit-calendar-picker-indicator{width:16px;opacity:.7}
.program-days-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:16px}.program-days-heading>span{font-size:12px;color:#9ab7c8}.program-days{display:flex;flex-wrap:nowrap;gap:6px;justify-content:space-between}.program-days .program-day{position:relative;display:block;flex:1 1 0;margin:0;min-width:0;padding:0;background:none}.program-day input{position:absolute;opacity:0;margin:0;top:0;left:0;width:100%;height:100%;z-index:1;cursor:pointer}.program-day>span{display:flex;justify-content:center;align-items:center;min-height:48px;box-sizing:border-box;border:1px solid #57788c;border-radius:12px;font-size:16px;font-weight:600;background:#203b4c;color:#a8c6d8}.program-day input:checked+span{background:#b6e3f7;border-color:#b6e3f7;color:#122c3b;box-shadow:inset 0 -4px 0 #73bedf}.program-day input:focus+span{outline:3px solid #ffdf8d;outline-offset:2px}.program-day-shortcuts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.program-day-preset{min-height:40px;padding:6px 12px;border:1px solid #416174;border-radius:20px;background:transparent;color:#b4cfdf;font-size:13px;cursor:pointer}.program-preview{font-size:13px;color:#c9dfea;line-height:1.6;border-top:1px solid #365466;margin:16px 0 0;padding-top:12px}
.program-info{margin:12px 22px;color:#94b3c5;font-size:12px;line-height:1.6}.program-info>summary{cursor:pointer;padding:6px 0}.program-info p{margin-top:4px}.program-footer{position:sticky;bottom:0;z-index:2;padding:10px 22px 16px;background:#142b38;border-top:1px solid #36576b}#program-result{font-size:13px;margin:0 0 8px;line-height:1.4;color:#c3dbe8}#program-save{min-height:50px;width:100%;border-radius:13px;background:#b9e8fa;color:#103043;font-size:19px;font-weight:700}
@media(max-width:480px){.has-program>.program-channel-button{flex-basis:68px}.sonoff-switch-buttons.has-program,.roller-buttons.has-program{gap:6px}.sonoff-switch-buttons.has-program>.sonoff-switch-button,.roller-buttons.has-program>.cover-command-button{font-size:16px;min-height:60px;padding:8px 4px}.program-channel-button .program-clock{width:24px;height:24px}.has-program>.program-channel-button{font-size:11px;min-height:60px}.sonoff-button-feedback{font-size:8px}.program-header{padding:14px}.program-header h2{font-size:21px}.program-intro{margin:12px 14px;font-size:13px}#program-favorite-tabs{margin:0 14px 12px;gap:7px}.program-favorite-tab{padding:8px;gap:5px}.program-favorite-tab[aria-selected=true]{padding:7px}.program-tab-number{font-size:21px}.program-tab-name{font-size:15px}.program-favorite-tab small{font-size:10px}#program-fields{padding:0 14px}.program-favorite .program-enable{font-size:16px;padding:0 12px}.program-times{gap:8px}.program-favorite .program-time-card input{font-size:28px}.program-action-title{font-size:13px}.program-days{gap:4px}.program-day>span{font-size:14px;border-radius:9px}.program-footer{padding:10px 14px 14px}.program-info{margin:10px 14px}}

/* Use margins as well on Safari 12, which has no flex-gap support. */
.sonoff-switch-buttons.has-program,.roller-buttons.has-program{gap:0}.has-program>button+button{margin-left:10px}.program-times{gap:0}.program-times>label+label{margin-left:12px}#program-favorite-tabs{gap:0}.program-favorite-tab+.program-favorite-tab{margin-left:10px}.program-days{gap:0}.program-day+.program-day{margin-left:6px}.program-day-shortcuts{gap:0}.program-day-preset{margin-right:8px;margin-bottom:4px}.program-header>button{margin-left:12px}@media(max-width:480px){.has-program>button+button{margin-left:6px}.program-times>label+label{margin-left:8px}.program-favorite-tab+.program-favorite-tab{margin-left:7px}.program-day+.program-day{margin-left:4px}}

.program-times label.program-time-card+label.program-time-card{margin-left:12px}
@media(max-width:480px){.program-times label.program-time-card+label.program-time-card{margin-left:8px}}
@media(max-height:800px){.program-header{padding-top:12px;padding-bottom:12px}.program-intro{margin-top:10px;margin-bottom:10px}#program-favorite-tabs{margin-bottom:10px}.program-favorite-tab{min-height:48px}.program-favorite .program-enable{min-height:46px;margin-bottom:10px}.program-enable input.program-enabled{top:8px}.program-favorite .program-name-label{margin-bottom:10px}.program-favorite input.program-name{min-height:36px}.program-times{margin-bottom:12px}.program-times label.program-time-card{padding-top:8px;padding-bottom:8px}.program-action-icon{font-size:22px;margin-bottom:2px}.program-favorite .program-time-card input{min-height:40px;font-size:30px;margin-top:2px}.program-days-heading{margin-bottom:7px}.program-day>span{min-height:44px}.program-day-shortcuts{margin-top:6px}.program-day-preset{min-height:34px}.program-preview{margin-top:10px;padding-top:8px}.program-info{margin-top:6px;margin-bottom:6px}.program-footer{padding-top:8px;padding-bottom:10px}#program-result{font-size:12px;margin-bottom:6px}#program-save{min-height:46px}}
@media(max-width:480px){.program-favorite-tab{display:block;min-height:62px}.program-tab-number{display:none}.program-tab-name{display:block;font-size:15px}.program-favorite-tab small{display:block;margin-top:3px}}
.program-quick-favorites{display:flex;flex-wrap:wrap;margin:10px 0 6px}.program-quick-favorite{display:flex;align-items:center;justify-content:center;flex:1 1 150px;min-width:0;min-height:46px;margin:0 8px 6px 0;padding:8px 12px;border:1px solid #58788a;border-radius:12px;background:#203b4b;color:#bdd4df;cursor:pointer;font-size:14px}.program-quick-favorite:last-child{margin-right:0}.program-quick-favorite>span{font-size:20px;margin-right:8px}.program-quick-favorite>strong{overflow-wrap:break-word}.program-quick-favorite>small{margin-left:auto;padding-left:10px;font-size:12px}.program-quick-favorite[aria-pressed=true]{border-color:#66d6a7;background:#1d5448;color:#dbffec}.program-quick-favorite:disabled{opacity:.55}.program-quick-favorite:focus{outline:3px solid #ffdf8d;outline-offset:2px}

.program-quick-favorite{align-items:flex-start;text-align:left}.program-quick-favorite>span.program-quick-copy{display:block;flex:1 1 0;min-width:0;margin:0;font-size:14px;line-height:1.5}.program-quick-copy>strong{display:block;overflow-wrap:break-word}.program-quick-copy>span{display:block;font-size:11px;font-weight:400;line-height:1.6;overflow-wrap:break-word}.program-quick-check{padding-top:1px}.program-quick-favorite>small{margin-left:8px;padding-left:0;padding-top:2px}

.program-favorite .program-time-card select{font-size:14px;min-height:40px;padding:5px;background:#102b3770;border-color:#729799;border-radius:9px;color:#effbff;margin-top:7px}.program-time-card input[hidden],.program-time-card select[hidden],.program-solar-location[hidden]{display:none}.program-solar-location{font-size:12px;color:#f0dca5;line-height:1.5;margin:-8px 0 14px}@media(max-width:480px){.program-favorite .program-time-card select{font-size:12px;padding:4px}}

#fewo-card{grid-column:1 / -1}#shelly-devices button[aria-pressed="true"].on{background:#19664e}#shelly-devices button[aria-pressed="true"].off{background:#963c43}#shelly-found button{margin:8px 8px 8px 0}

.heating-standard,.heating-summary{padding:16px;border:1px solid #6e9da8;border-radius:12px;background:#20414c;margin:12px 0}.heating-standard>span,.heating-standard>small{display:block;margin-top:8px}.heating-times{display:flex}.heating-times>label{flex:1;margin-right:12px}.heating-settings{margin-bottom:24px}.heating-settings summary{padding:14px;cursor:pointer}.heating-settings input[type=checkbox]{width:22px;height:22px;vertical-align:middle}.heating-summary strong{font-size:20px;line-height:1.5}

.heating-permission{display:block;padding:10px 12px;border-radius:8px;background:#17353f}.heating-permission[data-state=connected]{background:#19634f}.heating-permission[data-state=disconnected]{background:#753841}.heating-countdowns{display:flex;margin:18px 0}.heating-countdowns>div{flex:1;padding:12px;background:#17313d;border-radius:10px}.heating-countdowns>div+div{margin-left:12px}.heating-countdowns small,.heating-countdowns strong{display:block}.heating-countdowns strong{font-size:28px;margin-top:6px}.heating-gate-buttons{margin-bottom:0}@media(max-width:480px){.heating-countdowns strong{font-size:22px}.heating-gate-buttons button{font-size:18px;padding:10px 6px}}

/* Compact Shelly overview, also for Safari 12. */
.fewo-panel{padding:0;overflow:hidden}.fewo-panel>summary{list-style:none;cursor:pointer;padding:22px 24px;display:flex;align-items:center;justify-content:space-between}.fewo-panel>summary::-webkit-details-marker,.shelly-device>summary::-webkit-details-marker{display:none}.fewo-title{display:flex;align-items:center}.fewo-house{font-size:34px;color:#a8dce8;margin-right:14px}.fewo-title strong{display:block;font-size:23px}.fewo-title small{display:block;margin-top:4px;color:#b8ccd4}.fewo-heading:after{content:'⌄';margin-left:16px;font-size:24px;color:#bcd7df}.fewo-panel[open]>.fewo-heading:after{content:'⌃'}.fewo-content{padding:0 20px 20px}.shelly-device{padding:0;margin:10px 0;border:1px solid #45636f;border-radius:14px;overflow:hidden;background:#19313c}.shelly-device-heading{list-style:none;display:flex;align-items:center;cursor:pointer;padding:18px 16px}.shelly-device-heading>strong{flex:1;min-width:0;font-size:18px;line-height:1.35}.shelly-device-heading:after{content:'⌄';font-size:23px;margin-left:12px;color:#bcd7df}.shelly-device[open]>.shelly-device-heading:after{content:'⌃'}.shelly-icon{display:inline-block;width:25px;height:25px;vertical-align:middle;flex-shrink:0;margin-right:10px;color:#a7dce6}.shelly-icon svg{width:100%;height:100%;display:block}.shelly-local-status,.shelly-paired-status{font-size:12px;white-space:nowrap;padding:6px 9px;border-radius:20px;background:#102a34;margin-left:12px;color:#d0e5e9}.shelly-local-status:before{content:'';display:inline-block;width:9px;height:9px;background:#ee777b;border-radius:50%;margin-right:7px}.shelly-local-status[data-online=true]:before{background:#69e1ad;box-shadow:0 0 7px #69e1ad55}.shelly-paired-status{color:#f0d795}.shelly-device .heating-summary{margin:0 14px 14px;padding:16px;background:transparent;border:0;border-top:1px solid #42616d;border-radius:0}.heating-permission{font-size:15px!important;padding:7px 11px;display:inline-block;background:#203f48}.heating-permission[data-state=connected]{background:#1a5143;color:#a9f1ce}.heating-running{display:flex;align-items:center;font-size:16px;line-height:1.5;margin:14px 0}.heating-countdowns{margin:12px 0}.heating-countdowns>div{position:relative;background:#112a35;padding:12px 14px}.heating-countdowns .shelly-icon{float:right;width:23px;height:23px;margin:0 0 5px 6px;opacity:.8}.heating-countdowns strong{font-size:30px!important;line-height:1.2}.heating-countdowns small{font-size:13px;color:#bdd0d8}.heating-gate-buttons>button{font-size:18px;min-height:54px;border-width:1px}.heating-gate-buttons>button+button{margin-left:12px}.heating-gate-buttons .shelly-icon{width:21px;height:21px}.heating-manage-link{display:flex!important;align-items:center;justify-content:center;margin:0 30px 16px;padding:12px!important;color:#c5e7ef!important;text-decoration:none!important;font-size:14px}.heating-summary>.card-note:empty{display:none}.heating-summary>.card-note{margin:9px 0 0;min-height:0}.shelly-remote-body{padding:0 18px 16px;font-size:15px}.heating-settings,.shelly-settings-devices{border:1px solid #45636f;border-radius:12px;margin:12px 0;overflow:hidden}.heating-settings-content{padding:0 16px 16px}.heating-settings>summary,.shelly-settings-devices>summary{padding:16px;font-size:17px;font-weight:bold;cursor:pointer}.shelly-settings-devices>p,.shelly-settings-devices>form,.shelly-settings-devices>div,.shelly-settings-devices>button{margin:12px 16px}.heating-standard{background:#16323e}.heating-standard>strong{font-size:18px}
@media(max-width:600px){.fewo-panel>summary{padding:17px 14px}.fewo-title strong{font-size:20px}.fewo-title small{font-size:11px}.fewo-house{font-size:28px;margin-right:9px}.fewo-content{padding:0 9px 10px}.fewo-heading .pill{font-size:10px;max-width:100px;white-space:normal}.shelly-device-heading{flex-wrap:wrap;padding:15px 12px}.shelly-device-heading>strong{font-size:17px}.shelly-local-status,.shelly-paired-status{font-size:10px;margin-left:6px;padding:5px 7px}.shelly-device-heading>.shelly-icon{width:23px;height:23px;margin-right:8px}.shelly-device .heating-summary{padding:12px 4px;margin:0 10px 12px}.heating-countdowns strong{font-size:26px!important}.heating-countdowns small{font-size:11px}.heating-countdowns>div{padding:11px}.heating-gate-buttons>button{font-size:16px;min-height:52px}.heating-manage-link{margin:0 14px 14px}}

.heating-history{margin:0 16px 14px;border-top:1px solid #45636f}.heating-history>summary{padding:14px 4px;cursor:pointer;color:#c5e7ef;font-weight:600}.heating-history-body{padding:0 4px 12px}.heating-cost-grid{display:flex;flex-wrap:wrap;margin:12px -4px}.heating-cost-card{box-sizing:border-box;width:calc(50% - 8px);margin:4px;padding:12px;background:#112a35;border-radius:10px}.heating-cost-card strong,.heating-cost-card small,.heating-cost-card>span:not(.shelly-icon){display:block}.heating-cost-card strong{font-size:25px;margin:7px 0}.heating-cost-card>span:not(.shelly-icon){font-size:12px;color:#bed1d8}.heating-cost-card .shelly-icon{float:right;width:20px;height:20px;margin:0}.heating-event{display:flex;align-items:center;border-top:1px solid #45636f;padding:12px 0;font-size:13px}.heating-event>span:not(.shelly-icon){flex:1}.heating-event strong{margin-left:10px}

.shelly-registry-card{border:1px solid #45636f;background:#18313d;border-radius:12px;margin:10px 0;overflow:hidden}.shelly-registry-card>summary::-webkit-details-marker{display:none}.shelly-metadata{display:grid;grid-template-columns:145px minmax(0,1fr);padding:0 16px 12px;margin:0;line-height:1.5;font-size:14px}.shelly-metadata dt{color:#acc8d2;padding:7px 12px 7px 0}.shelly-metadata dd{margin:0;padding:7px 0;overflow-wrap:break-word;word-break:break-word}.shelly-registry-card>button{margin:0 16px 16px}.shelly-settings-devices form{display:block!important;margin:16px!important;padding:16px;background:#193a46;border-radius:12px}.shelly-settings-devices form label{display:block;margin-bottom:14px;font-size:14px}.shelly-settings-devices form input{display:block;box-sizing:border-box;width:100%;margin-top:7px;padding:12px;border:1px solid #7696a2;border-radius:8px;background:#112b37;color:#f4fbff;font-size:16px}.shelly-settings-devices form button{width:100%;padding:14px}@media(max-width:480px){.shelly-metadata{grid-template-columns:1fr}.shelly-metadata dt{padding-bottom:0}.shelly-metadata dd{padding-top:2px;padding-bottom:10px}.shelly-registry-card .shelly-device-heading{flex-wrap:wrap}}

.heating-routine-dialog{width:600px;max-width:calc(100% - 24px);max-height:90vh;padding:0;border:1px solid #81acb9;border-radius:16px;background:#183440;color:#f2fbff;overflow:auto}.heating-routine-body{padding:18px}.heating-routine-form label{display:block;margin-bottom:16px;font-size:16px}.heating-routine-form input:not([type=checkbox]),.heating-routine-form select{display:block;box-sizing:border-box;width:100%;padding:12px;margin-top:7px;font-size:17px;background:#102b37;color:#f2fbff;border:1px solid #81acb9;border-radius:9px}.heating-routine-form input[type=checkbox]{width:22px;height:22px;vertical-align:middle;margin-right:10px}.heating-routine-form summary,.heating-event-log>summary{padding:14px 4px;cursor:pointer;font-weight:600}.heating-routine-form button{width:100%;padding:14px;margin-top:14px}.heating-routine-slot{border-top:1px solid #45636f;padding-top:16px}.heating-event small{display:block;margin-top:4px;color:#b7cdd5}.heating-manage-link{box-sizing:border-box;width:calc(100% - 60px)}

.heating-event-log select{width:100%;max-width:30rem;min-height:46px;padding:10px 12px;margin:14px 0;border:1px solid #789aa8;border-radius:9px;background:#17323e;color:#eef7fb;font:inherit;}

.heating-logo[data-on=true],.shelly-device[data-heating-on=true]>.shelly-device-heading>.shelly-icon{color:#ffab45;opacity:1}
.shelly-device[data-heating-on=false]>.shelly-device-heading>.shelly-icon{position:relative}
.shelly-device[data-heating-on=false]>.shelly-device-heading>.shelly-icon:after{content:'';position:absolute;left:0;top:48%;width:100%;height:2px;background:currentColor;transform:rotate(45deg)}

.portal-network-status{display:block;margin:4px 0 0 12px;font:inherit;font-size:1em;line-height:1.2;color:inherit}.portal-network-status:before{content:'';display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:#69e1ad}.portal-network-status[data-online=false]:before{background:#ee777b}

.public-address a{color:#bce8f6;overflow-wrap:break-word;word-break:break-all}.portal-registration-code{overflow-wrap:break-word;word-break:break-all;background:#102b35;padding:12px;border:1px solid #e6c56f;border-radius:8px}

#portal-access-enabled{display:inline-block;width:24px;min-height:24px;height:24px;margin:0 10px 0 0;vertical-align:middle}#portal-access-form>.primary-button{margin-top:20px}#portal-access-devices button{margin:8px 8px 0 0}

.portal-short-code{display:block;font-size:36px;letter-spacing:6px;margin:12px 0;color:#f3dfae}.portal-registration-code a{display:inline-block;text-decoration:none;color:#d9f3ff;margin:8px 8px 0 0}

#portal-access-status,.access-save-result:not(:empty){padding:12px 16px;border:1px solid #d8b45d;border-radius:9px;background:#443b23;color:#ffe4a1;font-weight:bold}#portal-access-status[data-saved=true],.access-save-result[data-saved=true]{border-color:#61cfa5;background:#194e40;color:#b9f6dc}

.access-browser-card>summary{display:flex;align-items:center;justify-content:space-between;cursor:pointer;list-style:none;min-height:48px}.access-browser-card>summary:before{content:'▸';margin-right:10px}.access-browser-card[open]>summary:before{content:'▾'}.access-browser-card>summary::-webkit-details-marker{display:none}.access-device-badge{font-size:14px;border-radius:12px;background:#314c59;padding:6px 10px;margin-left:12px}.access-browser-card[data-access-state=approved] .access-device-badge{background:#195c46;color:#baf5d9}.access-browser-card[data-access-state=blocked] .access-device-badge{background:#7a343c;color:#ffe3e5}.access-browser-card[data-access-state=pending] .access-device-badge{background:#655023;color:#ffebac}.access-device-info{border-top:1px solid #55717e;margin-top:15px;padding-top:8px}.access-device-info p{word-break:break-word;line-height:1.5}.access-device-actions{display:flex;flex-wrap:wrap;align-items:center}.access-device-actions select{max-width:220px}.access-browser-card{padding:18px!important}.portal-registration-code input{margin:16px 0}

.access-browser-list>summary{cursor:pointer;font-size:18px;font-weight:bold;padding:16px;border:1px solid #668594;border-radius:10px;margin-top:16px}.access-approval-note{background:#19583f;color:#bdf5d9;padding:12px 14px;border:1px solid #60c99b;border-radius:9px;font-weight:bold}.access-cookie-info{margin:15px 0;color:#b8ccd5}.access-device-actions{gap:8px}.access-device-actions button{margin:0!important}

.access-block-panel{margin-top:14px;padding:16px;border:1px solid #8eabba;border-radius:12px;background:#17313e}.access-block-panel>strong{display:block;font-size:18px}.access-block-panel label{display:block;margin:14px 0}.access-block-panel select{display:block;margin-top:8px;min-height:44px;max-width:100%}.access-block-panel p{margin:10px 0}