:root{--bg:#f2f5f9;--bg-kort:#fff;--primär:#1268b3;--primär-mörk:#0d4f8a;--primär-ljus:#e8f1fb;--orange:#faa61a;--orange-mörk:#d4880e;--röd:#db3328;--text:#1a1a1a;--text-mjuk:#5a6475;--text-rubrik:#0d0d0d;--border:#cdd5e0;--shadow:0 1px 8px #00000014;--shadow-hover:0 4px 20px #1268b329;--radius:6px;--varmt-bg:#fffbf0;--varmt-accent:#d4880e;--varmt-text:#6b4200;--behagligt-bg:#f0f9f9;--behagligt-accent:#1a7f7f;--behagligt-text:#0d4040;--friskt-bg:#eaf2fb;--friskt-accent:#1268b3;--friskt-text:#0d4a8a;--kallt-bg:#dde6f0;--kallt-accent:#0a3a66;--kallt-text:#051e36;--font-sans:"Manrope", system-ui, sans-serif;--font-serif:"Fraunces", Georgia, serif}*,:before,:after{box-sizing:border-box}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-size:16px;line-height:1.5}#root{flex-direction:column;min-height:100svh;display:flex}h1,h2,h3{font-family:var(--font-sans);color:var(--text-rubrik);margin:0;font-weight:700}p{margin:0}button{cursor:pointer;font-family:var(--font-sans)}input{font-family:var(--font-sans)}.header{z-index:100;border-bottom:3px solid var(--orange);background:#fff;position:sticky;top:0;box-shadow:0 2px 8px #00000014}.header-inner{justify-content:space-between;align-items:center;max-width:1200px;height:68px;margin:0 auto;padding:0 24px;display:flex;position:relative}.branding{align-items:center;gap:16px;display:flex}.vs-logga-wrapper{flex-shrink:0}.vs-logga{width:auto;height:48px;display:block}.app-rubrik{border-left:1px solid var(--border);flex-direction:column;padding-left:16px;line-height:1.2;display:flex}.app-rubrik-etikett{letter-spacing:1px;text-transform:uppercase;color:var(--text-mjuk);font-size:11px;font-weight:600}.app-rubrik-titel{color:var(--primär);font-size:17px;font-weight:700}.header-höger{align-items:center;gap:16px;display:flex}.kart-knapp{border:2px solid var(--primär);width:38px;height:38px;color:var(--primär);background:0 0;border-radius:8px;justify-content:center;align-items:center;transition:background .15s,color .15s;display:flex}.kart-knapp svg{width:18px;height:18px}.kart-knapp:hover{background:var(--primär);color:#fff}.header-titel{font-family:var(--font-sans);color:var(--primär);white-space:nowrap;margin:0;font-size:20px;font-weight:700;position:absolute;left:50%;transform:translate(-50%)}.realtidsklocka{font-family:var(--font-serif);color:var(--primär);letter-spacing:1px;font-variant-numeric:tabular-nums;font-size:20px;font-weight:400}.hero{background:linear-gradient(160deg, var(--primär) 0%, var(--primär-mörk) 100%);color:#fff;text-align:center;padding:52px 24px 64px;position:relative;overflow:hidden}.hero:after{content:"";background:var(--bg);clip-path:ellipse(55% 100% at 50% 100%);height:40px;position:absolute;bottom:-2px;left:0;right:0}.hero-etikett{letter-spacing:2px;text-transform:uppercase;opacity:.7;margin-bottom:8px;font-size:12px;font-weight:700}.hero-temp{font-family:var(--font-serif);letter-spacing:-2px;color:var(--orange);margin:8px 0 16px;font-size:clamp(72px,12vw,120px);font-weight:700;line-height:1}.hero-varmast{opacity:.85;margin-bottom:10px;font-size:18px}.hero-varmast strong{color:#ffe0a0}.hero-uppdaterad{opacity:.55;font-size:13px}.sök-container{max-width:480px;margin:32px auto 8px;padding:0 24px}.sök-fält{border:2px solid var(--border);width:100%;color:var(--text);background:#fff;border-radius:4px;outline:none;padding:11px 18px;font-size:15px;transition:border-color .2s,box-shadow .2s}.sök-fält::placeholder{color:var(--text-mjuk)}.sök-fält:focus{border-color:var(--primär);box-shadow:0 0 0 3px #1268b326}.kortgrid{grid-template-columns:repeat(auto-fit,minmax(300px,380px));justify-content:center;gap:20px;max-width:1200px;margin:0 auto;padding:24px 24px 48px;display:grid}@media (width<=560px){.kortgrid{grid-template-columns:1fr;padding:16px 16px 40px}}.inga-resultat{text-align:center;color:var(--text-mjuk);grid-column:1/-1;padding:48px 0;font-size:18px}.badplats-kort{background:var(--bg-kort);border-radius:var(--radius);box-shadow:var(--shadow);border-top:4px solid var(--kort-accent,var(--primär));flex-direction:column;transition:transform .2s,box-shadow .2s;display:flex;overflow:hidden}.badplats-kort:hover{box-shadow:var(--shadow-hover);transform:translateY(-3px)}.badplats-kort.kategori-varmt{--kort-accent:var(--varmt-accent);background:var(--varmt-bg)}.badplats-kort.kategori-behagligt{--kort-accent:var(--behagligt-accent);background:var(--behagligt-bg)}.badplats-kort.kategori-friskt{--kort-accent:var(--friskt-accent);background:var(--friskt-bg)}.badplats-kort.kategori-kallt{--kort-accent:var(--kallt-accent);background:var(--kallt-bg)}.badplats-kort.kategori-fel{--kort-accent:#9e9e9e;background:#f0f0f0}.kort-header{justify-content:space-between;align-items:flex-start;gap:8px;padding:20px 20px 0;display:flex}.kort-header-höger{flex-direction:column;flex-shrink:0;align-items:flex-end;gap:6px;display:flex}.favorit-knapp{color:#c8bfb8;background:0 0;border:none;padding:2px;font-size:30px;line-height:1;transition:color .15s,transform .15s}.favorit-knapp:hover{color:#e05a7a;transform:scale(1.2)}.favorit-aktiv{color:#e05a7a;animation:.3s cubic-bezier(.34,1.56,.64,1) hjärtslag}@keyframes hjärtslag{0%{transform:scale(.7)}to{transform:scale(1)}}.badplats-namn{color:var(--text-rubrik);font-size:22px;font-weight:700;line-height:1.2}.kategori-badge.kategori-badge-fel{background:#9e9e9e}.kategori-badge{letter-spacing:.8px;text-transform:uppercase;white-space:nowrap;background:var(--kort-accent);color:#fff;border-radius:3px;flex-shrink:0;padding:4px 10px;font-size:11px;font-weight:700}.temperatur-block{align-items:baseline;gap:8px;padding:12px 20px 16px;display:flex}.temperatur-okänd{opacity:.25}.temperatur{font-family:var(--font-serif);color:var(--kort-accent,var(--primär));letter-spacing:-1px;font-size:56px;font-weight:700;line-height:1}.trend{font-size:28px;font-weight:700;line-height:1}.detaljer{flex-direction:column;flex:1;gap:8px;padding:0 20px 16px;display:flex}.detalj{justify-content:space-between;align-items:center;font-size:14px;display:flex}.detalj-etikett{color:var(--text-mjuk);align-items:center;gap:5px;font-weight:500;display:flex}.info-ikon{background:var(--text-mjuk);color:#fff;cursor:default;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:15px;height:15px;font-size:10px;font-style:normal;font-weight:700;line-height:1;display:inline-flex;position:relative}.info-ikon:after{content:attr(aria-label);color:#fff;white-space:nowrap;pointer-events:none;opacity:0;z-index:10;background:#1a1a1a;border-radius:4px;padding:6px 10px;font-size:12px;font-weight:400;line-height:1.4;transition:opacity .15s;position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%)}.info-ikon:hover:after{opacity:1}.temperatur-block .info-ikon:after{top:calc(100% + 6px);bottom:auto}.detalj-värde{color:var(--text-rubrik);font-weight:700}.detalj-värde.kvalitet-bra{color:#1a7a3f}.detalj-värde.kvalitet-godkand{color:#8a6000}.detalj-värde.kvalitet-tj{color:var(--röd)}.server-fel-varning{color:#0d3d5e;background:#e8f4fd;border:1px solid #90c8f0;border-left:4px solid #1a7bbf;border-radius:4px;align-items:flex-start;gap:10px;margin:0 20px 16px;padding:10px 14px;font-size:13px;display:flex}.server-fel-varning strong{margin-bottom:2px;font-size:13px;display:block}.server-fel-varning p{opacity:.85;line-height:1.4}.data-varning{color:#5a4200;background:#fffbeb;border:1px solid #f5c842;border-left-width:4px;border-radius:4px;align-items:flex-start;gap:10px;margin:0 20px 16px;padding:10px 14px;font-size:13px;display:flex}.data-varning-ikon{flex-shrink:0;font-size:16px;line-height:1.3}.data-varning strong{margin-bottom:2px;font-size:13px;display:block}.data-varning p{opacity:.85;line-height:1.4}.data-ålder{color:#8a8a8a;align-items:baseline;gap:6px;margin:0 20px 14px;font-size:12px;line-height:1.4;display:flex}.data-ålder-ikon{flex-shrink:0;font-size:12px}.data-ålder.data-ålder-varning{color:#8a6000}.kort-nedre{margin-top:auto;padding:0 20px 20px}.bada-knapp{border:2px solid var(--primär);width:100%;color:var(--primär);letter-spacing:.3px;background:0 0;border-radius:4px;padding:11px 16px;font-size:14px;font-weight:700;transition:background .18s,color .18s}.bada-knapp:hover{background:var(--primär);color:#fff}.kommentar{color:var(--text);border-left:3px solid var(--kort-accent,var(--primär));background:#ffffffb3;border-radius:0 4px 4px 0;margin-top:12px;padding:10px 14px;font-size:14px;font-style:italic;animation:.22s cubic-bezier(.34,1.56,.64,1) popIn}@keyframes popIn{0%{opacity:0;transform:scale(.85)translateY(6px)}to{opacity:1;transform:scale(1)translateY(0)}}.karta-overlay{z-index:200;background:#0000008c;justify-content:center;align-items:center;animation:.2s tonaIn;display:flex;position:fixed;inset:0}@keyframes tonaIn{0%{opacity:0}to{opacity:1}}.karta-modal{background:#fff;border-radius:12px;width:min(92vw,1100px);height:85vh;animation:.22s cubic-bezier(.34,1.56,.64,1) popIn;position:relative;overflow:hidden;box-shadow:0 20px 60px #00000059}.karta-stäng{z-index:10;color:#fff;background:#00000026;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:16px;transition:background .15s;display:flex;position:absolute;top:14px;right:14px}.karta-stäng:hover{background:#00000059}.karta-innehåll{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.karta-innehåll svg{object-fit:contain;width:100%;height:100%}.footer{background:var(--primär-mörk);color:#ffffff8c;text-align:center;border-top:3px solid var(--orange);flex-direction:column;gap:6px;margin-top:auto;padding:20px 24px;font-size:13px;display:flex}.footer-länk{color:var(--orange);font-weight:600;text-decoration:none}.footer-länk:hover{text-decoration:underline}.footer-prao{color:#ffffff59;max-width:480px;margin:0 auto;font-size:11px;line-height:1.5}