.wf-chart{
    font-family:var(--wf-sans);
    color:var(--wf-text-primary);
    -webkit-font-smoothing:antialiased;
    display:flex;flex-direction:column;align-items:center;
    padding:1rem 0.5rem;width:100%;max-width:100%;
    background:#fff;border:none;box-sizing:border-box;
    overflow:visible;
}
.wf-chart .wf-chart__title{
    width:100%;margin:0 0 0.8rem;
    font-family:var(--wf-sans);font-weight:800;font-size:1.4rem;line-height:1.2;
    letter-spacing:-0.03em;color:var(--wf-text-primary);
}
.wf-chart .page-header{
    width:100%;max-width:100%;margin-bottom:1.2rem;
    display:flex;align-items:center;
    flex-wrap:wrap;gap:1rem;
}
.wf-chart .header-left{display:flex;align-items:center;gap:0.8rem;flex:0 1 auto;min-width:0}
.wf-chart .header-right{display:flex;align-items:center;gap:0.5rem;justify-content:flex-end;flex-wrap:wrap;margin-left:auto}
/* Desktop: título em linha com busca e barra de cores (não ocupa linha inteira). */
@media(min-width:769px){
    .wf-chart .wf-chart__title{width:auto;margin:0}
}
.wf-chart__period-label{font-size:0.85rem;font-weight:700;color:var(--wf-text-secondary);white-space:nowrap}

.wf-chart .chart-card{
    width:100%;max-width:100%;background:#fff;
    border:1px solid var(--wf-glass-border);border-radius:var(--wf-glass-radius);
    overflow:hidden;position:relative;
    box-shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 16px rgba(0,0,0,0.03);
}
.wf-chart .wf-chart__scroll-area{position:relative}
.wf-chart .wf-chart__yaxis-canvas{
    position:absolute;left:0;top:0;
    pointer-events:none;z-index:2;
}
.wf-chart .chart-wrap{
    width:100%;overflow-x:auto;overflow-y:hidden;
    -webkit-overflow-scrolling:touch;cursor:grab;
}
.wf-chart .wf-chart__scroll-hint{
    position:absolute;left:50%;bottom:20px;
    transform:translateX(-50%);
    display:flex;align-items:center;gap:0.6rem;
    pointer-events:none;z-index:3;
    opacity:0;transition:opacity 0.25s ease;
}
.wf-chart .wf-chart__scroll-hint.is-visible{opacity:1}
.wf-chart .wf-chart__scroll-hand{
    display:inline-flex;align-items:center;justify-content:center;
    width:28px;height:24px;
    filter:drop-shadow(0 1px 4px rgba(255,255,255,0.9));
    transition:opacity 0.2s ease;
    color:#1a1e2a;
}
.wf-chart .wf-chart__scroll-label{
    font-size:0.6rem;font-weight:600;font-style:italic;
    text-transform:uppercase;letter-spacing:0.08em;
    color:var(--wf-text-muted);
    white-space:nowrap;
    text-shadow:0 1px 3px rgba(255,255,255,0.85);
}
.wf-chart .wf-chart__arrow{
    display:block;
    animation:wf-arrow-pulse-right 1.2s ease-in-out infinite;
}
.wf-chart .wf-chart__scroll-hand--left .wf-chart__arrow{animation-name:wf-arrow-pulse-left}
.wf-chart .wf-chart__scroll-hint.is-at-start .wf-chart__scroll-hand--left {opacity:0.15}
.wf-chart .wf-chart__scroll-hint.is-at-end   .wf-chart__scroll-hand--right{opacity:0.15}
.wf-chart .wf-chart__scroll-hint.is-at-start .wf-chart__scroll-hand--left  .wf-chart__arrow{animation:none}
.wf-chart .wf-chart__scroll-hint.is-at-end   .wf-chart__scroll-hand--right .wf-chart__arrow{animation:none}
@keyframes wf-arrow-pulse-right{
    0%,100%{transform:translateX(0)}
    50%    {transform:translateX(5px)}
}
@keyframes wf-arrow-pulse-left{
    0%,100%{transform:translateX(0)}
    50%    {transform:translateX(-5px)}
}
@media(prefers-reduced-motion:reduce){
    .wf-chart .wf-chart__arrow{animation:none}
}
.wf-chart .chart-wrap:active{cursor:grabbing}
/* Scrollbar nativo escondido — usamos um custom centralizado e sempre
 * visível abaixo (.wf-chart__scrollbar), pra deixar claro que tem
 * conteúdo rolável (a barra nativa parecia uma sombra). */
