diff --git a/assets/css/header.css b/assets/css/header.css
index a28bd1b..4f40b34 100644
--- a/assets/css/header.css
+++ b/assets/css/header.css
@@ -284,7 +284,7 @@
/* Fixed-width label prevents the bar from shifting when text swaps */
.scope-play-label {
display: inline-block;
- min-width: 58px;
+ min-width: 64px;
font-family: 'JetBrains Mono', ui-monospace, monospace;
font-variant-numeric: tabular-nums;
}
diff --git a/assets/css/table.css b/assets/css/table.css
index 04c7a91..4dc5a92 100644
--- a/assets/css/table.css
+++ b/assets/css/table.css
@@ -338,6 +338,11 @@
color: #6a4c1a;
transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}
+@media (min-width: 1024px) {
+ .floating-profile-btn {
+ display: none;
+ }
+}
.floating-profile-btn:hover { background: #fff; border-color: #c8922a; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.14); }
.floating-profile-btn.is-open { background: #fff; border-color: #c8922a; }
.floating-profile-icon { font-size: 16px; line-height: 1; flex: none; }
@@ -470,6 +475,23 @@
cursor: pointer;
transition: filter 0.15s, border-color 0.15s;
}
+/* Remove alpha from the default fallback color and any potential inherited
+ semi-transparent backgrounds while keeping the hue. */
+.active-profile-row:not([style*="background"]) {
+ background-color: #fdf8ee;
+}
+@media (min-width: 1024px) {
+ .active-profile-row {
+ position: sticky;
+ top: 0 !important; /* Stick to the very top of the viewport */
+ z-index: 11;
+ }
+ .utci-thead-sticky {
+ position: sticky;
+ top: 28px !important; /* Corrected to match the height of the active-profile-row + margins */
+ z-index: 10;
+ }
+}
.active-profile-row:hover,
.active-profile-row:focus-visible {
filter: brightness(1.06);
diff --git a/assets/css/ui.css b/assets/css/ui.css
index bb5bc13..9d89938 100644
--- a/assets/css/ui.css
+++ b/assets/css/ui.css
@@ -1392,14 +1392,17 @@
.utci-footer {
margin-top: 36px;
- padding-top: 20px;
+ padding: 10px 0;
font-family: Manrope, sans-serif;
font-size: 10px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.07em;
color: #9a7d5a;
- line-height: 2.2;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ line-height: 1.2;
}
/* The "Reading the table." intro snippet */
@@ -1415,7 +1418,7 @@
/* Site-wide footer - matches about and faq pages */
.utci-site-footer {
text-align: center;
- padding: 2rem 1.5rem;
+ padding: 10px 1.5rem;
font-size: 0.82rem;
color: #b09870;
border-top: 1px solid #e0d0a8;
diff --git a/assets/js/app.js b/assets/js/app.js
index bfae2da..178e00b 100644
--- a/assets/js/app.js
+++ b/assets/js/app.js
@@ -896,7 +896,7 @@ export function UTCIForecast() {
class=${`scope-play ${(playing || simMs != null) ? 'is-playing' : ''}`}
onClick=${() => { if (playing || simMs != null) { setPlaying(false); setSimMs(null); } else setPlaying(true); }}
title=${playing ? 'Stop time-lapse' : 'Play a 24-hour time-lapse on the scope'}>
- ${(playing || simMs != null) ? '◼' : '▶'}${simClock ?? 'Day cycle'}
+ ${(playing || simMs != null) ? '◼' : '▶'}${simClock ?? 'Cycle 24h'}
<${DayTimeline}
windowStart=${windowStart}
diff --git a/assets/js/components/DayTabs.js b/assets/js/components/DayTabs.js
index 209dbf5..76fc8bc 100644
--- a/assets/js/components/DayTabs.js
+++ b/assets/js/components/DayTabs.js
@@ -34,7 +34,7 @@
import { h, Fragment } from '../../vendor/preact.js';
import htm from '../../vendor/htm.js';
import { confidenceBand, utciCategory, VEHICLE_SPEEDS, VEHICLE_TYPES, BUILDING_TYPES, FUR_COLORS } from '../utils.js';
-import { FREE_DAYS, UTCI_ENVIRONMENTS, deriveProfileMain } from '../config.js';
+import { FREE_DAYS, UTCI_ENVIRONMENTS, deriveProfileMain, FILTER_PROFILES, variantIcons } from '../config.js';
import { calcVehicleInteriorTemp } from '../physics.js';
import { CloudIcon, PrecipIcon, HouseIcon, CarIcon, FogIcon, IceIcon } from '../components.js';
import { SubscribeModal } from './SubscribeModal.js';
@@ -175,7 +175,12 @@ export function DayTabs({
title="Change profile & settings">
Profile
- ${mainLabel}
+
+ ${activeProfile === 'outdoors'
+ ? (variantIcons[outdoorsVariant] || '🌤️')
+ : (FILTER_PROFILES[activeProfile]?.icon || '🎯')}
+ ${mainLabel}
+
${mainConfigValue && html`
·