.snu-surf-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin:24px 0 18px}
.snu-surf-metric{background:#f5f5f5;border:1px solid #e5e7eb;border-radius:12px;padding:16px 18px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.snu-surf-metric span{display:block;color:#6b7280;font-size:13px;line-height:1.3;margin-bottom:8px}
.snu-surf-metric strong{display:block;color:#111827;font-size:24px;line-height:1.2;font-weight:700}
.snu-surf-rating{display:inline-block;background:#f5f5f5;border:1px solid #e5e7eb;border-radius:999px;padding:8px 14px;font-weight:600;margin:0 0 16px}
.snu-surf-summary{margin:12px 0 24px}
.snu-route-points{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:18px 0 22px}
.snu-route-point{background:#f5f5f5;border:1px solid #e5e7eb;border-radius:12px;padding:16px 18px}
.snu-route-point .snu-point-label{display:block;color:#6b7280;font-size:13px;margin-bottom:8px}
.snu-route-point .snu-point-value{display:block;color:#111827;font-size:22px;font-weight:700;line-height:1.25}
@media (max-width:640px){.snu-surf-metric strong{font-size:22px}.snu-route-point .snu-point-value{font-size:20px}}

.snu-weather-item-title{margin:0 0 6px;font-size:1.5rem;line-height:1.2}.snu-weather-item-title a{text-decoration:none;color:inherit}.snu-weather-item-title a:hover{text-decoration:underline;}

.snu-traffic-legend{margin-top:24px}

/* Bolinhas de status de trânsito (boletim, trechos, passos) */
.snu-traffic-dot{display:inline-block;width:12px;height:12px;border-radius:50%;margin-right:8px;vertical-align:middle;flex-shrink:0}
.snu-traffic-dot.snu-dot-green{background:#22c55e}
.snu-traffic-dot.snu-dot-yellow{background:#eab308}
.snu-traffic-dot.snu-dot-red{background:#ef4444}
.snu-route-point .snu-point-value .snu-traffic-dot{margin-right:6px}

/* Passo a passo em tabela */
.snu-traffic-steps-table .snu-step-col-num{width:3.25em;text-align:center;font-variant-numeric:tabular-nums}
.snu-traffic-steps-table td:first-child{font-weight:600;color:#374151}
.snu-traffic-steps-table .snu-step-td-agora{white-space:nowrap}
.snu-traffic-steps-table .snu-step-tempo-agora{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}
.snu-traffic-steps-table .snu-step-tempo-agora .snu-traffic-dot{flex-shrink:0;margin-right:0}
.snu-traffic-steps-table .snu-step-tempo-agora-text{line-height:1.35}
.snu-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.snu-traffic-step-level{display:inline-block;font-size:0.9em;font-weight:600;padding:2px 8px;border-radius:999px;line-height:1.35}
.snu-traffic-step-level--green{background:#dcfce7;color:#166534}
.snu-traffic-step-level--yellow{background:#fef9c3;color:#854d0e}
.snu-traffic-step-level--red{background:#fee2e2;color:#991b1b}
.snu-traffic-step-google{display:block;font-size:0.82em;color:#6b7280;margin-top:6px;line-height:1.3}
.snu-step-map-trigger{display:inline-block;padding:0;margin:0;border:none;background:transparent;cursor:pointer;border-radius:8px;line-height:0;vertical-align:top;transition:box-shadow .15s ease,transform .15s ease}
.snu-step-map-trigger:hover{box-shadow:0 4px 14px rgba(0,0,0,.12);transform:translateY(-1px)}
.snu-step-map-trigger:focus-visible{outline:2px solid #2563eb;outline-offset:3px}
/* Miniatura via background-image: evita o lazy/animation stack do tema em <img> */
.snu-step-map-thumb{display:block;width:160px;height:96px;border-radius:8px;border:1px solid #e5e7eb;vertical-align:top;pointer-events:none;background-color:#f1f5f9;background-repeat:no-repeat;background-position:center;background-size:cover;box-sizing:border-box}
.snu-step-col-map{min-width:168px}

body.snu-map-modal-open{overflow:hidden}

.snu-map-modal{position:fixed;inset:0;z-index:100050;display:flex;align-items:center;justify-content:center;padding:16px;box-sizing:border-box}
.snu-map-modal[hidden]{display:none}
.snu-map-modal__backdrop{position:absolute;inset:0;background:rgba(15,23,42,.65);backdrop-filter:blur(2px)}
.snu-map-modal__box{position:relative;z-index:1;max-width:min(90vw,calc(100vw - 48px));max-height:min(85vh,calc(100dvh - 48px));background:#fff;border-radius:12px;box-shadow:0 25px 50px -12px rgba(0,0,0,.35);padding:12px 12px 16px;margin:auto;overflow:auto}
.snu-map-modal__title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.snu-map-modal__close{position:absolute;top:8px;right:8px;z-index:2;width:40px;height:40px;padding:0;border:none;border-radius:999px;background:#f1f5f9;color:#0f172a;font-size:26px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s ease}
.snu-map-modal__close:hover{background:#e2e8f0}
.snu-map-modal__close:focus-visible{outline:2px solid #2563eb;outline-offset:2px}
.snu-map-modal__img{display:block;width:auto;max-width:100%;height:auto;max-height:min(76vh,760px);object-fit:contain;border-radius:8px;margin:0 auto}