.wf-chart .chart-wrap{scrollbar-width:none}
.wf-chart .chart-wrap::-webkit-scrollbar{display:none}
.wf-chart .wf-chart__scrollbar{
    position:absolute;bottom:6px;left:50%;transform:translateX(-50%);
    width:clamp(180px, 22%, 280px);height:5px;
    background:#e8eaef;border-radius:3px;
    z-index:4;cursor:pointer;
    opacity:0;transition:opacity 0.2s ease;
}
.wf-chart .wf-chart__scrollbar.is-visible{opacity:1}
.wf-chart .wf-chart__scrollbar-thumb{
    position:absolute;top:0;left:0;height:100%;min-width:24px;
    background:#FE0000;border-radius:3px;cursor:grab;
}
.wf-chart .wf-chart__scrollbar-thumb:active{cursor:grabbing}
.wf-chart canvas{display:block}

.wf-chart .period-bar{display:flex;height:18px;border-radius:3px;overflow:hidden;pointer-events:none;flex:0 0 auto}
.wf-chart .period-bar .pb-cell{width:24px;display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;flex-shrink:0}
.wf-chart .wind-legend{display:flex;gap:0.8rem;position:absolute;z-index:5;pointer-events:none;justify-content:center;font-size:0.65rem;font-weight:600;color:var(--wf-text-secondary)}
.wf-chart .wl-item{display:flex;align-items:center;gap:0.25rem}
.wf-chart .wl-swatch{width:10px;height:10px;border-radius:2px;opacity:0.55}

