.wb{--wb-accent:var(--bsc-beer-accent,#00d1b4);--wb-secondary:var(--bsc-beer-secondary,#bd009f);--wb-surface:#111;--wb-ink:#fff;--wb-muted:#bdbdbd;--wb-border:#313131;--wb-padding:clamp(20px,4vw,32px);box-sizing:border-box;width:100%;min-width:0;overflow:hidden;background:var(--wb-surface);color:var(--wb-ink);border:2px solid var(--wb-border);font-family:inherit;font-size:15px;line-height:1.6;text-align:left;position:relative;isolation:isolate}
.wb::before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,var(--wb-accent) 0 70%,var(--wb-secondary) 70%)}
.wb--light{--wb-surface:var(--bsc-beer-surface,#f4f1ec);--wb-ink:var(--bsc-beer-ink,#111);--wb-muted:#525252;--wb-border:#111}
.wb--inherit{--wb-surface:transparent;--wb-ink:inherit;--wb-muted:inherit;--wb-border:currentColor}
.wb *,.wb *::before,.wb *::after{box-sizing:border-box}
.wb .wb__header,.wb .wb__body,.wb .wb__pairing{padding:var(--wb-padding)}
.wb .wb__header{padding-bottom:10px}
.wb .wb__eyebrow{display:inline-block;font-size:.68em;letter-spacing:.14em;font-weight:800;color:var(--wb-accent);line-height:1.5}
.wb--light .wb__eyebrow{color:var(--wb-ink);border-bottom:3px solid var(--wb-accent)}
.wb .wb__title{font-family:inherit;color:inherit;font-size:clamp(22px,2.5vw,30px);font-weight:850;letter-spacing:-.035em;line-height:1.12;margin:12px 0}
.wb p{margin:0 0 12px}.wb .wb__location{color:var(--wb-muted);font-size:.86em;margin:0}
.wb .wb__hero{display:flex;align-items:center;gap:20px;margin-bottom:20px;flex-wrap:wrap}
.wb .wb__icon{width:66px;height:66px;flex-shrink:0;color:var(--wb-accent)}
.wb .wb__temperature{font-size:clamp(48px,6vw,72px);font-weight:850;letter-spacing:-.06em;line-height:1.1}
.wb .wb__condition{font-weight:650}.wb .wb__subtitle{font-size:.8em;color:var(--wb-muted);margin:3px 0}
.wb .wb__metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;border:1px solid var(--wb-border);margin:0}
.wb--history .wb__metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
.wb--today .wb__metric:last-child:nth-child(odd){grid-column:1/-1}
.wb{container-type:inline-size}
.wb .wb__title{text-wrap:balance}
.wb .wb__metric{padding:13px 14px;min-width:0;border:1px solid var(--wb-border)}
.wb .wb__metric dt{font-size:.7em;text-transform:uppercase;letter-spacing:.06em;color:var(--wb-muted);line-height:1.5}
.wb .wb__metric dd{font-size:1.4em;font-weight:800;margin:5px 0 0;line-height:1.3;font-variant-numeric:tabular-nums}
.wb .wb__periods{display:flex;flex-wrap:wrap;gap:6px;padding:10px clamp(20px,4vw,32px) 0}
.wb .wb__periods button,.wb .wb__retry{font:inherit;font-size:.78em;font-weight:700;padding:8px 12px;border:1px solid var(--wb-border);border-radius:0;cursor:pointer;background:transparent;color:inherit;line-height:1.5;min-height:38px}
.wb .wb__periods button[aria-pressed=true]{background:var(--wb-accent);color:#111;border-color:var(--wb-accent)}
.wb button:focus-visible,.wb summary:focus-visible,.wb a:focus-visible{outline:3px solid var(--wb-secondary);outline-offset:3px}
.wb .wb__periods button:hover,.wb .wb__retry:hover{border-color:var(--wb-accent)}
.wb .wb__status{font-size:.8em;color:var(--wb-muted)}
.wb [data-wb-status]:not(:empty){padding:0 clamp(20px,4vw,32px) 16px}
.wb [data-wb-status]:empty{display:none}
.wb .wb__footer{border-top:1px solid var(--wb-border);padding:13px clamp(20px,4vw,32px);font-size:.63em;color:var(--wb-muted)}
.wb a{color:inherit;text-underline-offset:3px}
.wb .wb__pairing{border-top:1px solid var(--wb-border);border-left:5px solid var(--wb-accent)}
.wb .wb__pairing h4{color:inherit;font:inherit;font-size:1.2em;font-weight:750;margin:10px 0}
.wb .wb__ideal{font-size:clamp(32px,4vw,45px);font-weight:850;line-height:1.2;letter-spacing:-.04em}
.wb .wb__pairing small{display:block;font-size:.72em;color:var(--wb-muted)}
.wb .wb__chart{width:100%;height:auto;display:block;margin:18px 0 0;overflow:visible}
.wb .wb__chart text{fill:var(--wb-muted);font:12px system-ui,sans-serif}
.wb .wb__chart line{stroke:var(--wb-border);stroke-width:1}
.wb .wb__chart polyline{fill:none;stroke:var(--wb-accent);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.wb .wb__chart circle{fill:var(--wb-accent)}
.wb .wb__table-wrap{max-height:310px;overflow:auto;margin-top:14px}
.wb table{width:100%;border-collapse:collapse;font-size:.75em;color:inherit;margin:0;white-space:nowrap}
.wb th,.wb td{padding:8px;text-align:right;border:1px solid var(--wb-border);background:transparent}
.wb th:first-child,.wb td:first-child{text-align:left}
.wb caption{text-align:left;padding:8px 0;font-weight:650}
.wb details{margin-top:18px;font-size:.88em}.wb summary{cursor:pointer;font-weight:650}
.wb .wb__tag{display:inline-block;font-size:.7em;padding:3px 8px;border:1px solid var(--wb-border);margin-bottom:12px;color:var(--wb-muted)}
.wb .wb__error{border-left:3px solid var(--wb-secondary);padding-left:14px}
.wb [aria-busy=true]{opacity:.65}
@media(max-width:480px){.wb .wb__metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.wb .wb__icon{width:50px;height:50px}.wb .wb__hero{gap:14px}.wb .wb__periods button{flex:1;padding:8px}}
@container(max-width:400px){.wb .wb__temperature{font-size:48px}.wb .wb__icon{width:50px;height:50px}.wb .wb__metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.wb .wb__hero{gap:14px}}
@media(prefers-reduced-motion:no-preference){.wb .wb__periods button{transition:background-color .15s,border-color .15s}}

/* History: the compact "La brasserie en chiffres" presentation. */
.wb.wb--figures{--wb-padding:0;--wb-accent:#fff;--wb-secondary:#fff;--wb-tile:#111;border:0}
.wb--figures.wb--bsc{--wb-surface:#000;--wb-border:#383838}
.wb--figures.wb--light{--wb-tile:#fff;--wb-accent:#111;--wb-secondary:#111;--wb-border:#d0cec9}
.wb--figures.wb--inherit{--wb-tile:transparent;--wb-accent:currentColor;--wb-secondary:currentColor}
.wb--figures::before{display:none}
.wb--figures .wb__header{padding-bottom:0}
.wb--figures .wb__header .wb__eyebrow,.wb--figures .wb__header .wb__location{display:none}
.wb--figures .wb__title{font-size:clamp(30px,5.8cqi,64px);font-weight:950;line-height:1;letter-spacing:-.055em;text-transform:uppercase;text-wrap:balance;margin:0 0 24px}
.wb--figures .wb__periods{padding:0;margin:0 0 14px;gap:4px}
.wb--figures .wb__periods button{font-size:10px;min-height:28px;padding:4px 10px;font-weight:850;text-transform:uppercase;letter-spacing:.04em}
.wb--figures .wb__metrics{grid-template-columns:repeat(5,minmax(0,1fr));gap:1px;background:var(--wb-border);border:0}
.wb--figures .wb__metric{position:relative;display:flex;flex-direction:column-reverse;justify-content:center;min-height:76px;padding:14px 12px 14px 48px;border:0;background:var(--wb-tile)}
.wb--figures .wb__metric dd{color:var(--wb-ink);font-size:20px;line-height:1.1;font-weight:950;letter-spacing:-.035em;margin:0 0 4px;overflow-wrap:anywhere}
.wb--figures .wb__metric dt{color:var(--wb-ink);font-size:9px;font-weight:850;line-height:1.35;letter-spacing:.055em;text-transform:uppercase;opacity:.88}
.wb--figures .wb__metric-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:21px;font-weight:400;line-height:1;letter-spacing:0}
.wb--figures .wb__range{font-size:11px;color:var(--wb-muted);margin:12px 0 5px}
.wb--figures .wb__subtitle{font-size:10px;margin:8px 0}
.wb--figures details{font-size:11px;margin-top:10px}
.wb--figures summary{font-weight:750}
.wb--figures .wb__chart{margin-top:12px}
.wb--figures [data-wb-status]:not(:empty){padding:0;font-size:10px;margin:10px 0}
.wb--figures .wb__footer{padding:0;margin-top:12px;border-top:0;font-size:9px}
@container(max-width:760px){.wb--figures .wb__metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@container(max-width:440px){.wb--figures .wb__metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.wb--figures .wb__metric{padding-left:44px}.wb--figures .wb__metric dd{font-size:18px}.wb--figures .wb__metric-icon{left:12px;font-size:20px}.wb--figures .wb__title{letter-spacing:-.045em}}
@container(max-width:280px){.wb--figures .wb__metrics{grid-template-columns:1fr}}