.wf-chart .tooltip{
    position:fixed;pointer-events:none;
    background:rgba(255,255,255,0.65);
    backdrop-filter:blur(16px) saturate(180%);-webkit-backdrop-filter:blur(16px) saturate(180%);
    border:1px solid rgba(255,255,255,0.6);border-radius:14px;
    padding:0.8rem 1rem;z-index:1000;opacity:0;
    transition:opacity 0.12s ease;min-width:190px;
    box-shadow:0 4px 20px rgba(0,0,0,0.08),0 1px 3px rgba(0,0,0,0.04),inset 0 1px 0 rgba(255,255,255,0.8);
}
.wf-chart .tooltip.visible{opacity:1}
.wf-chart .tooltip-time{font-size:0.68rem;font-weight:700;letter-spacing:0.04em;color:var(--wf-accent);margin-bottom:0.4rem}
.wf-chart .tt-section-title{font-size:0.68rem;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;color:var(--wf-text-primary);margin:0.45rem 0 0.15rem;padding-top:0.35rem;border-top:1px solid rgba(0,0,0,0.06)}
.wf-chart .tooltip > .tt-section-title:first-of-type{margin-top:0;padding-top:0;border-top:none}
.wf-chart .tooltip-row{display:flex;align-items:center;justify-content:space-between;gap:0.8rem;padding:0.14rem 0;font-size:0.78rem}
.wf-chart .tooltip-row .label{color:var(--wf-text-muted);font-weight:500;font-size:0.72rem}
.wf-chart .tooltip-row .value{font-weight:700;color:var(--wf-text-primary);display:flex;align-items:center;gap:0.2rem}
.wf-chart .tooltip-row .tt-dir-name{font-weight:800}
.wf-chart .tooltip-row .tt-dir-deg{font-weight:500;color:var(--wf-text-muted)}
.wf-chart .tooltip-row .value.green{color:var(--wf-offshore)}
.wf-chart .tooltip-row .value.yellow{color:var(--wf-cross)}
.wf-chart .tooltip-row .value.red{color:var(--wf-onshore)}
.wf-chart .tooltip-divider{height:1px;background:rgba(0,0,0,0.06);margin:0.3rem 0}
.wf-chart .tooltip-score{display:flex;align-items:center;gap:0.5rem;margin-top:0.2rem}
.wf-chart .tooltip-score .label{font-size:0.68rem;color:var(--wf-text-muted);font-weight:500}
.wf-chart .tooltip-score-bar{flex:1;height:5px;border-radius:3px;background:#e8eaef;overflow:hidden}
.wf-chart .tooltip-score-fill{height:100%;border-radius:3px}
.wf-chart .tooltip-score-num{font-size:0.78rem;font-weight:700}
.wf-chart .tooltip-score-label{font-size:0.65rem;font-weight:500;color:var(--wf-text-muted)}
.wf-chart .tt-weather-icons{display:inline-flex;align-items:center;line-height:0;margin-right:0.25rem}
.wf-chart .tt-weather-icons svg{display:block}
.wf-chart .tt-svg{display:inline-block;vertical-align:middle;margin-right:0.2rem}

.wf-chart .daily-summary{
    width:100%;max-width:100%;margin-top:0.8rem;
    border:1px solid var(--wf-glass-border);border-radius:var(--wf-glass-radius);overflow:hidden;
    background:#fff;
    box-shadow:0 1px 3px rgba(0,0,0,0.04),0 4px 16px rgba(0,0,0,0.03);
}
.wf-chart .summary-day-header{display:flex;align-items:stretch;background:rgba(0,0,0,0.03);border-bottom:1px solid rgba(0,0,0,0.08)}
.wf-chart .sdh-group{display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid rgba(0,0,0,0.06);padding:0.4rem 0}
.wf-chart .sdh-group:last-child{border-right:none}
.wf-chart .sdh-group.g-time{flex:0.4;padding-left:0.6rem;align-items:flex-start}
.wf-chart .sdh-group.g-surf{flex:1}
.wf-chart .sdh-group.g-swell{flex:1.4}
.wf-chart .sdh-group.g-wind{flex:2}
.wf-chart .sdh-group.g-weather{flex:0.6}
.wf-chart .sdh-group.g-mare{flex:0.8}
.wf-chart .sdh-group .g-title{font-size:0.6rem;font-weight:700;color:var(--wf-text-muted);text-transform:uppercase;letter-spacing:0.05em}
.wf-chart .sdh-group.g-time .g-title{font-size:0.78rem;font-weight:800;color:var(--wf-text-primary)}

.wf-chart .summary-row{display:flex;align-items:center;border-bottom:1px solid rgba(0,0,0,0.04);transition:background 0.15s;font-size:0.88rem;position:relative;min-height:48px}
.wf-chart .summary-row:hover{background:rgba(0,0,0,0.012)}
.wf-chart .summary-row .sr-rating-bar{position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:0 2px 2px 0}
.wf-chart .sr-group{display:flex;align-items:center;justify-content:center;gap:0.25rem;border-right:1px solid rgba(0,0,0,0.06);padding:0.4rem 0.2rem;font-weight:600;color:var(--wf-text-secondary)}
.wf-chart .sr-group:last-child{border-right:none}
.wf-chart .sr-group.g-time{flex:0.4;justify-content:flex-start;padding-left:0.6rem;color:var(--wf-text-muted);font-weight:700}
.wf-chart .sr-group.g-surf{flex:1}
.wf-chart .sr-group.g-swell{flex:1.4;gap:0.5rem}
.wf-chart .sr-group.g-wind{flex:2;flex-wrap:nowrap;gap:0.5rem}
.wf-chart .sr-group.g-weather{flex:0.6;font-size:0.78rem}
.wf-chart .sr-group.g-mare{flex:0.8}
.wf-chart .sr-group .sr-height{font-size:1.05rem;font-weight:800;color:var(--wf-text-primary)}
.wf-chart .sr-group .sr-unit{font-size:0.72rem;color:var(--wf-text-muted);font-weight:500}
.wf-chart .sr-dot{width:10px;height:10px;border-radius:50%;display:inline-block;flex-shrink:0}
.wf-chart .sr-group svg{display:inline-block;vertical-align:middle;flex-shrink:0}
.wf-chart .sr-group .sr-dir{font-weight:700;font-size:0.82rem}
.wf-chart .sr-group .sr-deg{font-size:0.65rem;color:var(--wf-text-muted);font-weight:500}
.wf-chart .sr-group .sr-speed{font-weight:800;font-size:0.9rem;color:var(--wf-text-primary)}
.wf-chart .sr-group .sr-kmh{font-size:0.62rem;color:var(--wf-text-muted);font-weight:500}
.wf-chart .sr-group .sr-temp{font-weight:600;font-size:0.8rem;color:var(--wf-text-secondary)}
.wf-chart .sr-group.g-swell .s-col{display:flex;align-items:center;gap:0.15rem}
.wf-chart .sr-arrow-box{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;background:rgba(0,0,0,0.045);border-radius:7px;flex-shrink:0}
.wf-chart .sr-arrow-box svg{display:block}
.wf-chart .sr-group.g-wind .w-col{display:flex;align-items:center;gap:0.15rem}
.wf-chart .sr-group.g-wind .w-col.w-speed{min-width:50px}
.wf-chart .sr-group.g-wind .w-col.w-dir2{min-width:60px}
.wf-chart .sr-group.g-wind .w-col.w-cond{min-width:62px}
.wf-chart .sr-wind-badge{font-size:0.65rem;font-weight:700;padding:0.15rem 0.5rem;border-radius:3px}
.wf-chart .sr-wind-badge.offshore{background:var(--wf-offshore);color:#fff}
.wf-chart .sr-wind-badge.cross{background:var(--wf-cross);color:#fff}
.wf-chart .sr-wind-badge.onshore{background:var(--wf-onshore);color:#fff}

/* Mobile view */
.wf-chart .mobile-view{display:none}
@media(max-width:768px){
    .wf-chart{padding:0.5rem 0;background:#fff;width:100%;min-width:0;box-sizing:border-box}
    .wf-chart .mobile-view{width:100%;min-width:0;box-sizing:border-box;background:#fff}
    .wf-chart .chart-card,.wf-chart .tooltip{display:none}
    .wf-chart .page-header{margin:0 0.55rem 0.8rem;justify-content:flex-start}
    .wf-chart .header-right{display:none}
    .wf-chart .header-left{width:100%}
    .wf-chart .header-left .wf-selector{width:100%;justify-content:space-between}
    .wf-chart .header-left .wf-selector__trigger{flex:1 1 auto;max-width:none}
    .wf-chart .wf-chart__title{padding:0}
    .wf-chart .daily-summary{display:block;border:none;background:#fff;box-shadow:none;margin:0.5rem 0;padding:0}
    .wf-chart .summary-day-header{display:none}
    .wf-chart .daily-summary .summary-row{display:none}
    /* Tabela diária mobile (.mtb-*) movida pra common.css — compartilhada
     * com o widget standalone .wf-table-modern. */
    .wf-chart .mobile-view{display:flex;flex-direction:column;background:#fff}
    .wf-chart .mob-days{display:flex;gap:0.25rem;padding:0.55rem 0.45rem;background:#fff;width:100%;box-sizing:border-box}
    .wf-chart .mob-day{flex:1 1 0;min-width:0;text-align:center;padding:0.45rem 0.15rem;border-radius:10px;font-size:clamp(0.68rem, 2.2vw, 0.78rem);font-weight:700;color:var(--wf-text-muted);cursor:pointer;background:rgba(0,0,0,0.03);border:1px solid rgba(0,0,0,0.04)}
    .wf-chart .mob-day.on{background:#FE0000;color:#fff;font-weight:700;border-color:#FE0000}
    .wf-chart .mob-day .md-name{font-weight:800;font-size:clamp(0.78rem, 2.6vw, 0.9rem);line-height:1.1}
    .wf-chart .mob-day .md-date{font-size:clamp(0.6rem, 2vw, 0.7rem);font-weight:600;margin-top:0.1rem;opacity:0.85;white-space:nowrap}
    .wf-chart .mob-content{padding:0.5rem 0.55rem;display:flex;flex-direction:column;gap:0.45rem;width:100%;min-width:0;box-sizing:border-box;background:#fff}
    .wf-chart .mob-content > *{min-width:0}
    .wf-chart .mob-top-row{display:flex;gap:0.4rem}
    .wf-chart .mob-box{background:#fff;border-radius:16px;padding:0.7rem 0.55rem;box-shadow:0 3px 16px rgba(0,0,0,0.10),0 1px 3px rgba(0,0,0,0.05)}
    .wf-chart .mob-box-title{font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--wf-text-muted)}
    .wf-chart .mob-surf-box{flex:0.7;display:flex;flex-direction:column;justify-content:center;gap:0.1rem;min-width:0}
    .wf-chart .mob-surf-box .msb-val{font-size:clamp(1rem, 5.8vw, 2rem);font-weight:800;color:var(--wf-text-primary);letter-spacing:-0.03em;line-height:1;margin-top:0.2rem;white-space:nowrap}
    .wf-chart .mob-surf-box .msb-score{display:flex;align-items:center;gap:0.8rem;margin-top:0.35rem}
    .wf-chart .mob-surf-box .msb-score{padding-bottom:5px}
    .wf-chart .mob-surf-box .msb-score .dot{width:12px;height:12px;border-radius:50%;position:relative}
    .wf-chart .mob-surf-box .msb-score .dot::after{content:'';position:absolute;left:100%;top:50%;transform:translateY(-50%);width:5px;height:2px;background-color:inherit;border-radius:0 1px 1px 0}
    .wf-chart .mob-surf-box .msb-score .num{font-size:1rem;font-weight:700}
    .wf-chart .mob-sv-box{flex:1.3;display:flex;flex-direction:row;padding:0.65rem 0.35rem;gap:0.25rem;min-width:0}
    .wf-chart .mob-sv-half{flex:1 1 0;min-width:0;display:grid;grid-template-columns:auto auto;grid-template-rows:auto auto auto;justify-content:center;align-items:center;column-gap:0.4rem;row-gap:0.1rem;padding:0 0.05rem}
    .wf-chart .mob-sv-half:first-child{border-right:1px solid rgba(0,0,0,0.06)}
    .wf-chart .mob-sv-half .sv-title{grid-column:1 / -1;grid-row:1;font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--wf-text-muted);margin-bottom:0.2rem}
    .wf-chart .mob-sv-half .sv-row{grid-row:2 / span 2;grid-column:1;display:flex;align-items:stretch;justify-content:center;align-self:stretch}
    .wf-chart .mob-sv-half .sv-main{grid-row:2;grid-column:2;font-size:24px;font-weight:800;color:var(--wf-text-primary);line-height:1;letter-spacing:-0.02em;align-self:end;white-space:nowrap;overflow:hidden;text-overflow:clip}
    .wf-chart .mob-sv-half .sv-sub{grid-row:3;grid-column:2;font-size:18px;font-weight:800;color:var(--wf-text-primary);align-self:start;line-height:1;letter-spacing:-0.02em;white-space:nowrap}
    .wf-chart .mob-sv-half .sv-sub.sv-sub--sm{font-size:14px}
    .wf-chart .mob-sv-half .sv-sub.sv-sub--xs{font-size:12px}
    .wf-chart .mob-sv-half .sv-sub .sv-sub-val{font-weight:800;color:var(--wf-text-primary)}
    .wf-chart .mob-sv-half .sv-sub .sv-sub-unit{font-weight:600;color:var(--wf-text-muted);font-size:calc(1em - 2px);margin-left:0.1em}
    .wf-chart .mob-sv-half .icon-box{width:50px;height:50px;border-radius:8px}
    .wf-chart .mob-sv-half .icon-box svg{width:65%;height:65%}
    .wf-chart .icon-box{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:8px;flex-shrink:0}
    .wf-chart .icon-box.swell{background:rgba(0,0,0,0.06)}
    .wf-chart .icon-box.wind-t{background:var(--wf-offshore-soft)}
    .wf-chart .icon-box.wind-c{background:var(--wf-cross-soft)}
    .wf-chart .icon-box.wind-m{background:var(--wf-onshore-soft)}
    .wf-chart .icon-box svg{display:block}
    .wf-chart .mob-chart-card{background:#fff;border-radius:16px;padding:0.75rem 0.5rem;box-shadow:0 3px 16px rgba(0,0,0,0.10),0 1px 3px rgba(0,0,0,0.05);width:100%;box-sizing:border-box}
    .wf-chart .mob-chart-wrap{position:relative;touch-action:none;width:100%}
    .wf-chart .mob-chart-wrap canvas{display:block;width:100%;height:auto}
    .wf-chart .mob-score-label{font-size:0.72rem;font-weight:700;color:var(--wf-text-muted);text-transform:uppercase;letter-spacing:0.05em;padding-left:2px;margin-bottom:0.15rem}
    .wf-chart .mob-score-dots{display:flex;margin-bottom:0.3rem;padding-left:34px}
    .wf-chart .mob-score-dot{flex:1;display:flex;justify-content:center;padding-bottom:5px}
    .wf-chart .mob-score-dot span{width:12px;height:12px;border-radius:50%;display:block;position:relative}
    .wf-chart .mob-score-dot span::after{content:'';position:absolute;left:50%;top:100%;transform:translateX(-50%);width:2px;height:5px;background-color:inherit;border-radius:0 0 1px 1px}
    .wf-chart .mob-hours-row{display:flex;margin-top:-0.4rem;padding-left:34px}
    .wf-chart .mob-hour{flex:1;text-align:center;font-size:0.8rem;font-weight:700;color:var(--wf-text-muted)}
    .wf-chart .mob-wind-row{display:flex;align-items:center;margin-top:0.8rem}
    /* "VENTO" e "km/h" como dois rótulos verticais (mesma rotação da
     * coluna de horários em .mtb-time), lado a lado dentro dos 34px. */
    .wf-chart .mob-wind-unit{width:34px;flex-shrink:0;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:4px;color:var(--wf-text-muted);line-height:1}
    .wf-chart .mob-wind-unit .mwu-label,
    .wf-chart .mob-wind-unit .mwu-val{writing-mode:vertical-rl;transform:rotate(180deg);font-weight:700}
    .wf-chart .mob-wind-unit .mwu-label{font-size:10px;text-transform:uppercase;letter-spacing:0.05em}
    .wf-chart .mob-wind-unit .mwu-val{font-size:11px;letter-spacing:0.02em}
    /* Cada cell ocupa exatamente a mesma largura da coluna do gráfico (bw),
     * com box interno `bw - 1.5px` (mesmo inset visual do roundRect das barras). */
    .wf-chart .mob-wind-cell{flex:1;display:flex;justify-content:center;align-items:center;min-width:0;padding:0;box-sizing:border-box;cursor:pointer;transition:opacity 0.15s ease}
    .wf-chart .mob-wind-row.has-active .mob-wind-cell:not(.is-active){opacity:0.3}
    .wf-chart .mob-wind-cell .wc-box{display:flex;flex-direction:column;align-items:center;justify-content:center;width:calc(100% - 1.5px);border-radius:10px;padding:0.4rem 0.15rem;gap:0.15rem;line-height:1}
    .wf-chart .mob-wind-cell .wc-box .wc-arrow{flex-shrink:0;width:28px;height:28px}
    .wf-chart .mob-wind-cell .wc-box .wc-speed{font-size:1rem;font-weight:800;line-height:1}
    .wf-chart .mob-wind-cell .wc-box.wind-t{background:var(--wf-offshore-soft)}
    .wf-chart .mob-wind-cell .wc-box.wind-c{background:var(--wf-cross-soft)}
    .wf-chart .mob-wind-cell .wc-box.wind-m{background:var(--wf-onshore-soft)}
    .wf-chart .mob-wind-legend{display:flex;gap:1.2rem;justify-content:center;margin-top:0.9rem;margin-bottom:0.3rem;font-size:1.01rem;font-weight:700;color:var(--wf-text-muted)}
    .wf-chart .mob-wind-legend .mwl{display:flex;align-items:center;gap:0.35rem}
    .wf-chart .mob-wind-legend .mwl-dot{width:14px;height:14px;border-radius:3px}
    .wf-chart .mob-period-bar{display:flex;height:12px;border-radius:4px;overflow:hidden;margin-top:1rem;margin-left:34px;margin-right:6px}
    .wf-chart .mob-period-bar div{flex:1}
    .wf-chart .mob-period-labels{display:flex;justify-content:space-between;font-size:1.01rem;font-weight:700;color:var(--wf-text-muted);margin-top:0.4rem;margin-left:34px;margin-right:6px;padding-bottom:0.3rem}
    /* Mobile summary (Maré + Clima) */
    .wf-chart .mob-summary-row{display:flex;gap:0.4rem;padding:0.5rem 0.55rem 0;align-items:stretch}
    .wf-chart .mob-summary-row .mob-box{padding:0.65rem 0.5rem;display:flex;flex-direction:column;align-items:center;gap:0.4rem;min-width:0}
    .wf-chart .mob-summary-row .mob-box-title{align-self:center;font-size:0.78rem;font-weight:700;text-transform:uppercase;letter-spacing:0.06em;color:var(--wf-text-muted)}
    .wf-chart .mob-tide-box{flex:0.8}
    .wf-chart .mob-tide-body{display:flex;align-items:center;gap:0.45rem}
    .wf-chart .mob-tide-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center}
    .wf-chart .mob-tide-text{display:flex;flex-direction:column;gap:0.1rem}
    .wf-chart .mob-tide-val{font-size:20px;font-weight:800;color:var(--wf-text-primary);letter-spacing:-0.02em;line-height:1}
    .wf-chart .mob-tide-val .mob-tide-unit{font-size:18px;font-weight:800;letter-spacing:-0.02em}
    .wf-chart .mob-tide-dir{font-size:0.85rem;font-weight:600;color:var(--wf-text-muted);line-height:1}
    .wf-chart .mob-climate-box{flex:2.4;min-width:0}
    .wf-chart .mob-climate-body{display:flex;align-items:center;justify-content:space-evenly;gap:0.4rem;width:100%}
    .wf-chart .mob-climate-temps{display:flex;flex-direction:column;gap:0.15rem;flex-shrink:0}
    .wf-chart .mob-climate-temps .mc-row{display:flex;align-items:baseline;gap:0.25rem;line-height:1}
    .wf-chart .mob-climate-temps .t-val{font-size:0.95rem;font-weight:800;color:var(--wf-text-primary);letter-spacing:-0.02em}
    .wf-chart .mob-climate-temps .t-lbl{font-size:0.6rem;font-weight:600;color:var(--wf-text-muted);text-transform:lowercase}
    .wf-chart .mob-climate-now{display:flex;align-items:center;gap:0.3rem;flex-shrink:0}
    .wf-chart .mob-climate-icon{display:flex;align-items:center;justify-content:center;line-height:0}
    .wf-chart .mob-climate-icon svg{width:34px;height:34px;display:block}
    .wf-chart .mob-climate-now-text{display:flex;flex-direction:column;gap:0.05rem;line-height:1}
    .wf-chart .mob-climate-now-text .mc-val{font-size:1.25rem;font-weight:800;color:var(--wf-text-primary);letter-spacing:-0.02em}
    .wf-chart .mob-climate-now-text .mc-uv{font-size:0.65rem;font-weight:600;color:var(--wf-text-muted)}
    .wf-chart .mob-climate-water{display:flex;align-items:center;gap:0.3rem;flex-shrink:0}
    .wf-chart .mob-climate-water span{font-size:1.1rem;font-weight:800;color:var(--wf-text-primary);letter-spacing:-0.02em}
    .wf-chart .mob-bottom-row{display:flex;gap:0.4rem}
    .wf-chart .mob-bx{background:#fff;border-radius:14px;padding:0.5rem 0.55rem;box-shadow:0 1px 2px rgba(0,0,0,0.04)}
    .wf-chart .mob-bx .bx-title{font-size:0.5rem;font-weight:700;text-transform:uppercase;letter-spacing:0.04em;color:var(--wf-text-muted);margin-bottom:0.15rem}
    .wf-chart .mob-bx .bx-row{display:flex;align-items:center;gap:0.3rem}
    .wf-chart .mob-bx .bx-val{font-size:1.1rem;font-weight:800;color:var(--wf-text-primary);line-height:1}
    .wf-chart .mob-bx .bx-sub{font-size:0.58rem;font-weight:600;color:var(--wf-text-muted)}
}