@import url("./map-layouts.css");
/* Guidance-only additions. No weather, city, or Forecast Builder styles change. */
[data-hrrr-viewer] .ff-guidance-tools { display:flex; align-items:center; gap:6px; align-self:end; width:auto; }
[data-hrrr-viewer] .ff-guidance-tools button, [data-hrrr-viewer] .ff-guidance-shortcuts button {
  width:42px; height:42px; min-height:42px; flex:0 0 42px; display:inline-flex; align-items:center; justify-content:center;
  border:1px solid #356375; border-radius:9px; padding:0; background:#092533; color:#dff8ff; font-family:inherit; cursor:pointer;
}
[data-hrrr-viewer] .ff-icon-button svg { width:21px; height:21px; flex-shrink:0; pointer-events:none; }
[data-hrrr-viewer] .ff-icon-button:focus-visible { outline:2px solid #65ddff; outline-offset:2px; }
[data-hrrr-viewer] .ff-desk-button[aria-expanded="true"] { color:#061c27; background:#67d8ff; border-color:#a6edff; }
[data-hrrr-viewer] .ff-guidance-tools button:hover { border-color:#65ddff; color:#fff; }
[data-hrrr-viewer] .ff-guidance-shortcuts { display:none; }
.ff-guidance-panel { color:#e7f5fb; background:#081e2b; border:1px solid #4d889e; border-radius:18px; padding:24px; width:min(480px, calc(100vw - 24px)); max-height:calc(100dvh - 32px); box-sizing:border-box; overflow:auto; box-shadow:0 24px 90px #0009; font:inherit; }
.ff-guidance-panel::backdrop { background:rgba(0,12,19,.6); }
.ff-guidance-panel > header { display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid #2b5265; padding-bottom:16px; }
.ff-guidance-panel h2 { margin:0; font-size:1.5rem; }
.ff-guidance-panel p { line-height:1.5; font-size:.95rem; }
.ff-guidance-panel .ff-panel-intro { color:#bcd6e2; }
.ff-guidance-panel button, .ff-guidance-panel select { font:inherit; font-size:.95rem; color:#edfbff; background:#11394a; border:1px solid #40748b; border-radius:9px; min-height:44px; padding:9px 12px; cursor:pointer; }
.ff-guidance-panel button:hover { border-color:#64dafa; background:#174959; }
.ff-guidance-panel button:disabled { opacity:.5; cursor:wait; }
.ff-guidance-panel button:focus-visible, .ff-guidance-panel input:focus-visible, .ff-guidance-panel select:focus-visible { outline:3px solid #65ddff; outline-offset:3px; }
.ff-guidance-panel .ff-tool-done { color:#69e7bc; background:transparent; }
.ff-field { display:grid; gap:9px; margin:20px 0; }
.ff-field > span { color:#7bdcf8; font-size:.8rem; font-weight:800; letter-spacing:.05em; }
.ff-field select { width:100%; }
.ff-export-options { display:flex; flex-wrap:wrap; gap:12px; }
.ff-export-options > .ff-field { flex:1 1 130px; min-width:0; }
.ff-field input[type=range] { width:100%; accent-color:#64dafa; min-height:24px; }
.ff-overlay-toggle { display:flex; gap:12px; align-items:center; padding:14px; border:1px solid #356375; border-radius:12px; }
.ff-overlay-toggle input { width:22px; height:22px; accent-color:#67ddff; flex-shrink:0; }
.ff-overlay-toggle small { display:block; color:#a8c5d4; margin-top:4px; line-height:1.4; }
.ff-desk-actions, .ff-share-actions { display:flex; align-items:center; gap:10px; margin:16px 0; flex-wrap:wrap; }
.ff-desk-actions a { color:#74dafa; font-size:.9rem; }
.ff-tool-status { color:#6de6bb; min-height:1.5em; }
.ff-desk-valid { color:#bcd6e2; font-size:.85rem; }
.ff-desk-legend { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.ff-desk-legend span { display:flex; gap:8px; align-items:center; font-size:.85rem; }
.ff-desk-legend i { width:18px; height:18px; border:1px solid #fff5; border-radius:4px; flex-shrink:0; }
.ff-guidance-panel .ff-panel-note { color:#92afbe; font-size:.8rem; border-top:1px solid #294756; padding-top:14px; }
.ff-share-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:20px 0; }
.ff-share-choices button { padding:10px 6px; }
.ff-export-preview img, .ff-export-preview video { width:100%; display:block; border:1px solid #356375; border-radius:8px; }
.ff-guidance-panel progress { width:100%; accent-color:#61dcff; }
[data-hrrr-viewer] .ff-desk-badge { position:absolute; top:10px; right:12px; z-index:34; max-width:min(42%,420px); padding:10px 12px; color:#ecfaff; background:rgba(5,25,36,.94); border:1px solid #468799; border-radius:10px; font-size:12px; line-height:1.5; pointer-events:none; }
[data-hrrr-viewer].ff-desk-only [data-hrrr-hud] { visibility:hidden; }
[data-hrrr-viewer].is-product-card-hidden [data-hrrr-hud] { visibility:hidden; pointer-events:none; }
[data-hrrr-viewer] .ff-back-to-models { display:none; }
@media (min-width:900px) {
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-controls { display:flex !important; }
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].is-controls-collapsed > .outlook-hrrr-controls { display:none !important; }
  [data-hrrr-viewer] .ff-back-to-models:not([hidden]) { display:block; position:absolute; left:14px; bottom:10px; z-index:38; min-height:38px; padding:8px 14px; border:1px solid #62d8ff; border-radius:10px; background:rgba(5,25,36,.94); color:#edfaff; font:800 12px/1 system-ui,sans-serif; letter-spacing:.04em; text-transform:uppercase; box-shadow:0 5px 18px #0007; }
}
[data-hrrr-viewer] .ff-guidance-panel [hidden], [data-hrrr-viewer] .ff-guidance-panel[hidden], [data-hrrr-viewer] .ff-loop-crop[hidden], [data-hrrr-viewer] .ff-desk-badge[hidden] { display:none !important; }
@media (min-width:901px) and (min-height:621px) {
  [data-hrrr-viewer][data-guidance-tools="ready"] .outlook-hrrr-controls {
    display:grid !important; grid-template-columns:minmax(110px,1fr) minmax(190px,2fr) minmax(180px,1.5fr) 42px minmax(134px,.65fr) !important;
    grid-auto-flow:row; gap:8px !important; align-items:end;
  }
  [data-hrrr-viewer][data-guidance-tools="ready"] .outlook-hrrr-controls > label,
  [data-hrrr-viewer][data-guidance-tools="ready"] .outlook-hrrr-controls > .outlook-hrrr-appearance { width:auto !important; min-width:0 !important; }
  [data-hrrr-viewer][data-guidance-tools="ready"] .outlook-hrrr-controls > label > select { width:100%; min-width:0; }
  [data-hrrr-viewer][data-guidance-tools="ready"] .outlook-hrrr-appearance > summary { min-width:0; padding-inline:10px; white-space:nowrap; }
  [data-hrrr-viewer] .ff-guidance-tools { height:42px; }
}
@media (max-width:900px), (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-guidance-tools { display:none; }
  [data-hrrr-viewer] .ff-guidance-shortcuts { display:flex; position:absolute; bottom:10px; left:50%; right:auto; transform:translateX(-50%); gap:6px; z-index:38; }
  [data-hrrr-viewer].ff-desk-open [data-hrrr-hud] { visibility:hidden; }
  [data-hrrr-viewer] .ff-guidance-shortcuts button { width:38px; height:34px; min-height:34px; flex-basis:38px; padding:0; border-radius:999px; background:rgba(4,25,35,.78); border-color:#7ce3ffbd; }
  [data-hrrr-viewer] .ff-guidance-shortcuts svg { width:18px; height:18px; }
}
@media (orientation:landscape) and (max-height:620px) {
  .ff-guidance-panel { margin:8px 12px 8px auto; max-height:calc(100dvh - 16px); padding:18px; }
  [data-hrrr-viewer] .ff-desk-badge { max-width:36%; font-size:11px; }
}
@media (max-width:600px) {
  [data-hrrr-viewer] .ff-guidance-shortcuts { left:calc(50% - 30px); }
}
@media (max-width:350px) {
  [data-hrrr-viewer] .ff-guidance-shortcuts { left:50%; bottom:52px; }
  [data-hrrr-viewer] .outlook-hrrr-heading-title > strong { font-size:12px !important; letter-spacing:.05em !important; line-height:1.25 !important; }
}
@media (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-guidance-shortcuts { bottom:calc(max(10px, env(safe-area-inset-bottom)) + 52px); }
}

/* The desk is an overlay, never another grid row or a blocking modal. */
[data-hrrr-viewer] .ff-desk-dropdown {
  position:absolute; z-index:60; inset:8px 8px auto auto; margin:0; width:min(740px,calc(100% - 16px));
  max-height:calc(100% - 62px); padding:12px 16px; border-radius:12px; background:rgba(6,28,40,.97); box-shadow:0 12px 35px #0006;
  overscroll-behavior:contain; scrollbar-width:thin; animation:ff-desk-drop 150ms ease-out;
}
[data-hrrr-viewer] .ff-desk-dropdown > header { padding:0 0 6px; border:0; }
@media (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-desk-dropdown { max-height:calc(100% - 112px); }
}
[data-hrrr-viewer] .ff-desk-dropdown h2 { font-size:16px; letter-spacing:.02em; }
[data-hrrr-viewer] .ff-desk-dropdown header small { color:#9bbdce; font-size:11px; }
[data-hrrr-viewer] .ff-desk-dropdown header button { width:32px; min-height:32px; height:32px; padding:5px; display:grid; place-items:center; background:transparent; border:0; }
[data-hrrr-viewer] .ff-desk-tabs { display:flex; gap:4px; border-bottom:1px solid #335765; margin-bottom:10px; }
[data-hrrr-viewer] .ff-desk-tabs button { flex:1; border:0; border-bottom:2px solid transparent; border-radius:6px 6px 0 0; min-height:38px; padding:6px 12px; background:transparent; color:#99b9cb; font-size:12px; font-weight:900; letter-spacing:.08em; }
[data-hrrr-viewer] .ff-desk-tabs button[aria-selected="true"] { color:#80e2ff; background:#123646; border-bottom-color:#6ad9ff; }
[data-hrrr-viewer] .ff-desk-settings { display:grid; grid-template-columns:minmax(180px,1.3fr) minmax(145px,1fr) minmax(105px,.7fr); align-items:end; gap:14px; }
[data-hrrr-viewer] .ff-desk-dropdown .ff-field { margin:0; gap:5px; min-width:0; }
[data-hrrr-viewer] .ff-desk-dropdown .ff-field > span { font-size:10px; letter-spacing:.06em; text-transform:uppercase; }
[data-hrrr-viewer] .ff-desk-dropdown select { width:100%; min-width:0; height:40px; min-height:40px; padding:6px 8px; font-size:12px; }
[data-hrrr-viewer] .ff-desk-product-rail { display:none; }
[data-hrrr-viewer] .ff-desk-dropdown .ff-overlay-toggle { min-height:40px; padding:0; gap:7px; border:0; border-radius:0; font-size:12px; }
[data-hrrr-viewer] .ff-desk-dropdown .ff-overlay-toggle small { font-size:10px; }
[data-hrrr-viewer] .ff-desk-dropdown .ff-overlay-toggle input { width:18px; height:18px; }
[data-hrrr-viewer] .ff-desk-dropdown input[type=range] { margin:0; min-height:40px; }
[data-hrrr-viewer] .ff-desk-summary { display:flex; gap:10px; align-items:center; justify-content:space-between; margin-top:8px; }
[data-hrrr-viewer] .ff-desk-dropdown p { position:static; inset:auto; transform:none; margin:4px 0; padding:0; background:none; border:0; width:auto; max-width:none; font-size:11px; line-height:1.5; text-align:left; color:#abc8d6; font-weight:400; letter-spacing:normal; }
[data-hrrr-viewer] .ff-desk-dropdown [data-desk-status][data-state="error"] { color:#ffb5a8; }
[data-hrrr-viewer] .ff-desk-actions { margin:0; gap:10px; flex-wrap:nowrap; }
[data-hrrr-viewer] .ff-desk-actions button { min-height:30px; padding:3px 6px; border:0; background:none; font-size:11px; }
[data-hrrr-viewer] .ff-desk-actions a { font-size:11px; }
[data-hrrr-viewer] .ff-desk-legend { display:flex; flex-wrap:wrap; gap:6px 14px; margin:4px 0; max-height:80px; overflow:auto; }
[data-hrrr-viewer] .ff-desk-legend span { font-size:11px; gap:5px; }
[data-hrrr-viewer] .ff-desk-legend i { width:11px; height:11px; border-radius:2px; }
[data-hrrr-viewer] .ff-desk-details { margin-top:5px; color:#9abaca; font-size:10px; }
[data-hrrr-viewer] .ff-desk-details summary { cursor:pointer; width:fit-content; padding:4px 0; }
[data-hrrr-viewer].ff-desk-open .ff-desk-badge { visibility:hidden; }
[data-hrrr-viewer] .ff-desk-badge { pointer-events:auto; font-size:11px; max-width:min(35%,330px); }
[data-hrrr-viewer] .ff-desk-badge small { color:#a3c6d5; display:block; font-size:10px; }
[data-hrrr-viewer] .ff-feature-card { position:absolute; z-index:66; left:50%; bottom:10px; transform:translateX(-50%); width:min(340px,calc(100% - 20px)); max-height:calc(100% - 76px); box-sizing:border-box; overflow:auto; overscroll-behavior:contain; padding:14px; border:1px solid #5c8d9f; border-radius:12px; color:#e2f3fb; background:#092432; box-shadow:0 10px 35px #0007; }
[data-hrrr-viewer] .ff-feature-card[hidden] { display:none !important; }
[data-hrrr-viewer] .ff-alert-panel { position:absolute; z-index:35; right:12px; top:10px; width:min(310px,calc(100% - 24px)); max-height:calc(100% - 24px); overflow:auto; overscroll-behavior:contain; box-sizing:border-box; padding:12px; border:1px solid #468799; border-radius:12px; background:#082330f5; color:#e4f5fc; box-shadow:0 8px 28px #0005; }
[data-hrrr-viewer] .ff-alert-panel[hidden], [data-hrrr-viewer] .ff-alert-panel [hidden] { display:none !important; }
[data-hrrr-viewer].ff-desk-open .ff-alert-panel { visibility:hidden; }
[data-hrrr-viewer] .ff-alert-header { display:flex; align-items:center; gap:6px; padding-bottom:8px; border-bottom:1px solid #315568; }
[data-hrrr-viewer] .ff-alert-heading { flex:1; min-width:0; color:#e4f5fc; font-family:inherit; font-size:16px; font-weight:700; line-height:1.3; }
[data-hrrr-viewer] .ff-alert-panel .ff-alert-header button, [data-hrrr-viewer] #ff-alert-settings > button { min-height:40px; padding:6px 8px; border:1px solid #3f6778; border-radius:7px; background:#103242; color:#d9edf5; font-family:inherit; font-size:11px; cursor:pointer; }
[data-hrrr-viewer] .ff-alert-header button[aria-expanded="true"] { color:#071d29; background:#66dafb; }
[data-hrrr-viewer] .ff-alert-trigger { position:absolute; z-index:36; right:12px; top:10px; display:flex; align-items:center; gap:7px; min-height:44px; padding:8px 10px; border:1px solid #aa525f; border-radius:10px; background:#102b38ed; color:#e6f5fa; box-shadow:0 3px 14px #0005; font-family:inherit; font-size:12px; cursor:pointer; }
[data-hrrr-viewer] .ff-alert-trigger svg { width:22px; height:22px; color:#ff6672; }
[data-hrrr-viewer] .ff-alert-trigger b { min-width:14px; font-size:11px; }
[data-hrrr-viewer] .ff-alert-trigger[data-state="error"] { border-color:#edb44d; }
[data-hrrr-viewer] .ff-alert-trigger[aria-expanded="true"] { background:#24404c; }
[data-hrrr-viewer] .ff-desk-badge { top:62px; }
[data-hrrr-viewer].ff-alerts-open .ff-desk-badge { visibility:hidden; }
[data-hrrr-viewer].ff-desk-open .ff-alert-trigger { visibility:hidden; }
[data-hrrr-viewer] .ff-alert-panel { top:62px; max-height:calc(100% - 74px); width:min(340px,calc(100% - 24px)); }
[data-hrrr-viewer] .ff-alert-opacity { display:grid; grid-template-columns:1fr auto; gap:8px; margin:14px 0; font-size:12px; }
[data-hrrr-viewer] .ff-alert-opacity input { grid-column:1/-1; width:100%; accent-color:#65dfff; }
[data-hrrr-viewer] .ff-alert-opacity output { position:static; width:auto; background:none; padding:0; font-size:12px; color:#65dfff; }
[data-hrrr-viewer] .ff-alert-status[data-state="error"] { color:#ffd097; }
[data-hrrr-viewer] .ff-alert-quick-controls { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:6px; margin-top:8px; }
[data-hrrr-viewer] .ff-alert-quick-toggle { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-width:0; min-height:48px; padding:6px 4px; border:1px solid #62717b; border-radius:7px; background:#273943; color:#c5d0d6; font-family:inherit; font-size:11px; line-height:1.25; text-align:center; cursor:pointer; }
[data-hrrr-viewer] .ff-alert-quick-toggle strong { font-size:10px; letter-spacing:.07em; }
[data-hrrr-viewer] .ff-alert-quick-toggle[aria-pressed="true"] { background:#113c36; color:#94f4d3; border-color:#479f86; }
[data-hrrr-viewer] .ff-radar-coming { color:#ff7888; font-family:inherit; font-size:11px; font-weight:800; text-align:right; line-height:1.35; }
[data-hrrr-viewer] .ff-alert-status, [data-hrrr-viewer] .ff-alert-note { display:block; margin:8px 0; color:#b0cdd9; font-size:11px; line-height:1.4; }
[data-hrrr-viewer] .ff-alert-filters { display:grid; gap:4px; padding:6px 0; }
[data-hrrr-viewer] .ff-alert-filters label { display:flex; align-items:center; gap:7px; min-height:30px; font-size:12px; line-height:1.3; cursor:pointer; }
[data-hrrr-viewer] .ff-alert-filters input { margin:0; width:17px; height:17px; flex:0 0 17px; accent-color:#65dfff; }
[data-hrrr-viewer] .ff-alert-filters span { flex:1; }
[data-hrrr-viewer] .ff-alert-filters b { font-size:11px; color:#9dbdcd; }
[data-hrrr-viewer] .ff-alert-filters i { width:10px; height:10px; flex:0 0 10px; border-radius:2px; border:1px solid #fff6; }
[data-hrrr-viewer] .ff-alert-panel summary { padding:8px 0; cursor:pointer; color:#80dbee; font-size:12px; }
[data-hrrr-viewer] .ff-alert-list { display:grid; gap:7px; margin-top:8px; }
[data-hrrr-viewer] .ff-alert-item { width:100%; display:grid; gap:5px; padding:10px; border:1px solid #365969; border-left:4px solid; border-radius:7px; background:#103242; text-align:left; color:#d9ebf4; font-family:inherit; cursor:pointer; }
[data-hrrr-viewer] .ff-alert-item strong { font-size:13px; line-height:1.4; }
[data-hrrr-viewer] .ff-alert-item span, [data-hrrr-viewer] .ff-alert-item small { font-size:11px; line-height:1.4; }
[data-hrrr-viewer] .ff-alert-item:hover { background:#174253; }
[data-hrrr-viewer] .ff-alert-panel :focus-visible { outline:2px solid #65ddff; outline-offset:2px; }
[data-hrrr-viewer] .ff-alert-panel p { position:static; inset:auto; transform:none; margin:8px 0; width:auto; background:none; color:#b0cdd9; font-size:12px; line-height:1.5; text-align:left; }
@media (max-width:600px) {
  [data-hrrr-viewer] .ff-alert-panel { max-height:min(55%,calc(100% - 74px)); width:min(320px,calc(100% - 24px)); }
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-hud] { min-width:0 !important; width:min(300px,calc(100% - 96px)) !important; max-width:calc(100% - 96px) !important; }
  [data-hrrr-viewer].ff-alerts-open [data-hrrr-hud] { visibility:hidden; }
  [data-hrrr-viewer] .ff-alert-trigger > span { display:none; }
  [data-hrrr-viewer] .ff-radar-coming { font-size:10px; max-width:96px; }
}
@media (max-width:350px) {
  [data-hrrr-viewer] .outlook-hrrr-heading-title { grid-template-columns:minmax(0,1fr); }
  [data-hrrr-viewer] .outlook-hrrr-heading-title > strong { min-width:0; font-size:11px !important; white-space:normal !important; }
  [data-hrrr-viewer] .outlook-hrrr-heading-credit { min-width:0; white-space:normal !important; font-size:6px !important; letter-spacing:.04em !important; }
  [data-hrrr-viewer] .ff-radar-coming { font-size:9px; max-width:68px; letter-spacing:.03em; }
}
@media (max-height:500px) and (orientation:landscape) { [data-hrrr-viewer] .ff-alert-panel { max-height:calc(100% - 74px); width:min(320px,45%); } }
[data-hrrr-viewer] .ff-feature-card header { display:flex; justify-content:space-between; align-items:center; gap:10px; font-size:12px; }
[data-hrrr-viewer] .ff-feature-card article { padding:10px 0; border-top:1px solid #365969; margin-top:10px; }
[data-hrrr-viewer] .ff-feature-card h3 { font-size:14px; padding-left:8px; border-left:5px solid; margin:0 0 8px; }
[data-hrrr-viewer] .ff-feature-card h4 { font-size:12px; margin:12px 0 6px; }
[data-hrrr-viewer] .ff-feature-card p { position:static; inset:auto; transform:none; width:auto; max-width:none; background:none; padding:0; margin:6px 0; font-size:12px; line-height:1.5; text-align:left; color:#d2e6f0; font-weight:400; letter-spacing:normal; white-space:pre-line; }
[data-hrrr-viewer] .ff-feature-card small { font-size:11px; color:#b0cddb; }
[data-hrrr-viewer] .ff-feature-card button { min-height:36px; padding:6px 10px; border:1px solid #47768b; border-radius:7px; background:#123e50; color:#d6f6ff; font-family:inherit; font-size:12px; cursor:pointer; }
[data-hrrr-viewer] .ff-feature-card.ff-feature-outlook { width:min(280px,calc(100% - 20px)); max-height:min(260px,calc(100% - 76px)); padding:10px 12px; }
[data-hrrr-viewer] .ff-feature-card.ff-feature-outlook article { padding:7px 0; margin-top:7px; }
[data-hrrr-viewer] .ff-feature-card.ff-feature-outlook h3 { font-size:13px; margin-bottom:4px; }
[data-hrrr-viewer] .ff-feature-card.ff-feature-outlook p { margin:3px 0; font-size:11px; }

/* Crop handles sit directly over the existing scrubber; actions float above it. */
[data-hrrr-viewer] .outlook-hrrr-timeline { position:relative; }
[data-hrrr-viewer] .ff-loop-crop { position:absolute; inset:0; z-index:65; pointer-events:none; }
[data-hrrr-viewer] .ff-loop-crop-track { position:absolute; left:var(--crop-left); width:var(--crop-width); top:var(--crop-top); height:44px; transform:translateY(-50%); }
[data-hrrr-viewer] .ff-loop-crop-selection { position:absolute; top:15px; bottom:15px; left:calc(12px + (100% - 24px)*var(--crop-first)); right:calc(12px + (100% - 24px)*(1 - var(--crop-last))); background:#60daff; border:2px solid #b9f3ff; border-radius:3px; box-shadow:0 0 0 1px #0e495e; }
[data-hrrr-viewer] .ff-loop-crop input[type=range] { appearance:none; -webkit-appearance:none; position:absolute; inset:0; width:100%; height:44px; min-height:44px; padding:0; margin:0; border:0; background:transparent; pointer-events:none; touch-action:none; }
[data-hrrr-viewer] .ff-loop-crop input[type=range]::-webkit-slider-runnable-track { height:12px; background:transparent; border:0; }
[data-hrrr-viewer] .ff-loop-crop input[type=range]::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:24px; height:40px; margin-top:-14px; background:linear-gradient(90deg,#79e3ff 9px,#134c60 9px,#134c60 11px,#79e3ff 11px,#79e3ff 14px,#134c60 14px,#134c60 16px,#79e3ff 16px); border:2px solid #d0f8ff; border-radius:6px; box-shadow:0 2px 8px #0006; cursor:ew-resize; pointer-events:auto; }
[data-hrrr-viewer] .ff-loop-crop input[type=range]::-moz-range-track { height:12px; background:transparent; border:0; }
[data-hrrr-viewer] .ff-loop-crop input[type=range]::-moz-range-thumb { width:20px; height:36px; background:#79e3ff; border:2px solid #d0f8ff; border-radius:6px; cursor:ew-resize; pointer-events:auto; }
[data-hrrr-viewer] .ff-loop-crop input:focus-visible { outline:0; z-index:2; }
[data-hrrr-viewer] .ff-loop-crop input:focus-visible::-webkit-slider-thumb { outline:3px solid #ffd365; outline-offset:2px; }
[data-hrrr-viewer] .ff-loop-crop input:focus-visible::-moz-range-thumb { outline:3px solid #ffd365; outline-offset:2px; }
[data-hrrr-viewer] .ff-loop-crop-actions { position:absolute; bottom:calc(100% + 8px); right:8px; max-width:calc(100% - 16px); display:flex; align-items:center; gap:10px; padding:10px 12px; border:1px solid #47849a; border-radius:10px; background:#082330; color:#edfaff; box-shadow:0 6px 25px #0007; pointer-events:auto; }
[data-hrrr-viewer] .ff-loop-crop-actions > span { display:grid; gap:3px; min-width:0; }
[data-hrrr-viewer] .ff-loop-crop-actions strong { font-size:11px; color:#79dfff; }
[data-hrrr-viewer] .ff-loop-crop-actions output { position:static; width:auto; padding:0; border:0; background:none; color:#edfaff; font-family:inherit; font-weight:700; font-size:12px; }
[data-hrrr-viewer] .ff-loop-crop-actions small { font-size:10px; color:#adcad8; }
[data-hrrr-viewer] .ff-loop-crop-actions button { min-height:40px; padding:7px 11px; border:1px solid #46778d; border-radius:7px; font-family:inherit; font-size:12px; color:#e7faff; background:#133c4c; white-space:nowrap; cursor:pointer; }
[data-hrrr-viewer] .ff-loop-crop-actions [data-crop-confirm] { background:#68daff; color:#061c27; font-weight:800; }
[data-hrrr-viewer].ff-selecting-loop [data-hrrr-scrubber] { opacity:.35; }
@media (max-width:600px) {
  [data-hrrr-viewer] .ff-desk-dropdown { padding:10px 12px; }
  [data-hrrr-viewer] .ff-desk-settings { grid-template-columns:1fr 1fr; gap:10px; }
  [data-hrrr-viewer] .ff-desk-layer { grid-column:1 / -1; }
  [data-hrrr-viewer] .ff-desk-summary { align-items:start; flex-direction:column; gap:0; }
  [data-hrrr-viewer] .ff-loop-crop-actions { flex-wrap:wrap; gap:6px; }
  [data-hrrr-viewer] .ff-loop-crop-actions > span { flex:1 0 100%; }
  [data-hrrr-viewer] .ff-loop-crop-actions button { flex:1; }
}
@keyframes ff-desk-drop { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) { [data-hrrr-viewer] .ff-desk-dropdown { animation:none; } }

.outlook-hrrr-display-controls > .ff-city-settings { width:100%; min-width:0; box-sizing:border-box; margin:0; padding:14px 12px; border-top:1px solid #315568; }
.ff-city-settings .outlook-map-detail-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.ff-city-settings .outlook-map-detail-heading > span { color:#7cacbe; font-size:9px; font-weight:900; letter-spacing:.1em; }
.ff-city-settings .outlook-map-detail-heading button { height:28px; padding:5px 8px; border:1px solid #3e7185; border-radius:7px; color:#83d9ef; background:transparent; font-size:8px; font-weight:900; }
.ff-city-settings .outlook-detail-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; min-height:40px; padding:7px 10px; border:1px solid #668995; border-radius:9px; background:#0b2431; color:#b6d0dc; font-size:11px; font-weight:800; cursor:pointer; }
.ff-city-settings .outlook-detail-toggle b { padding:5px 10px; border-radius:20px; font-size:9px; background:#061a25; }
.ff-city-settings .outlook-detail-toggle[aria-pressed="true"] { border-color:#ffd363; color:#fff3cf; background:#413515; }
.ff-city-settings .outlook-detail-toggle[aria-pressed="true"] b { color:#352705; background:#ffd363; }
.ff-city-settings .outlook-detail-options { display:grid; grid-template-columns:1fr; gap:12px; padding:10px; margin-top:8px; border:1px solid #355d70; border-radius:9px; }
.ff-city-settings .outlook-detail-options[hidden], .ff-city-settings [hidden] { display:none !important; }
.ff-city-settings .outlook-detail-options > label:not(.outlook-hrrr-check) { display:grid; grid-template-columns:1fr; gap:7px; min-width:0; }
.ff-city-settings .outlook-detail-options > label > span { display:flex; align-items:center; justify-content:space-between; color:#b6d4e1; font-size:10px; }
.ff-city-settings .outlook-detail-options input[type=range], .ff-city-settings .outlook-detail-options select { width:100%; min-width:0; box-sizing:border-box; accent-color:#64dafa; }
.ff-city-settings .outlook-detail-options output { color:#66dafa; font-size:10px; }
.ff-city-settings .outlook-hrrr-check > span { display:block !important; }
.ff-city-settings .outlook-detail-options select { height:40px; padding:8px; background:#071f2b; color:#e5f7fc; border:1px solid #3c687c; border-radius:7px; font-family:inherit; font-size:11px; }
.ff-city-settings .ff-city-error { display:block; color:#ffb8ab; font-size:11px; padding-top:8px; }

[data-hrrr-viewer] .ff-desk-badge summary { cursor: pointer; font-weight: 800; }
@media (max-width: 899px) {
  [data-hrrr-viewer] .ff-desk-badge {
    top: auto; right: auto; bottom: calc(max(10px, env(safe-area-inset-bottom)) + 44px); left: 10px;
    width: calc(100% - 20px); max-width: none; max-height: 104px;
    box-sizing: border-box; overflow-y: auto; padding: 7px 10px;
    font-size: 10px; line-height: 1.25;
  }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend { gap: 4px 10px; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend span { font-size: 10px; }
}

@media (max-width: 899px) {
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend {
    flex-wrap: nowrap; overflow-x: auto; max-height: 28px;
  }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend span { white-space: nowrap; }
}

@media (orientation: landscape) and (max-height: 620px) {
  [data-hrrr-viewer] .ff-desk-badge {
    bottom: calc(max(10px, env(safe-area-inset-bottom)) + 96px);
  }
}

/* Keep the off action available even when legend details are collapsed. */
[data-hrrr-viewer] .ff-desk-badge summary { display:flex; align-items:center; gap:8px; padding-right:0; position:relative; overflow:visible; }
[data-hrrr-viewer] .ff-desk-badge-title { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
[data-hrrr-viewer] .ff-desk-off { position:static; flex:none; min-height:20px; padding:0 6px; border:1px solid #71c9df; border-radius:6px; color:#ecfaff; background:#123644; font:inherit; font-size:10px; line-height:18px; cursor:pointer; }
/* Crop-specific styles must win over the phone's circular playback thumb. */
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop input[type=range]::-webkit-slider-thumb {
  width:22px; height:32px; margin-top:-10px; border-radius:5px;
  border:2px solid #d0f8ff; background:#67dbff;
}
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop input[type=range]::-webkit-slider-runnable-track { height:12px; background:transparent; border:0; }
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop input[type=range]::-moz-range-thumb { width:18px; height:28px; border-radius:5px; background:#67dbff; }
.ff-loop-exact { display:flex; gap:12px; }
.ff-loop-exact label { display:flex; align-items:center; gap:6px; font-size:11px; }
.ff-loop-exact select { width:82px; min-height:32px; padding:3px 6px; background:#123747; color:#edfbff; border:1px solid #528396; border-radius:5px; }
.ff-export-framing { position:absolute; z-index:70; left:10px; right:10px; bottom:74px; display:flex; align-items:center; gap:8px; padding:10px; background:#082330; border:1px solid #67dbff; border-radius:10px; }
.ff-export-framing[hidden] { display:none; }
.ff-export-framing span { flex:1; font-size:12px; }
.ff-export-framing button { min-height:40px; padding:6px 10px; background:#67dbff; color:#061c27; border:0; border-radius:6px; font-weight:800; }
@media(max-width:600px) {
  [data-hrrr-viewer].ff-selecting-loop .outlook-hrrr-timeline > :not(.ff-loop-crop) { visibility:hidden; }
  [data-hrrr-viewer] .ff-loop-crop-actions { left:8px; right:8px; padding:8px; }
  [data-hrrr-viewer] .ff-loop-crop-actions small { display:none; }
  .ff-export-framing { flex-wrap:wrap; }
  .ff-export-framing span { flex-basis:100%; }
  .ff-export-framing button { flex:1; }
}
/* The phone playback footer clips children; selection actions must escape it. */
.outlook-builder-dialog [data-hrrr-viewer].ff-selecting-loop .outlook-hrrr-timeline { overflow:visible !important; z-index:71 !important; }
.outlook-builder-dialog [data-hrrr-viewer].ff-selecting-loop [data-hrrr-scrubber] { opacity:0 !important; }
.outlook-builder-dialog [data-hrrr-viewer].ff-selecting-loop .outlook-hrrr-slider { visibility:hidden !important; }

/* Export modes own their controls, independently of Builder ancestor markup. */
[data-hrrr-viewer].ff-selecting-loop .outlook-hrrr-timeline > :not(.ff-loop-crop),
[data-hrrr-viewer].ff-selecting-loop [data-hrrr-scrubber] { visibility:hidden !important; pointer-events:none !important; }
[data-hrrr-viewer].ff-selecting-loop .outlook-hrrr-timeline { overflow:visible !important; }
[data-hrrr-viewer] .ff-export-framing:not([hidden]) { display:flex !important; visibility:visible !important; z-index:150 !important; pointer-events:auto !important; bottom:70px; }
[data-hrrr-viewer].ff-adjusting-export .ff-guidance-shortcuts,
[data-hrrr-viewer].ff-adjusting-export .outlook-hrrr-mobile-controls-toggle,
[data-hrrr-viewer].ff-adjusting-export .outlook-hrrr-mobile-map-toggle { visibility:hidden !important; }

[data-hrrr-viewer] .ff-loop-crop-track::before { content:""; position:absolute; left:11px; right:11px; top:15px; height:14px; box-sizing:border-box; border:1px solid #6b9cae; border-radius:4px; background:#244553; }
/* Compact, centered selection summary and exact interval controls. */
[data-hrrr-viewer] .ff-loop-crop-actions > span { display:grid !important; grid-template-columns:auto 1fr; align-items:center; gap:6px 10px !important; }
[data-hrrr-viewer] .ff-loop-crop-actions strong { white-space:nowrap; }
[data-hrrr-viewer] .ff-loop-crop-actions output { margin:0 !important; padding:0 !important; min-height:0 !important; line-height:1.3 !important; text-align:right; }
[data-hrrr-viewer] .ff-loop-crop-actions small { grid-column:1/-1; }
[data-hrrr-viewer] .ff-loop-exact { grid-column:1/-1; justify-content:center; align-items:center; }
[data-hrrr-viewer] .ff-loop-exact label { margin:0 !important; padding:0 !important; }
[data-hrrr-viewer] .ff-loop-crop-actions { padding:8px !important; gap:7px !important; }
@media (min-width:600px) and (max-height:620px) {
  [data-hrrr-viewer] .ff-loop-crop-actions { left:8px; right:8px; max-width:none; flex-wrap:nowrap; padding:6px !important; }
  [data-hrrr-viewer] .ff-loop-crop-actions > span { display:flex !important; flex:1; flex-wrap:wrap; justify-content:center; gap:4px 9px !important; }
  [data-hrrr-viewer] .ff-loop-crop-actions small { display:none !important; }
  [data-hrrr-viewer] .ff-loop-exact { gap:8px; }
  [data-hrrr-viewer] .ff-loop-exact select { width:67px; }
  [data-hrrr-viewer] .ff-loop-crop-actions button { flex:none; }
}
@media (min-width:600px) and (max-height:620px) {
  [data-hrrr-viewer] .ff-loop-crop-actions { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 10px !important; }
  [data-hrrr-viewer] .ff-loop-crop-actions > span { grid-column:1; grid-row:1/3; }
  [data-hrrr-viewer] .ff-loop-crop-actions [data-crop-cancel] { grid-column:2; grid-row:1; min-height:28px; padding:4px 9px; }
  [data-hrrr-viewer] .ff-loop-crop-actions [data-crop-confirm] { grid-column:2; grid-row:2; min-height:34px; padding:5px 9px; }
}
@media (min-width:900px) {
  [data-hrrr-viewer] .ff-desk-badge { top:auto; bottom:10px; left:50%; right:auto; transform:translateX(-50%); width:max-content; min-width:340px; max-width:min(620px,calc(100% - 24px)); box-sizing:border-box; padding:7px 10px; }
  [data-hrrr-viewer].ff-alerts-open .ff-desk-badge { visibility:visible; }
}
/* Desktop agency accordion; phone arrangement remains separate. */
.ff-parameter-rail { display:none; }
 .ff-model-dock-toggle { display:none; }
.ff-model-actions-row { display:contents; }
@media (min-width:900px) {
  [data-hrrr-viewer] .ff-model-dock-toggle { display:grid; place-items:center; position:absolute; bottom:12px; left:12px; z-index:40; width:36px; height:36px; padding:7px; border:1px solid #31596a; border-radius:6px; background:#071d29; color:#c8e3ee; }
  [data-hrrr-viewer] .ff-model-dock-toggle[aria-expanded="true"] { border-color:#70dcfa; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > .ff-model-actions-row { display:flex; flex-direction:row; align-items:center; gap:8px; order:2; }
  [data-hrrr-viewer] .ff-model-actions-row > .ff-guidance-tools { flex:0 0 auto; margin:0; padding:0; border:0; }
  [data-hrrr-viewer] .ff-model-actions-row > .outlook-hrrr-appearance { flex:1; width:auto; min-width:0; margin:0; padding:0; border:0; }
  [data-hrrr-viewer]:not(.is-controls-collapsed) { --ff-model-dock:250px; }
  [data-hrrr-viewer].is-controls-collapsed { --ff-model-dock:0px; }
  [data-hrrr-viewer] > .outlook-hrrr-controls { grid-area:guidance-map; align-self:stretch; justify-self:start; width:250px !important; min-width:0; box-sizing:border-box; display:flex !important; flex-direction:column; overflow-y:auto; max-height:100%; padding:12px; z-index:3; }
  [data-hrrr-viewer].is-controls-collapsed > .outlook-hrrr-controls { display:none !important; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > * { flex:none; width:100%; }
  [data-hrrr-viewer][data-guidance-tools="ready"] > .outlook-hrrr-controls > label { width:100% !important; max-width:none !important; margin:0 !important; min-width:0 !important; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > label:has([data-hrrr-model]) { order:0; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > label:has([data-hrrr-run]) { order:1; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > label:has([data-hrrr-parameter]) { order:3; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > .ff-guidance-tools,
  [data-hrrr-viewer] > .outlook-hrrr-controls > .outlook-hrrr-appearance { order:2; align-self:stretch; margin:0; }
  [data-hrrr-viewer] [data-hrrr-parameter] { display:none; }
  [data-hrrr-viewer] .ff-parameter-rail { display:grid; gap:4px; }
  [data-hrrr-viewer] .ff-parameter-rail strong { margin-top:9px; color:#8cb8c9; font-size:10px; }
  [data-hrrr-viewer] .ff-parameter-rail button { text-align:left; padding:8px; border:1px solid #31596a; border-radius:5px; background:#071d29; color:#c8e3ee; font-size:11px; }
  [data-hrrr-viewer] .ff-parameter-rail button[aria-pressed=true] { background:#164358; border-color:#70dcfa; color:white; }
   .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] [data-hrrr-image-wrap] { width:calc(100% - var(--ff-model-dock)) !important; margin-left:var(--ff-model-dock); }
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].ff-desk-open [data-hrrr-image-wrap] { width:calc(100% - var(--ff-model-dock) - 300px) !important; margin-right:300px; }
  [data-hrrr-viewer] > .ff-desk-dropdown { position:relative !important; grid-area:guidance-map; justify-self:end; align-self:stretch; box-sizing:border-box; width:300px !important; max-width:300px !important; height:100%; max-height:100% !important; inset:auto !important; margin:0; border-radius:0; }
  [data-hrrr-viewer] .ff-desk-dropdown { left:auto; right:10px; top:10px; bottom:auto; width:260px; max-width:calc(100% - 20px); max-height:calc(100% - 20px); padding:12px; overflow-y:auto; }
  [data-hrrr-viewer] .ff-desk-tabs { flex-direction:column; gap:3px; border:0; margin:10px 0; }
  [data-hrrr-viewer] .ff-desk-tabs button { flex:none; text-align:left; min-height:36px; border-radius:5px; padding:7px 10px; }
  [data-hrrr-viewer] .ff-desk-tabs > button::after { content:'›'; float:right; }
  [data-hrrr-viewer] .ff-desk-tabs > button[aria-selected=true]::after { content:'⌄'; }
  [data-hrrr-viewer] .ff-desk-tabs .ff-desk-layer { padding:6px 2px 9px; }
  [data-hrrr-viewer] .ff-desk-tabs .ff-desk-layer > span { display:none; }
  [data-hrrr-viewer] .ff-desk-tabs .ff-desk-select { display:none; }
  [data-hrrr-viewer] .ff-desk-tabs .ff-desk-product-rail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px; }
  [data-hrrr-viewer] .ff-desk-product-rail strong { grid-column:1 / -1; margin:4px 2px 1px; color:#8cb8c9; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
  [data-hrrr-viewer] .ff-desk-product-rail button { min-height:32px; padding:5px 6px; border:1px solid #31596a; border-radius:6px; background:#071d29; color:#c8e3ee; font:400 11px/1.3 Arial,sans-serif; text-align:center; letter-spacing:0; display:flex; align-items:center; justify-content:center; }
  [data-hrrr-viewer] .ff-desk-product-rail button[aria-pressed=true] { border-color:#70dcfa; background:#164358; color:#fff; box-shadow:inset 3px 0 #70dcfa; }
  [data-hrrr-viewer] .ff-desk-settings { grid-template-columns:1fr; gap:8px; border-top:1px solid #335765; padding-top:10px; }
  [data-hrrr-viewer] .ff-desk-dropdown > .ff-desk-legend,
  [data-hrrr-viewer] .ff-desk-dropdown > .ff-desk-details,
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-refresh],
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-source],
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-status]:not([data-state=error]) { display:none !important; }
  [data-hrrr-viewer] .ff-desk-summary { justify-content:flex-end; flex-wrap:wrap; margin-top:3px; }
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-status][data-state=error],
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-status][data-state=loading] { flex-basis:100%; }
  [data-hrrr-viewer].ff-desk-open .ff-desk-badge { visibility:visible; }
}
.ff-weather-tabs { display:none; }
@media (min-width:900px) {
  [data-hrrr-viewer] .ff-desk-button { display:none !important; }
  [data-hrrr-viewer] .ff-desk-dropdown, [data-hrrr-viewer] .ff-alert-panel { width:300px; top:62px; max-height:calc(100% - 74px); right:10px; }
  [data-hrrr-viewer].ff-desk-open .ff-alert-trigger { visibility:visible; }
  [data-hrrr-viewer] .ff-weather-tabs { display:flex; gap:4px; margin:8px 0; }
  [data-hrrr-viewer] .ff-weather-tabs button { flex:1; min-height:32px; padding:5px; background:#0b2938; color:#a6c6d6; border:1px solid #365d70; border-radius:5px; font:inherit; font-size:11px; }
  [data-hrrr-viewer] .ff-weather-tabs button[aria-pressed=true] { color:#74ddff; background:#153d4e; border-color:#64dafa; }
}

@media (min-width:900px) {
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-clear],
  [data-hrrr-viewer] .ff-desk-dropdown .ff-desk-actions { display:none; }
  [data-hrrr-viewer] .ff-desk-settings .ff-field { margin:0; gap:4px; }
  [data-hrrr-viewer] .ff-desk-summary { margin:0; }
}

/* Phone alerts use the map's visible height, with one scrollable content area. */
@media (max-width: 899px) and (orientation: portrait),
       (pointer: coarse) and (orientation: landscape) and (max-height: 620px) {
  [data-hrrr-viewer] .ff-alert-panel {
    top: 62px;
    right: 8px;
    bottom: 8px;
    width: calc(100% - 16px);
    height: auto;
    min-height: 0;
    max-height: none;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 10px;
  }
  [data-hrrr-viewer] .ff-alert-header,
  [data-hrrr-viewer] .ff-alert-quick-controls { flex: 0 0 auto; }
  [data-hrrr-viewer] #ff-alert-panel-content {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  [data-hrrr-viewer] .ff-alert-item { padding: 8px; gap: 3px; }
  [data-hrrr-viewer] .ff-alert-item span { overflow-wrap: anywhere; }
}
@media (pointer: coarse) and (orientation: landscape) and (max-height: 620px) {
  [data-hrrr-viewer] .ff-alert-panel {
    top: 6px;
    bottom: 6px;
    width: min(360px, calc(100% - 16px));
    padding: 8px;
  }
  [data-hrrr-viewer].ff-alerts-open .ff-alert-trigger { visibility: hidden; }
  [data-hrrr-viewer] .ff-alert-header { padding-bottom: 4px; }
  [data-hrrr-viewer] .ff-alert-quick-controls { margin-top: 4px; }
  [data-hrrr-viewer] .ff-alert-quick-toggle {
    min-height: 40px;
    flex-direction: row;
    gap: 5px;
    padding: 5px 4px;
  }
}

/* Readable broadcast legends; collapsed summaries remain compact. */
@media (min-width:900px) and (pointer:fine) {
  [data-hrrr-viewer] .ff-desk-badge { font-size:16px; padding:10px 14px; max-width:calc(100% - 24px); }
  [data-hrrr-viewer] .ff-desk-badge small { font-size:12px; }
  [data-hrrr-viewer] .ff-desk-badge summary { padding-right:0; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend { gap:7px 16px; margin-top:7px; max-height:120px; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend span { font-size:14px; gap:7px; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend i { width:14px; height:14px; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-off { font-size:12px; line-height:20px; }
}
@media (orientation:landscape) and (max-height:620px) and (pointer:coarse) {
  [data-hrrr-viewer] .ff-desk-badge { font-size:12px; max-height:110px; }
  [data-hrrr-viewer] .ff-desk-badge small { font-size:11px; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend span { font-size:12px; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend i { width:12px; height:12px; }
}

/* One centered summary row; the crop handles own start/end selection. */
[data-hrrr-viewer] .ff-loop-crop-actions { left:50%; right:auto; transform:translateX(-50%); width:max-content; max-width:calc(100% - 16px); box-sizing:border-box; display:flex; flex-wrap:nowrap; align-items:center; justify-content:center; }
[data-hrrr-viewer] .ff-loop-crop-actions > span { display:block !important; flex:0 1 auto; }
[data-hrrr-viewer] .ff-loop-crop-actions :is(strong,small,.ff-loop-exact) { display:none !important; }
[data-hrrr-viewer] .ff-loop-crop-actions output { white-space:nowrap; text-align:center; }
[data-hrrr-viewer] .ff-loop-crop-actions :is([data-crop-confirm],[data-crop-cancel]) { min-height:34px; padding:5px 9px; flex:none; }
@media (max-width:380px) {
  [data-hrrr-viewer] .ff-loop-crop-actions :is(output,button) { font-size:10px; }
}

@media (min-width:900px) and (pointer:fine) {
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend { flex-wrap:nowrap; overflow-x:auto; max-height:none; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend span { flex:none; white-space:nowrap; }
}

/* Routine prepared-outlook switching does not add a flashing status row. */
[data-hrrr-viewer] .ff-desk-dropdown [data-desk-status][data-state=loading] { display:none !important; }

/* The phone playback strip is 44px high at a 10px safe-area offset. Keep
   panels exactly 8px above that fixed strip instead of measuring other UI. */
@media (max-width:899px) and (orientation:portrait), (pointer:coarse) and (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-alert-panel { bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px); font-size:12px; }
  [data-hrrr-viewer] .ff-desk-dropdown { top:8px; bottom:auto; height:auto; max-height:calc(100% - max(10px,env(safe-area-inset-bottom)) - 68px); overflow-y:auto; padding:10px; }
  [data-hrrr-viewer] .ff-desk-dropdown > .ff-desk-legend,
  [data-hrrr-viewer] .ff-desk-dropdown > .ff-desk-details,
  [data-hrrr-viewer] .ff-desk-dropdown .ff-desk-actions,
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-clear],
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-refresh],
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-source],
  [data-hrrr-viewer] .ff-desk-dropdown [data-desk-status]:not([data-state=error]) { display:none !important; }
  [data-hrrr-viewer] .ff-desk-summary { margin:0; }
  [data-hrrr-viewer] .ff-desk-badge { top:auto; bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px); left:8px; right:auto; transform:none; width:max-content; min-width:0; max-width:calc(100% - 16px); box-sizing:border-box; padding:5px 8px; font-size:12px; max-height:104px; }
  [data-hrrr-viewer] .ff-desk-badge summary { white-space:nowrap; overflow:visible; padding-right:0; }
  [data-hrrr-viewer] .ff-desk-badge .ff-desk-legend { max-height:60px; overflow:auto; }
  [data-hrrr-viewer] .ff-feature-card { left:10px; bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px); transform:none; max-height:calc(100% - max(10px,env(safe-area-inset-bottom)) - 60px); padding:10px; }
  [data-hrrr-viewer] .ff-feature-card.ff-feature-inline { position:static; width:100%; max-height:none; box-shadow:none; margin:0; }
  [data-hrrr-viewer] .ff-alert-list[hidden] { display:none !important; }
}
@media (max-width:899px) and (orientation:portrait) {
  [data-hrrr-viewer] .ff-desk-badge { width:calc(100% - 16px); max-width:none; }
}
@media (max-width:899px) and (orientation:portrait), (pointer:coarse) and (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer].ff-desk-open .ff-desk-badge { visibility:visible; }
}
@media (pointer:coarse) and (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-desk-dropdown { left:auto; right:8px; width:min(360px,calc(100% - 16px)); }
  [data-hrrr-viewer] .ff-desk-settings { grid-template-columns:1fr; gap:6px; }
  [data-hrrr-viewer] .ff-desk-badge { max-width:min(390px,calc(100% - 16px)); }
}

@media (pointer:coarse) and (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-desk-badge { bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px); }
}

@media (pointer:coarse) and (orientation:landscape) and (max-height:620px) {
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-phone-draw-dock { left:10px !important; right:auto; bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px) !important; }
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-phone-draw-panel { left:10px !important; right:auto; bottom:calc(max(10px,env(safe-area-inset-bottom)) + 94px) !important; }
}

/* Open alerts own the map area down to the timeline, including the space used
   by annotation and Map/Models shortcuts. */
@media (max-width:899px) and (orientation:portrait), (pointer:coarse) and (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-alert-panel { z-index:45; }
}
@media (min-width:900px) {
  [data-hrrr-viewer] > .outlook-hrrr-controls > .ff-model-actions-row { position:relative; display:block; }
  [data-hrrr-viewer] .ff-model-actions-row > .ff-guidance-tools { position:absolute; top:0; left:0; z-index:1; }
  [data-hrrr-viewer] .ff-model-actions-row > .outlook-hrrr-appearance { display:block; width:100%; }
  [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-appearance > summary { margin-left:50px; }
  [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-display-controls { position:relative !important; inset:auto !important; width:100% !important; min-width:0 !important; max-width:100% !important; box-sizing:border-box; max-height:none !important; overflow:visible !important; box-shadow:none; }
  [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-appearance-group.is-basemap > div,
  [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-overlay-toggles { grid-template-columns:minmax(0,1fr) !important; }
  [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-display-controls label { min-width:0; max-width:100%; box-sizing:border-box; }
  [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-display-controls select { width:100%; min-width:0; }
}
@media (min-width:900px) {
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].ff-alerts-open [data-hrrr-image-wrap] { width:calc(100% - var(--ff-model-dock) - 300px) !important; margin-right:300px; }
  [data-hrrr-viewer] > .ff-alert-panel { position:relative !important; grid-area:guidance-map; justify-self:end; align-self:stretch; box-sizing:border-box; width:300px !important; max-width:300px !important; height:100%; max-height:100% !important; inset:auto !important; margin:0; border-radius:0; padding:12px; background:#071d29; font:13px system-ui,sans-serif; overflow-y:auto; }
  [data-hrrr-viewer] > .ff-alert-panel .ff-alert-heading { font-size:16px; }
  [data-hrrr-viewer] > .ff-alert-panel .ff-alert-header { gap:6px; flex-wrap:wrap; }
}
@media (min-width:900px) and (min-height:621px) {
  [data-hrrr-viewer] > .ff-desk-dropdown,
  [data-hrrr-viewer] > .ff-alert-panel { grid-row:guidance-map-start / guidance-timeline-end; }
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].ff-desk-open > .outlook-hrrr-timeline,
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].ff-alerts-open > .outlook-hrrr-timeline { width:calc(100% - 300px) !important; box-sizing:border-box; margin-right:300px; }
}
@media (min-width:900px) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].ff-settings-open [data-hrrr-image-wrap] { width:calc(100% - var(--ff-model-dock) - 300px) !important; margin-right:300px; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].ff-settings-open > .outlook-hrrr-timeline { width:calc(100% - 300px) !important; box-sizing:border-box; margin-right:300px; }
}
[data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] { display:grid; gap:14px; }
[data-hrrr-viewer] .ff-desk-settings label { display:grid; gap:6px; font:13px Arial,sans-serif; }
[data-hrrr-viewer] .ff-desk-settings input { width:100%; box-sizing:border-box; padding:10px; color:#dff7ff; background:#071923; border:1px solid #31596a; border-radius:5px; }
/* Guidance chrome uses the broadcast charcoal/gold palette; field palettes stay separate. */
[data-hrrr-viewer] { --ff-chrome:#10171d; --ff-chrome-raised:#1b2126; --ff-accent:#dbb653; }
[data-hrrr-viewer] > header,
[data-hrrr-viewer] > .outlook-hrrr-controls,
[data-hrrr-viewer] > .outlook-hrrr-timeline,
[data-hrrr-viewer] > .ff-desk-dropdown,
[data-hrrr-viewer] > .ff-alert-panel { background:var(--ff-chrome); border-color:#514831; }
[data-hrrr-viewer] .ff-parameter-rail button,
[data-hrrr-viewer] .ff-desk-product-rail button,
[data-hrrr-viewer] .ff-weather-tabs button { background:var(--ff-chrome-raised); color:#e5e7e8; border-color:#41484d; }
[data-hrrr-viewer] .ff-parameter-rail button[aria-pressed=true],
[data-hrrr-viewer] .ff-desk-product-rail button[aria-pressed=true],
[data-hrrr-viewer] .ff-weather-tabs button[aria-pressed=true] { background:#302b1d; border-color:var(--ff-accent); box-shadow:none; color:#fff2c6; }
[data-hrrr-viewer] .ff-desk-settings { display:block; }
[data-hrrr-viewer] .ff-desk-settings[hidden] { display:none; }
[data-hrrr-viewer] .ff-desk-settings > * { margin-bottom:14px; }
[data-hrrr-viewer] .ff-desk-settings > header { display:flex; justify-content:space-between; align-items:center; min-height:36px; }
[data-hrrr-viewer] .ff-desk-settings > header button { width:40px; height:40px; min-height:40px; padding:0; display:grid; place-items:center; border:0; border-radius:9px; background:#1b2126; color:#e5e7e8; }
[data-hrrr-viewer] .ff-feature-card header button { min-height:28px; padding:4px 8px; font:400 11px Arial,sans-serif; }
@media (min-width:900px) {
 [data-hrrr-viewer] .ff-back-to-models { left:58px !important; }
}

@media (min-width:900px) {
 [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-draw-tools.is-in-appearance-drawer { grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; border:0; background:none; }
 [data-hrrr-viewer] .ff-model-actions-row .outlook-hrrr-draw-tools.is-in-appearance-drawer > :is(button,label) { min-width:0; width:100%; min-height:38px; margin:0; padding:6px; box-sizing:border-box; display:flex; align-items:center; justify-content:center; gap:5px; text-align:center; font:400 11px/1.25 Arial,sans-serif; border:1px solid #41484d; border-radius:6px; white-space:normal; }
}

@media (min-width:900px) { [data-hrrr-viewer] > .ff-desk-dropdown { animation:none; } }
/* Short desktop windows retain docks; phone landscape keeps its accepted layout. */
@media (min-width:900px) and (max-height:620px) and (pointer:fine) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] { grid-template-areas:"guidance-header" "guidance-map" "guidance-timeline" !important; grid-template-columns:minmax(0,1fr) !important; grid-template-rows:46px minmax(0,1fr) 44px !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-controls { position:relative !important; inset:auto !important; height:100% !important; max-height:100% !important; transform:none !important; border-radius:0; display:flex !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].is-controls-collapsed > .outlook-hrrr-controls { display:none !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-controls > label { display:grid !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-mobile-sheet-header,
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-phone-draw-dock,
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .ff-guidance-shortcuts { display:none !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-timeline { position:relative !important; inset:auto !important; width:100%; margin:0; border-radius:0; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer]:is(.ff-desk-open,.ff-alerts-open,.ff-settings-open) > .outlook-hrrr-timeline { width:calc(100% - 300px) !important; margin-right:300px; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > :is(.ff-desk-dropdown,.ff-alert-panel) { grid-row:guidance-map-start / guidance-timeline-end; }
}
@media (min-width:900px) and (max-height:620px) and (pointer:fine) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] { height:calc(100dvh - 26px) !important; min-height:0 !important; max-height:calc(100dvh - 26px) !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-controls { width:250px !important; max-width:250px !important; min-width:0 !important; border-radius:0 !important; background:var(--ff-chrome) !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-mobile-controls-toggle { display:none !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .ff-model-actions-row > .ff-guidance-tools { display:flex !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] [data-hrrr-image-wrap] { min-height:0 !important; height:100% !important; }
}
@media (max-width:899px) {
 [data-hrrr-viewer] .ff-weather-tabs { display:flex; gap:4px; margin:8px 0; }
 [data-hrrr-viewer] .ff-weather-tabs button { flex:1; min-width:0; min-height:36px; padding:5px; border:1px solid #41484d; border-radius:5px; font:400 12px Arial,sans-serif; }
}

[data-hrrr-viewer] .ff-alert-header button[aria-label="Close active alerts"] { width:32px; height:32px; min-height:32px; padding:5px; display:grid; place-items:center; border:0; background:transparent; }
/* Complete broadcast theme: interface colors only, never meteorological palettes. */
[data-hrrr-viewer] {
 --ff-chrome:#101418; --ff-chrome-raised:#1b1e21; --ff-accent:#d7b34e;
 --ff-border:#41474b; --ff-text:#f0f0e9; --ff-muted:#bdbba9;
 border-color:var(--ff-accent) !important; background:var(--ff-chrome) !important;
 box-shadow:0 0 0 1px #d7b34e22,0 18px 48px #0007 !important;
}
.outlook-builder-dialog.is-guidance-standalone { border-color:#d7b34e !important; }
[data-hrrr-viewer] > header { background:linear-gradient(115deg,#29251a,#111519 65%) !important; border-color:var(--ff-border) !important; }
[data-hrrr-viewer] .outlook-hrrr-heading-credit { color:#e5d8ab !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-controls,.outlook-hrrr-timeline,.ff-desk-dropdown,.ff-alert-panel,.outlook-hrrr-display-controls,.outlook-hrrr-draw-settings,.ff-feature-card) { background:var(--ff-chrome) !important; border-color:var(--ff-border) !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-controls,.ff-desk-dropdown,.ff-alert-panel,.outlook-hrrr-display-controls) { scrollbar-color:#62696d #171a1c; }
[data-hrrr-viewer] :is(.outlook-hrrr-controls label > span,.outlook-hrrr-appearance-group > strong,.ff-parameter-rail > strong,.ff-desk-product-rail > strong,.ff-desk-tabs button,.ff-field > span,.outlook-hrrr-check i,.outlook-hrrr-draw-settings label,.outlook-hrrr-cache-label) { color:var(--ff-accent) !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-controls,.ff-guidance-panel) :is(select,input:not([type=range]):not([type=checkbox]):not([type=color])) { background:#161a1d !important; border-color:var(--ff-border) !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-controls,.outlook-hrrr-timeline,header,.ff-guidance-panel,.ff-guidance-shortcuts) button:not([data-hrrr-draw-color-choice]),
[data-hrrr-viewer] :is(.outlook-hrrr-appearance > summary,.ff-model-dock-toggle,.outlook-hrrr-mobile-controls-toggle,.ff-alert-trigger) { background:var(--ff-chrome-raised) !important; border-color:var(--ff-border) !important; color:var(--ff-text) !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-controls,.outlook-hrrr-timeline,.ff-guidance-panel) button[aria-pressed=true]:not([data-hrrr-draw-color-choice]),
[data-hrrr-viewer] .ff-desk-tabs button[aria-selected=true],
[data-hrrr-viewer] [data-hrrr-expand] { background:linear-gradient(#aa8834,#67501e) !important; border-color:var(--ff-accent) !important; color:#fff8e2 !important; }
[data-hrrr-viewer] .ff-desk-tabs button { background:#242219 !important; border-color:var(--ff-border) !important; box-shadow:none !important; }
[data-hrrr-viewer] :is(button,select,input,summary):focus-visible { outline-color:var(--ff-accent) !important; }
[data-hrrr-viewer] :is(.ff-desk-dropdown p,.ff-desk-dropdown small,.outlook-hrrr-check small,.ff-field small,.ff-parameter-rail strong) { color:var(--ff-muted) !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-hud,.outlook-hrrr-indicator-readout) { background:linear-gradient(120deg,#242219,#101418 70%) !important; border-color:var(--ff-border) !important; }
[data-hrrr-viewer] [data-hrrr-valid-label] { color:#68edc6 !important; }
[data-hrrr-viewer] :is([data-hrrr-cache-label],[data-hrrr-frame-label],[data-desk-strength-title],[data-desk-opacity-label]) { color:var(--ff-accent) !important; }
[data-hrrr-viewer] [data-hrrr-frame-label] { background:#29251a !important; border-color:var(--ff-border) !important; }
[data-hrrr-viewer] input:is([type=range],[type=checkbox]) { accent-color:var(--ff-accent) !important; }
[data-hrrr-viewer] input[type=range]::-webkit-slider-thumb { background:var(--ff-accent) !important; border-color:#f5dda0 !important; }
[data-hrrr-viewer] input[type=range]::-moz-range-thumb { background:var(--ff-accent) !important; border-color:#f5dda0 !important; }
[data-hrrr-viewer] .outlook-hrrr-cache-meter { background:#393326 !important; }
[data-hrrr-viewer] .outlook-hrrr-cache-meter i { background:var(--ff-accent) !important; }
[data-hrrr-viewer] .outlook-hrrr-check > b { border-color:var(--ff-border) !important; background:#24282a !important; }
[data-hrrr-viewer] .outlook-hrrr-check:has(input:checked) > b { background:#94762c !important; border-color:var(--ff-accent) !important; }
[data-hrrr-viewer] .outlook-hrrr-appearance[open] > summary { border-color:var(--ff-accent) !important; box-shadow:none !important; }
[data-hrrr-viewer] .outlook-hrrr-display-controls { border-top-color:var(--ff-accent) !important; background-image:none !important; }
[data-hrrr-viewer] .outlook-hrrr-appearance[open] .outlook-hrrr-display-controls::before { background:var(--ff-accent) !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-overlay-control,.outlook-hrrr-check,.outlook-hrrr-county-strength,.outlook-hrrr-appearance-group,.ff-desk-settings,.ff-overlay-toggle,.ff-desk-opacity,.ff-alert-card) { border-color:#41474b !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-county-strength output,.outlook-hrrr-draw-settings output,.outlook-hrrr-draw-settings label span) { color:#e2c975 !important; }
[data-hrrr-viewer] [data-hrrr-loading] { background:#55441f !important; color:#fff0be !important; }
[data-hrrr-viewer] :is(.outlook-hrrr-controls,.outlook-hrrr-timeline,.ff-guidance-panel) button[aria-pressed=true]:not([data-hrrr-draw-color-choice]),
[data-hrrr-viewer] .ff-desk-tabs button[aria-selected=true] { background:linear-gradient(#453a20,#29251b) !important; }
[data-hrrr-viewer] .outlook-hrrr-heading-credit { color:#68edc6 !important; }
[data-hrrr-viewer] .ff-alert-item { background:#1b1e21 !important; border-top-color:#41474b !important; border-right-color:#41474b !important; border-bottom-color:#41474b !important; }
[data-hrrr-viewer] .ff-alert-quick-toggle { background:var(--ff-chrome-raised) !important; border-color:var(--ff-border) !important; color:var(--ff-text) !important; }
[data-hrrr-viewer] .ff-alert-quick-toggle[aria-pressed="true"] { background:linear-gradient(#453a20,#29251b) !important; border-color:var(--ff-accent) !important; color:#fff2c6 !important; }
/* Landscape touch controls share one scroll surface, including Map & Layers. */
@media (orientation:landscape) and (pointer:coarse) and (max-height:620px) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-controls {
  top:46px !important; bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px) !important;
  left:auto !important; right:max(8px,env(safe-area-inset-right)) !important;
  width:min(430px,calc(100% - max(8px,env(safe-area-inset-left)) - max(8px,env(safe-area-inset-right)))) !important;
  max-width:100% !important; min-width:0 !important; height:auto !important; max-height:none !important;
  grid-template-columns:minmax(0,1fr) !important; grid-auto-rows:max-content !important;
  align-content:start !important; overflow-y:auto !important; overflow-x:hidden !important;
  touch-action:pan-y; overscroll-behavior-y:contain; transform:none !important;
  background:var(--ff-chrome) !important; border-color:var(--ff-border) !important;
 }
 [data-hrrr-viewer] .outlook-hrrr-controls > * { min-width:0 !important; max-width:100% !important; flex-shrink:0; }
 [data-hrrr-viewer] .outlook-hrrr-mobile-sheet-header { background:var(--ff-chrome) !important; }
 [data-hrrr-viewer] .outlook-hrrr-appearance,
 [data-hrrr-viewer] .ff-model-actions-row { position:static !important; width:100% !important; }
 [data-hrrr-viewer] .outlook-hrrr-appearance[open] > .outlook-hrrr-display-controls {
  position:static !important; inset:auto !important; width:100% !important; min-width:0 !important;
  max-width:100% !important; height:auto !important; max-height:none !important; overflow:visible !important;
  transform:none !important; box-shadow:none !important; grid-template-columns:minmax(0,1fr) !important;
 }
}
@media (orientation:landscape) and (pointer:coarse) and (max-height:620px) {
 [data-hrrr-viewer] .outlook-hrrr-controls :is(.outlook-hrrr-overlay-toggles,.outlook-hrrr-appearance-group.is-basemap > div) { grid-template-columns:minmax(0,1fr) !important; }
 [data-hrrr-viewer] .outlook-hrrr-controls .outlook-hrrr-check { display:grid !important; grid-template-columns:minmax(0,1fr) 44px; align-items:center; }
 [data-hrrr-viewer] .outlook-hrrr-controls .outlook-hrrr-check > span { display:grid !important; gap:3px; }
}
/* Gold indicates selection; idle controls and supporting text stay neutral. */
[data-hrrr-viewer] :is(.outlook-hrrr-controls label > span,.ff-parameter-rail > strong,.ff-desk-product-rail > strong,.outlook-hrrr-appearance-group > strong,.ff-field > span,.outlook-hrrr-check i,.outlook-hrrr-cache-label) { color:#bfc5c7 !important; }
[data-hrrr-viewer] .ff-desk-tabs button { background:#1b1e21 !important; border-color:#41474b !important; color:#e7e9e9 !important; }
[data-hrrr-viewer] .ff-desk-tabs button[aria-selected=true] { border-bottom-color:var(--ff-accent) !important; }
[data-hrrr-viewer] .ff-desk-overlay-row { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); align-items:center; gap:10px; border-top:1px solid #41474b; padding-top:10px; margin-top:10px; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-overlay-toggle { display:flex !important; flex-direction:row; align-items:center; gap:6px; margin:0; min-width:0; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-overlay-toggle small { display:none; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-desk-opacity { min-width:0; margin:0; gap:4px; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-desk-opacity > span { font:400 11px Arial,sans-serif; }
[data-hrrr-viewer] .ff-desk-overlay-row [data-desk-strength-title],
[data-hrrr-viewer] .ff-desk-overlay-row [data-desk-opacity-label] { color:#bfc5c7 !important; font-weight:400; }
[data-hrrr-viewer] .ff-desk-overlay-row input[type=range] { width:100%; min-width:0; margin:0; }
[data-hrrr-viewer] .ff-desk-overlay-row { align-items:center !important; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-desk-opacity { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:6px; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-desk-opacity > span { white-space:nowrap; font-size:10px; letter-spacing:0; }
[data-hrrr-viewer] .ff-desk-overlay-row input[type=range] { min-height:24px; }
@media (orientation:landscape) and (pointer:coarse) and (max-height:620px) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer]:not(.is-mobile-controls-open) > .outlook-hrrr-controls { display:none !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].is-mobile-controls-open > .outlook-hrrr-controls { display:grid !important; }
}
@media (orientation:landscape) and (pointer:coarse) and (max-height:620px) {
 .outlook-builder-dialog.is-guidance-standalone { width:100vw !important; height:100dvh !important; max-width:100vw !important; max-height:100dvh !important; margin:0 !important; inset:0 !important; padding:0 !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] { width:100% !important; height:100dvh !important; max-height:100dvh !important; min-height:0 !important; --ff-model-dock:0px !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] [data-hrrr-image-wrap] { width:100% !important; margin:0 !important; min-width:0 !important; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-controls { top:0 !important; background:#101418 !important; }
}
[data-hrrr-viewer] .ff-desk-overlay-row .ff-desk-opacity { grid-template-columns:minmax(0,1fr); gap:2px; }
@media (orientation:landscape) and (pointer:coarse) and (max-height:620px) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-controls { grid-area:auto !important; top:46px !important; }
}
[data-hrrr-viewer] select[data-hrrr-model],
[data-hrrr-viewer] select[data-hrrr-model] option { color:#edf0f1 !important; }
[data-hrrr-viewer] select[data-hrrr-model] optgroup { color:#ffd166 !important; }
/* Compact opacity control: no heading or clipped percentage competes with the map. */
[data-hrrr-viewer] .ff-desk-overlay-row { grid-template-columns:minmax(0,1.4fr) minmax(70px,1fr); gap:8px; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-desk-opacity > span { display:none; }
[data-hrrr-viewer] .ff-desk-overlay-row .ff-desk-opacity { align-self:center; padding:0; }
[data-hrrr-viewer] .ff-desk-overlay-row input[type=range] { display:block; padding:0; height:24px; border:0; box-shadow:none; }
[data-hrrr-viewer] .ff-desk-overlay-row input[type=range]:focus-visible { outline:0; }
[data-hrrr-viewer] .ff-desk-overlay-row input[type=range]:focus-visible::-webkit-slider-thumb { outline:1px solid #edf0f1; outline-offset:2px; }
[data-hrrr-viewer] .ff-desk-overlay-row input[type=range]:focus-visible::-moz-range-thumb { outline:1px solid #edf0f1; outline-offset:2px; }

[data-hrrr-viewer] .ff-parameter-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%; }
[data-hrrr-viewer] .ff-parameter-heading > span { font-size:11px; font-weight:800; letter-spacing:1px; color:#bfc5c7; }
[data-hrrr-viewer] .ff-parameter-heading .ff-guidance-tools { display:flex!important; margin:0; width:auto; }
[data-hrrr-viewer] .ff-parameter-heading .ff-share-button { width:34px; height:34px; min-height:34px; padding:6px; }
[data-hrrr-viewer] .ff-settings-map-controls { display:block!important; width:100%; margin:10px 0; }
[data-hrrr-viewer] .ff-settings-map-controls .outlook-hrrr-appearance { width:100%; position:static!important; }
[data-hrrr-viewer] .ff-settings-map-controls .outlook-hrrr-display-controls { position:static!important; width:100%!important; max-width:none!important; max-height:none!important; margin:0!important; transform:none!important; box-sizing:border-box; }
[data-hrrr-viewer] > .outlook-hrrr-controls > .ff-parameter-heading { order:2; }
[data-hrrr-viewer] .ff-settings-map-controls .outlook-hrrr-appearance > summary { width:100%!important; margin:0!important; padding:12px!important; box-sizing:border-box; }

[data-hrrr-viewer] .ff-surface-share-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0; min-height:32px; }
[data-hrrr-viewer] .ff-surface-share-heading .ff-guidance-tools { display:flex!important; width:auto; height:32px; margin:0; }
[data-hrrr-viewer] .ff-surface-share-heading .ff-share-button { width:30px; height:30px; min-height:30px; padding:5px; }

/* Share sits right of the two-line parameter heading, centered vertically. */
[data-hrrr-viewer] .ff-parameter-heading { padding-right:42px; box-sizing:border-box; }
[data-hrrr-viewer] .ff-surface-share-heading { position:relative; padding-right:42px; display:block; min-height:16px; box-sizing:border-box; }
[data-hrrr-viewer] .ff-surface-share-heading .ff-guidance-tools { position:absolute; right:0; left:auto; top:-24px; height:30px; }


[data-hrrr-viewer] .ff-settings-map-controls :is(.outlook-hrrr-appearance-group > strong, label > span, .outlook-hrrr-check i, .outlook-hrrr-appearance-actions button, .outlook-hrrr-draw-tools > button, .outlook-hrrr-draw-tools > label) { font-family:inherit!important; font-size:10px!important; font-weight:800!important; line-height:1.35!important; letter-spacing:.65px!important; }
[data-hrrr-viewer] .ff-settings-map-controls select { font-family:inherit!important; font-size:12px!important; font-weight:700!important; }
[data-hrrr-viewer] .ff-settings-map-controls output { font:inherit!important; }
[data-hrrr-viewer] .ff-desk-settings > p { font:800 10px/1.35 Arial,sans-serif; letter-spacing:.65px; color:#bfc5c7; }
[data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] label { display:grid; gap:5px; margin:10px 0; font:700 11px/1.35 Arial,sans-serif; }
[data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] input { font:400 12px/1.35 Arial,sans-serif; padding:8px; }
[data-hrrr-viewer] .ff-desk-settings > button { font:700 11px/1.35 Arial,sans-serif; }
/* Guidance controls share one actionable cursor, including the Models dock. */
[data-hrrr-viewer] :is(button:not(:disabled), select:not(:disabled), summary, input[type="checkbox"]:not(:disabled), input[type="radio"]:not(:disabled), .ff-overlay-toggle) { cursor: pointer; }
@media (max-width: 899px) {
  [data-hrrr-viewer] .ff-parameter-heading { display:none!important; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > label:has([data-hrrr-model]) { order:0!important; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > label:has([data-hrrr-run]) { order:2!important; }
  [data-hrrr-viewer] > .outlook-hrrr-controls > label:has([data-hrrr-parameter]) { order:1!important; }
}


/* Match the compact map-detail cards in every Guidance orientation. */
[data-hrrr-viewer] .outlook-hrrr-display-controls .is-basemap label > span,
[data-hrrr-viewer] .outlook-hrrr-display-controls .is-weather label > span {font:800 10px/1.35 Arial,sans-serif!important;letter-spacing:.65px!important;}
[data-hrrr-viewer] .outlook-hrrr-display-controls .is-basemap select {font:700 12px/1.35 Arial,sans-serif!important;min-height:38px!important;padding:8px 10px!important;}
[data-hrrr-viewer] .outlook-hrrr-display-controls .is-weather {gap:8px!important;padding:12px!important;}
[data-hrrr-viewer] .outlook-hrrr-display-controls .is-weather > label {display:grid!important;gap:6px!important;padding:0!important;margin:0!important;border:0;border-radius:0;background:transparent;}
[data-hrrr-viewer] .outlook-hrrr-display-controls .is-weather input[type="range"] {width:100%!important;min-height:20px!important;height:20px!important;margin:0!important;padding:0!important;}
[data-hrrr-viewer] .outlook-hrrr-display-controls .is-weather output {font:inherit!important;color:#f1c94e!important;}

[data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] { gap:0; border:1px solid #3b4548; border-radius:10px; overflow:hidden; background:#171e21; }
[data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] label { display:grid; grid-template-columns:minmax(0,1fr) 86px; align-items:center; gap:12px; margin:0; padding:9px 12px; border-bottom:1px solid #3b4548; font:700 11px/1.35 Arial,sans-serif; }
[data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] label:last-child {border-bottom:0;}
[data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] input { width:86px; min-width:0; min-height:34px; height:34px; padding:6px; text-align:center; box-sizing:border-box; font:700 12px/1.35 Arial,sans-serif; }

[data-hrrr-center-reticle]:not([hidden]) { position:absolute; left:50%; top:50%; width:20px; height:20px; transform:translate(-50%,-50%); border:2px solid white; border-radius:50%; box-shadow:0 0 0 1px #111; z-index:38; pointer-events:none; }
[data-hrrr-center-reticle]::before, [data-hrrr-center-reticle]::after { content:""; position:absolute; background:white; box-shadow:0 0 1px #111; }
[data-hrrr-center-reticle]::before { width:28px; height:2px; left:-6px; top:7px; }
[data-hrrr-center-reticle]::after { width:2px; height:28px; left:7px; top:-6px; }

@media (max-width:600px) and (orientation:portrait) {
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-phone-draw-dock { gap:4px; }
  .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-phone-draw-dock button,
  [data-hrrr-viewer] .ff-guidance-shortcuts button { width:32px; height:34px; min-width:32px; flex-basis:32px; }
  [data-hrrr-viewer] .ff-guidance-shortcuts { left:118px; transform:none; gap:4px; }
}
@media (max-width:350px) and (orientation:portrait) {
  [data-hrrr-viewer] .ff-guidance-shortcuts { left:10px; bottom:52px; }
}

/* Forecast Desk follows the Models typography and neutral/gold controls. */
[data-hrrr-viewer] .ff-desk-dropdown,
[data-hrrr-viewer] .ff-desk-dropdown :is(button,select,input,label,summary) { font-family:Inter,"Segoe UI",system-ui,sans-serif !important; }
[data-hrrr-viewer] .ff-desk-product-rail button { font-size:12px; font-weight:400; line-height:1.35; text-align:left; justify-content:flex-start; padding:8px 10px; background:#1b1e21 !important; border:1px solid #41474b; border-radius:6px; color:#e7f5fb !important; }
[data-hrrr-viewer] .ff-desk-product-rail button[aria-pressed=true],
[data-hrrr-viewer] .ff-desk-tabs button[aria-selected=true] { background:linear-gradient(#393321,#29261c) !important; border:1px solid #d5b345 !important; box-shadow:none !important; color:#fff3ce !important; }
[data-hrrr-viewer] .ff-desk-product-rail > strong { font-size:11px; font-weight:800; letter-spacing:.06em; }
[data-hrrr-viewer] .ff-desk-dropdown summary { font-size:12px; letter-spacing:.06em; border:1px solid #41474b; border-radius:6px; background:#1b1e21; }

[data-hrrr-viewer] .outlook-hrrr-draw-tools > button { height:40px !important; min-height:40px !important; box-sizing:border-box; display:flex !important; flex-direction:row !important; align-items:center !important; justify-content:center !important; gap:7px; padding:6px 8px !important; }
[data-hrrr-viewer] .outlook-hrrr-draw-tools .outlook-hrrr-draw-color i { flex:0 0 16px; width:16px; height:16px; margin:0 !important; }

@media (min-width:900px) and (pointer:fine) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] > .outlook-hrrr-timeline { margin-left:var(--ff-model-dock,250px); width:calc(100% - var(--ff-model-dock,250px)) !important; box-sizing:border-box; }
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer]:is(.ff-desk-open,.ff-alerts-open,.ff-settings-open) > .outlook-hrrr-timeline { width:calc(100% - var(--ff-model-dock,250px) - 300px) !important; }
}

@media (min-width:900px) and (pointer:fine) { [data-hrrr-viewer] > .outlook-hrrr-controls { grid-row:guidance-map-start / guidance-timeline-end !important; height:100%; max-height:100%; border-right:1px solid var(--ff-border); } }




/* Compact desktop settings; keep the accepted phone touch targets. */
@media (min-width:900px) {
 [data-hrrr-viewer] .outlook-hrrr-display-controls .outlook-hrrr-appearance-group,
 [data-hrrr-viewer] .outlook-hrrr-display-controls > .ff-city-settings {padding:9px 12px!important;gap:6px;}
 [data-hrrr-viewer] .outlook-hrrr-display-controls .outlook-hrrr-appearance-group > strong {font-size:10px!important;font-weight:600!important;letter-spacing:.06em!important;margin-bottom:5px;}
 [data-hrrr-viewer] :is(.outlook-hrrr-display-controls,.ff-radar-settings) .outlook-hrrr-check {min-height:34px!important;padding:5px 2px!important;border:0!important;border-bottom:1px solid #343c40!important;border-radius:0!important;background:transparent!important;grid-template-columns:minmax(0,1fr) 39px!important;}
 [data-hrrr-viewer] :is(.outlook-hrrr-display-controls,.ff-radar-settings) .outlook-hrrr-check i {font-size:11px!important;font-weight:500!important;font-style:normal!important;letter-spacing:0!important;line-height:1.25!important;}
 [data-hrrr-viewer] :is(.outlook-hrrr-display-controls,.ff-radar-settings) .outlook-hrrr-check small {display:none!important;}
 [data-hrrr-viewer] :is(.outlook-hrrr-display-controls,.ff-radar-settings) .outlook-hrrr-check br {display:none;}
 [data-hrrr-viewer] .outlook-hrrr-overlay-control {border:0!important;border-radius:0!important;background:transparent!important;}
 [data-hrrr-viewer] .outlook-hrrr-overlay-stack,
 [data-hrrr-viewer] .outlook-hrrr-overlay-toggles {gap:2px!important;}
 [data-hrrr-viewer] .outlook-hrrr-display-controls .outlook-hrrr-county-strength {padding:6px 2px!important;gap:5px!important;border:0!important;}
 [data-hrrr-viewer] .outlook-hrrr-display-controls label > span {font-size:11px!important;font-weight:500!important;letter-spacing:0!important;}
 [data-hrrr-viewer] .ff-city-settings .outlook-detail-toggle {min-height:30px!important;padding:5px 7px!important;font-size:11px!important;border-radius:5px;}
 [data-hrrr-viewer] .ff-city-settings .outlook-detail-toggle b {padding:2px 6px;}
 [data-hrrr-viewer] .ff-city-settings .outlook-detail-options {padding:4px 0!important;gap:8px!important;border:0!important;margin-top:4px!important;}
 [data-hrrr-viewer] .ff-city-settings .outlook-detail-options > label:not(.outlook-hrrr-check) {gap:5px;}
 [data-hrrr-viewer] .outlook-hrrr-display-controls select {height:30px!important;min-height:30px!important;padding:4px 7px!important;font-size:11px!important;font-weight:500!important;}
 [data-hrrr-viewer] .ff-city-settings [data-guidance-city-default] {height:28px!important;min-height:28px!important;padding:4px 7px!important;font-size:10px!important;}
 [data-hrrr-viewer] .outlook-hrrr-display-controls input[type=range] {margin:5px 0!important;}
}

@media (min-width:900px) {
 [data-hrrr-viewer] .outlook-hrrr-controls > label {gap:4px!important;margin:7px 0!important;}
 [data-hrrr-viewer] .outlook-hrrr-controls > label > span {font-size:9px!important;}
 [data-hrrr-viewer] .outlook-hrrr-controls > label > select {height:34px!important;min-height:34px!important;padding:5px 9px!important;font-size:11px!important;}
 [data-hrrr-viewer] .ff-parameter-rail {gap:3px!important;}
 [data-hrrr-viewer] .ff-parameter-rail strong {margin-top:7px!important;font-size:10px!important;font-weight:600!important;}
 [data-hrrr-viewer] .ff-parameter-rail button {min-height:29px!important;padding:5px 8px!important;font-size:11px!important;line-height:1.25!important;}
 [data-hrrr-viewer] .ff-desk-dropdown {padding:9px 10px!important;}
 [data-hrrr-viewer] .ff-desk-dropdown h2 {font-size:14px!important;margin:0!important;}
 [data-hrrr-viewer] .ff-desk-dropdown header small {font-size:10px!important;}
 [data-hrrr-viewer] .ff-desk-dropdown :is(.ff-desk-tabs button,summary) {min-height:30px!important;padding:5px 8px!important;font-size:11px!important;line-height:1.2!important;}
 [data-hrrr-viewer] .ff-desk-product-rail {gap:3px!important;}
 [data-hrrr-viewer] .ff-desk-product-rail strong {font-size:9px!important;font-weight:600!important;margin:5px 1px 1px!important;}
 [data-hrrr-viewer] .ff-desk-product-rail button {min-height:30px!important;padding:5px 7px!important;font-size:11px!important;line-height:1.2!important;letter-spacing:0!important;}
}


@media (min-width:900px) {
 [data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] label {min-height:32px!important;margin:0!important;padding:4px 6px!important;font-size:11px!important;font-weight:500!important;}
 [data-hrrr-viewer] .ff-desk-settings [data-keybinding-fields] input {height:26px!important;min-height:26px!important;width:76px!important;padding:3px 6px!important;font-size:11px!important;}
 [data-hrrr-viewer] .ff-desk-settings > button {height:30px!important;min-height:30px!important;padding:4px 8px!important;font-size:11px!important;}
 [data-hrrr-viewer] .outlook-hrrr-controls :is([data-hrrr-model],[data-hrrr-run]) {height:34px!important;min-height:34px!important;padding:5px 8px!important;font-size:11px!important;}
 [data-hrrr-viewer] .ff-desk-dropdown .ff-overlay-toggle {min-height:30px!important;padding:4px 6px!important;font-size:11px!important;}
 [data-hrrr-viewer] .ff-desk-dropdown header button {width:28px!important;height:28px!important;min-height:28px!important;padding:4px!important;}
}

/* Compact navigation lists: only the current product receives a highlight. */
[data-hrrr-viewer] .ff-parameter-group {border:0;border-bottom:1px solid #ffffff14;border-radius:0;background:transparent;margin:0;padding:0;}
[data-hrrr-viewer] .ff-parameter-group > summary {display:flex;align-items:center;gap:8px;cursor:pointer;padding:9px 3px;list-style:none;}
[data-hrrr-viewer] .ff-parameter-group > summary::before {content:'›';font:16px Arial;transition:transform .1s;}
[data-hrrr-viewer] .ff-parameter-group[open] > summary::before {transform:rotate(90deg);}
[data-hrrr-viewer] .ff-parameter-group > summary::-webkit-details-marker {display:none;}
[data-hrrr-viewer] .ff-parameter-group > summary strong {margin:0!important;font-size:11px!important;letter-spacing:0!important;font-weight:600!important;}
[data-hrrr-viewer] .ff-parameter-items {display:grid;gap:1px;padding:0 0 8px 12px;}
[data-hrrr-viewer] :is(.ff-parameter-rail,.ff-desk-product-rail) button {border:0!important;box-shadow:none!important;background:transparent!important;border-radius:4px!important;text-align:left!important;justify-content:flex-start!important;font-weight:400!important;}
[data-hrrr-viewer] :is(.ff-parameter-rail,.ff-desk-product-rail) button:hover {background:#ffffff09!important;}
[data-hrrr-viewer] :is(.ff-parameter-rail,.ff-desk-product-rail) button[aria-pressed=true] {background:#d3af3918!important;box-shadow:inset 2px 0 #d3af39!important;color:#fff!important;}
[data-hrrr-viewer] .ff-desk-tabs .ff-desk-product-rail {grid-template-columns:1fr!important;gap:1px!important;padding-left:8px;}
@media(min-width:900px) {
 [data-hrrr-viewer] :is(.ff-parameter-rail,.ff-desk-product-rail) button {min-height:26px!important;padding:4px 9px!important;font-size:12px!important;line-height:1.35!important;}
 [data-hrrr-viewer] .ff-desk-product-rail strong {margin:9px 3px 3px!important;}
}

@media(min-width:900px) {
 [data-hrrr-viewer] .ff-desk-tabs > button {position:relative;display:flex!important;align-items:center!important;padding-right:26px!important;font-size:11px!important;line-height:1.3!important;letter-spacing:0!important;text-align:left!important;min-height:34px!important;}
 [data-hrrr-viewer] .ff-desk-tabs > button::after {content:''!important;position:absolute;right:12px;top:50%;width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-50%) rotate(-45deg);float:none;}
 [data-hrrr-viewer] .ff-desk-tabs > button[aria-selected=true]::after {transform:translateY(-70%) rotate(45deg);}
}

[data-hrrr-viewer] .ff-parameter-heading {display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px;min-height:24px!important;margin:4px 0!important;padding:0!important;}
[data-hrrr-viewer] .ff-parameter-heading > span {font-size:9px!important;font-weight:700!important;line-height:1.2!important;letter-spacing:.08em!important;}
[data-hrrr-viewer] .ff-parameter-heading .ff-guidance-tools {position:static!important;display:flex!important;width:auto!important;height:24px!important;margin:0 0 0 auto!important;padding:0!important;}
[data-hrrr-viewer] .ff-parameter-heading .ff-share-button {width:24px!important;height:24px!important;min-width:24px!important;min-height:24px!important;padding:4px!important;border-radius:4px!important;}
[data-hrrr-viewer] .ff-parameter-heading .ff-share-button svg {width:15px!important;height:15px!important;}

[data-hrrr-viewer] .ff-desk-tabs > button {outline:none!important;box-shadow:none!important;}
[data-hrrr-viewer] .ff-desk-tabs > button:focus-visible {outline:1px solid #d3af39!important;outline-offset:1px!important;}
[data-hrrr-viewer] .outlook-hrrr-draw-settings {padding:8px!important;gap:8px!important;border-radius:5px!important;}
[data-hrrr-viewer] .outlook-hrrr-draw-palette {display:flex;align-items:center;justify-content:space-between;gap:6px!important;padding:0!important;}
[data-hrrr-viewer] .outlook-hrrr-draw-palette[hidden] {display:none!important;}
[data-hrrr-viewer] [data-hrrr-draw-color-choice] {background:var(--brush-color)!important;background-image:none!important;width:23px!important;height:23px!important;min-width:23px!important;min-height:23px!important;padding:0!important;border:1px solid #ffffff50!important;border-radius:50%!important;box-shadow:none!important;}
[data-hrrr-viewer] [data-hrrr-draw-color-choice][aria-pressed=true] {outline:1px solid white!important;outline-offset:2px!important;}
[data-hrrr-viewer] .outlook-hrrr-draw-settings > label {display:flex!important;align-items:center!important;gap:10px!important;min-height:28px!important;padding:2px 0!important;margin:0!important;border:0!important;background:transparent!important;}
[data-hrrr-viewer] .outlook-hrrr-draw-settings > label > span {display:flex!important;align-items:center!important;gap:5px!important;white-space:nowrap!important;font-size:10px!important;font-weight:500!important;letter-spacing:0!important;}
[data-hrrr-viewer] .outlook-hrrr-draw-settings output {display:inline!important;font-size:10px!important;}
[data-hrrr-viewer] .outlook-hrrr-draw-settings input[type=range] {width:0!important;min-width:60px!important;flex:1!important;height:18px!important;margin:0!important;}
[data-hrrr-viewer] :is(button,select,input,summary):focus {outline:1px solid #b69b51!important;outline-offset:1px!important;}
[data-hrrr-viewer] :is(button,select,input,summary):focus:not(:focus-visible) {outline:none!important;}

[data-hrrr-viewer] .ff-parameter-heading .ff-guidance-tools {gap:5px!important;}
[data-hrrr-viewer] .ff-parameter-heading .ff-compact-indicator {width:24px!important;height:24px!important;min-width:24px!important;min-height:24px!important;padding:4px!important;border-radius:4px!important;}
[data-hrrr-viewer] .ff-parameter-heading .ff-compact-indicator svg {width:15px!important;height:15px!important;}
.ff-guidance-panel :is(button,select,input,summary):focus {outline:1px solid #b69b51!important;outline-offset:1px!important;}
.ff-guidance-panel :is(button,select,input,summary):focus:not(:focus-visible) {outline:none!important;}

/* The native mobile selector owns its label; the compact rail is desktop only. */
@media (max-width:899px), (pointer:coarse) and (orientation:landscape) and (max-height:620px) {
  [data-hrrr-viewer] .ff-parameter-heading {display:none!important;}
  [data-hrrr-viewer] .ff-guidance-shortcuts .ff-desk-button {display:none!important;}
  [data-hrrr-viewer] .ff-desk-tabs {display:grid!important;grid-template-columns:1fr!important;min-width:0;}
  [data-hrrr-viewer] .ff-desk-tabs > button {width:100%;min-width:0;min-height:36px;padding:8px!important;letter-spacing:0!important;line-height:1.3!important;text-align:left;}
  [data-hrrr-viewer] > .outlook-hrrr-controls > label {min-width:0;gap:6px;}
  [data-hrrr-viewer] > .outlook-hrrr-controls > label > span {display:block!important;}
  [data-hrrr-viewer] .outlook-hrrr-frame-status small {position:static!important;max-width:none!important;display:none!important;}
  [data-hrrr-viewer] .ff-guidance-shortcuts {left:50%;}
  [data-hrrr-viewer].is-mobile-controls-open :is(.outlook-hrrr-phone-draw-dock,.outlook-hrrr-phone-draw-panel,.ff-guidance-shortcuts,.outlook-hrrr-image-wrap > .outlook-hrrr-mobile-controls-toggle) {visibility:hidden!important;pointer-events:none!important;}
}

/* Selected official products use the same top-left hierarchy as model products. */
[data-hrrr-viewer] .ff-official-product-card { position:absolute; top:10px; left:10px; z-index:34; box-sizing:border-box; width:min(430px,calc(100% - 130px)); padding:14px 12px; color:#edf7fa; background:rgba(14,19,23,.95); border:1px solid #56606a; border-radius:12px; box-shadow:0 4px 15px #0004; line-height:1.3; }
[data-hrrr-viewer] .ff-official-product-card[hidden] { display:none!important; }
[data-hrrr-viewer] .ff-official-product-card strong { display:block; font-size:22px; }
[data-hrrr-viewer] .ff-official-subtitle { color:#80e7ca; font-size:17px; font-weight:750; margin-top:4px; }
[data-hrrr-viewer] .ff-official-product-card .ff-desk-legend { margin-top:7px; padding-top:6px; border-top:1px solid #40515a; display:flex; flex-wrap:wrap; gap:4px 10px; }
[data-hrrr-viewer].ff-official-card-active [data-hrrr-hud] { visibility:hidden; }
@media(max-width:600px) { [data-hrrr-viewer] .ff-official-product-card { width:calc(100% - 88px); padding:11px 8px; } [data-hrrr-viewer] .ff-official-product-card strong { font-size:19px; } [data-hrrr-viewer] .ff-official-subtitle { font-size:14px; } }


/* Reading size changes only information cards, never map coordinates or drawings. */
:root[data-product-card-size="large"] { --ff-card-heading:32px; --ff-card-time:23px; --ff-card-width:650px; }
:root[data-product-card-size="extra-large"] { --ff-card-heading:40px; --ff-card-time:28px; --ff-card-width:780px; }
:root:is([data-product-card-size="large"],[data-product-card-size="extra-large"]) :is(.outlook-hrrr-hud:not(.is-collapsed),.ff-official-product-card) {
  box-sizing:border-box; width:min(var(--ff-card-width),calc(100% - 130px)) !important;
  min-width:0 !important; max-width:calc(100% - 130px) !important; padding:14px !important;
}
:root:is([data-product-card-size="large"],[data-product-card-size="extra-large"]) :is(.outlook-hrrr-hud:not(.is-collapsed),.ff-official-product-card) > strong {
  font-size:var(--ff-card-heading) !important; white-space:normal; overflow-wrap:anywhere; line-height:1.2;
}
:root:is([data-product-card-size="large"],[data-product-card-size="extra-large"]) :is(.outlook-hrrr-hud:not(.is-collapsed) > span,.ff-official-subtitle) {
  font-size:var(--ff-card-time) !important; white-space:normal; line-height:1.3; letter-spacing:0;
}
@media(max-width:600px) {
  :root[data-product-card-size="large"] { --ff-card-heading:24px; --ff-card-time:16px; }
  :root[data-product-card-size="extra-large"] { --ff-card-heading:29px; --ff-card-time:20px; }
  :root:is([data-product-card-size="large"],[data-product-card-size="extra-large"]) :is(.outlook-hrrr-hud:not(.is-collapsed),.ff-official-product-card) {
    width:calc(100% - 96px) !important; max-width:calc(100% - 96px) !important; padding:10px !important;
  }
}
.ff-product-card-size { margin:12px 0; }
.ff-product-card-size select { width:100%; min-height:40px; }

/* Settings is the complete map panel, with one scroll surface on every device. */
[data-hrrr-viewer] .ff-settings-map-controls .outlook-hrrr-appearance > summary { display:none !important; }
[data-hrrr-viewer] .ff-settings-map-controls .outlook-hrrr-display-controls { display:block !important; overflow:visible !important; }
[data-hrrr-viewer] .ff-settings-map-controls { min-width:0; }
[data-hrrr-viewer] .ff-settings-map-controls :is(select,input) { max-width:100%; box-sizing:border-box; }
@media(max-width:899px) {
 [data-hrrr-viewer].ff-settings-open .ff-desk-settings.ff-desk-dropdown {
  position:absolute !important; top:8px !important; bottom:8px !important; left:8px !important; right:8px !important;
  width:auto !important; max-width:none !important; max-height:calc(100% - 16px) !important; overflow:auto !important;
  margin:0 !important; transform:none !important; z-index:70;
 }
}

[data-hrrr-viewer].ff-map-controls-in-settings [data-hrrr-mobile-map-controls] { display:none !important; }
[data-hrrr-viewer] #ff-alert-settings > summary { cursor:pointer; padding:12px; margin:10px 0; border:1px solid #41474b; border-radius:7px; color:#edf7fa; background:#1b1e21; }

[data-hrrr-viewer] .ff-alert-quick-toggle {
 position:relative; display:flex; flex-direction:row; align-items:center; justify-content:space-between;
 min-height:38px !important; height:38px; padding:6px 8px !important; gap:6px; text-align:left; font-size:11px;
 background:#171e21 !important; border-color:#41474b !important; color:#edf7fa !important;
}
[data-hrrr-viewer] .ff-alert-quick-toggle[aria-pressed="true"] { background:#171e21 !important; border-color:#41474b !important; color:#edf7fa !important; }
[data-hrrr-viewer] .ff-alert-quick-toggle > strong { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
[data-hrrr-viewer] .ff-alert-quick-toggle::after { content:""; flex:0 0 30px; width:30px; height:18px; border-radius:20px; background:radial-gradient(circle at 8px 9px,#b9c4ca 0 6px,transparent 6.5px),#34434a; border:1px solid #58656c; }
[data-hrrr-viewer] .ff-alert-quick-toggle[aria-pressed="true"]::after { background:radial-gradient(circle at 22px 9px,#fff 0 6px,transparent 6.5px),#987c26; border-color:#dfbc53; }

/* Panel headings and navigation stay visible; only panel content scrolls. */
[data-hrrr-viewer] .ff-fixed-panel-navigation:not([hidden]),
[data-hrrr-viewer] .ff-alert-panel:not([hidden]) {
 display:flex !important; flex-direction:column; overflow:hidden !important; min-height:0;
}
[data-hrrr-viewer] .ff-fixed-panel-navigation > :is(header,.ff-weather-tabs),
[data-hrrr-viewer] .ff-alert-panel > :is(.ff-alert-header,.ff-weather-tabs,.ff-alert-quick-controls) { flex:0 0 auto; }
[data-hrrr-viewer] .ff-panel-scroll-body,
[data-hrrr-viewer] .ff-alert-panel > #ff-alert-panel-content {
 flex:1 1 auto; min-height:0; overflow-y:auto; overflow-x:hidden;
 overscroll-behavior:contain; -webkit-overflow-scrolling:touch; touch-action:pan-y;
}
[data-hrrr-viewer] .ff-desk-settings > .ff-panel-scroll-body { margin-bottom:0; }
[data-hrrr-viewer] .ff-desk-settings > .ff-panel-scroll-body > * { margin-bottom:14px; }
[data-hrrr-viewer] #ff-alert-settings > summary { position:sticky; top:0; z-index:1; }

/* Reset the former grid alignment when Settings becomes a flex column. */
[data-hrrr-viewer] .ff-fixed-panel-navigation.ff-desk-settings {
 align-items:stretch !important; justify-content:flex-start !important; gap:0 !important;
}
[data-hrrr-viewer] .ff-fixed-panel-navigation.ff-desk-settings > :is(header,.ff-weather-tabs,.ff-panel-scroll-body) {
 width:100%; min-width:0; box-sizing:border-box; align-self:stretch; margin-left:0; margin-right:0;
}
[data-hrrr-viewer] .ff-fixed-panel-navigation.ff-desk-settings > header { margin-bottom:0; }
[data-hrrr-viewer] .ff-fixed-panel-navigation.ff-desk-settings > .ff-weather-tabs { margin:8px 0 12px; }

.outlook-builder-dialog:not(.is-guidance-standalone) .ff-parameter-globe { display:none; }

/* Projection sits beside Models, clear of the upper-right Weather Desk. */
[data-hrrr-viewer] .ff-guidance-projection {
 position:absolute;left:60px;bottom:12px;z-index:40;min-width:82px;height:36px;
 align-items:center;justify-content:center;gap:6px;padding:7px 12px;
 border:1px solid #55df88 !important;border-radius:6px;
 background:var(--ff-chrome-raised,#111b20) !important;color:#70eba0 !important;
 font-size:11px;font-weight:800;letter-spacing:.5px;
 box-shadow:0 2px 8px #0006;
}
[data-hrrr-viewer] .ff-guidance-projection::before {
 content:"";width:15px;height:15px;background:currentColor;
 mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.7'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='9'/%3E%3Cpath d='M3 12h18M5 6.5h14M5 17.5h14'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
}

.outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-phone-draw-dock button.ff-guidance-projection {
 position:static;min-width:34px !important;width:34px !important;height:34px;flex-basis:34px !important;flex-shrink:0;padding:0;
 border:1px solid rgba(124,227,255,.74) !important;border-radius:999px;
 background:rgba(4,25,35,.78) !important;color:#55df88 !important;
 font-size:0 !important;gap:0;letter-spacing:0;box-shadow:0 8px 24px rgba(0,0,0,.3);
}
@media(max-width:600px) and (orientation:portrait){
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .outlook-hrrr-phone-draw-dock button.ff-guidance-projection {width:34px !important;min-width:34px !important;flex-basis:34px !important;}
 [data-hrrr-viewer]:has(.ff-guidance-projection:not([hidden])) .ff-guidance-shortcuts {left:154px;transform:none;}
}


/* Compare stays beside Models; Globe has its own slot and never shifts it. */
[data-hrrr-viewer] .ff-guidance-compare {
 position:absolute;left:60px;bottom:12px;z-index:40;display:inline-flex;align-items:center;justify-content:center;gap:6px;
 height:36px;min-width:96px;padding:6px 10px;border:1px solid #59656d;border-radius:6px;
 background:var(--ff-chrome-raised,#111b20);color:var(--ff-text,#eafaff);font-size:10px;font-weight:800;letter-spacing:.04em;cursor:pointer;
}
[data-hrrr-viewer] .ff-guidance-compare svg {width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
[data-hrrr-viewer] .ff-guidance-projection {left:168px;}
@media(max-width:899px),(orientation:landscape) and (max-height:620px) {
 [data-hrrr-viewer] .ff-guidance-compare {left:auto;right:86px;bottom:10px;height:34px;min-width:68px;width:68px;padding:0 6px;border-radius:999px;gap:3px;font-size:8px;border-color:#7ce3ffbd;background:rgba(4,25,35,.78);}
 [data-hrrr-viewer] .ff-guidance-compare svg {width:13px;height:13px;}
 [data-hrrr-viewer] .ff-guidance-shortcuts,[data-hrrr-viewer]:has(.ff-guidance-projection:not([hidden])) .ff-guidance-shortcuts {left:auto;right:164px;transform:none;}
 [data-hrrr-viewer].is-mobile-controls-open .ff-guidance-compare {visibility:hidden;pointer-events:none;}
}
@media(max-width:359px) and (orientation:portrait) {
 [data-hrrr-viewer] .ff-guidance-shortcuts,[data-hrrr-viewer]:has(.ff-guidance-projection:not([hidden])) .ff-guidance-shortcuts {left:10px;right:auto;bottom:52px;}
}
@media(orientation:landscape) and (max-height:620px) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] .ff-guidance-compare {bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px);}
}

[data-hrrr-viewer]{position:relative}[data-hrrr-viewer]>.ff-comparison-mode-frame{position:absolute;inset:var(--comparison-header-height,70px) 0 0;width:100%;height:calc(100% - var(--comparison-header-height,70px));border:0;z-index:80;background:#101517}[data-hrrr-viewer]>.ff-comparison-mode-frame[hidden]{display:none}
[data-hrrr-viewer] :is(.ff-guidance-panel > header,.ff-alert-header){border-bottom:1px solid #414749;padding-bottom:12px;margin-bottom:0}

/* Phone Weather Desk uses the same plain bell as comparison Settings. */
.ff-location-search {display:flex;flex:0 0 auto;}
[data-hrrr-viewer] .ff-weather-tabs{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px!important;width:100%;box-sizing:border-box}
[data-hrrr-viewer] .ff-weather-tabs>button{width:100%;min-width:0!important;min-height:38px;padding:8px!important;box-sizing:border-box}
.ff-location-search[hidden] {display:none!important;}
.ff-location-popover {position:static!important;z-index:75;width:100%;box-sizing:border-box;padding:8px;margin:0 0 10px;border:1px solid #756039;border-radius:6px;background:#101517;color:#edf7fa;box-shadow:none;}
.ff-location-popover[hidden] {display:none!important;}
.ff-location-popover input {width:100%;box-sizing:border-box;min-height:38px;padding:8px;border:1px solid #414749;border-radius:4px;background:#1b1e21;color:#edf7fa;font:inherit;font-size:16px;}
.ff-location-results {max-height:180px;overflow-y:auto;overscroll-behavior:contain;}
.ff-location-results button {display:block;width:100%;min-height:36px;padding:8px;text-align:left;border:0;border-bottom:1px solid #414749;border-radius:0;background:transparent;color:#edf7fa;font:inherit;font-size:12px;}
.ff-location-results button:is(:hover,:focus-visible) {background:#453a20;}
.ff-location-popover p {margin:6px 0;font-size:12px;}
.ff-location-popover p[role=status] {position:static!important;inset:auto!important;transform:none!important;width:auto!important;height:auto!important;pointer-events:none;}
.ff-location-popover p[role=status]:empty {display:none!important;}
.ff-location-popover > a {font-size:10px;color:#bfc5c7;}
[data-hrrr-viewer] .ff-location-popover{padding:6px!important;margin:0 0 12px!important;border-color:#42494d!important;border-radius:4px!important}
[data-hrrr-viewer] .ff-location-popover input{height:34px!important;min-height:34px!important;margin:0!important;padding:6px 8px!important;font-family:inherit!important;font-size:13px!important;line-height:20px!important;letter-spacing:0!important;text-align:left!important;border-color:#42494d!important;border-radius:4px!important}
[data-hrrr-viewer] .ff-location-popover > a{display:block;width:max-content;margin:4px auto 0;font-size:9px;line-height:12px;color:#929c9f;text-decoration:none}
@media(pointer:coarse){[data-hrrr-viewer] .ff-location-popover input{font-size:16px!important}}
@media(max-width:899px),(orientation:landscape) and (max-height:620px){[data-hrrr-viewer] .ff-alert-trigger{width:38px;height:36px;min-height:36px;padding:6px;justify-content:center}[data-hrrr-viewer] .ff-alert-trigger>b,[data-hrrr-viewer] .ff-alert-trigger>span{display:none!important}[data-hrrr-viewer] .ff-alert-trigger>svg{display:block!important;flex-shrink:0}}

/* Every Weather Desk tab shares one compact landscape surface. */
@media (orientation:landscape) and (max-height:620px) {
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer] :is(.ff-alert-panel,.ff-desk-dropdown),
 .outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].ff-settings-open .ff-desk-settings.ff-desk-dropdown {
  position:absolute!important;top:8px!important;bottom:calc(max(10px,env(safe-area-inset-bottom)) + 52px)!important;
  left:auto!important;right:max(8px,env(safe-area-inset-right))!important;
  width:min(360px,calc(100% - 16px))!important;max-width:calc(100% - 16px)!important;
  height:auto!important;max-height:calc(100% - max(10px,env(safe-area-inset-bottom)) - 60px)!important;
  box-sizing:border-box;margin:0!important;padding:10px!important;transform:none!important;
  font-size:12px!important;-webkit-text-size-adjust:100%;text-size-adjust:100%;
 }
 [data-hrrr-viewer] .ff-desk-settings .ff-settings-map-controls,
 [data-hrrr-viewer] .ff-desk-settings .outlook-hrrr-appearance,
 [data-hrrr-viewer] .ff-desk-settings .outlook-hrrr-display-controls {
  position:static!important;inset:auto!important;width:100%!important;min-width:0!important;
  max-width:100%!important;height:auto!important;max-height:none!important;overflow:visible!important;transform:none!important;
 }
 [data-hrrr-viewer] :is(.ff-fixed-panel-navigation,.ff-alert-panel) > :is(header,.ff-alert-header) h2 {font-size:18px!important;line-height:1.3!important;}
 [data-hrrr-viewer] .ff-weather-tabs {display:flex!important;gap:4px!important;}
 [data-hrrr-viewer] .ff-weather-tabs > button {flex:1 1 0;min-width:0!important;min-height:34px!important;padding:6px!important;font-size:12px!important;}
 [data-hrrr-viewer] .ff-desk-settings .ff-radar-settings h3 {font-size:11px!important;}
 [data-hrrr-viewer] .ff-desk-settings .ff-radar-settings label {font-size:12px!important;}
}

@media(max-width:899px),(orientation:landscape) and (max-height:620px){[data-hrrr-viewer] .ff-guidance-shortcuts button{border-color:#7ce3ffbd!important;background:rgba(4,25,35,.78)!important;color:#eafaff!important}}

[data-hrrr-viewer].is-comparison-mode>.outlook-hrrr-timeline{z-index:81;position:relative}
[data-hrrr-viewer].is-comparison-mode>.outlook-hrrr-timeline :is(.outlook-hrrr-play,.outlook-hrrr-speed,.outlook-hrrr-cache-meter,[data-hrrr-cache-label]){display:none!important}
[data-hrrr-viewer].is-comparison-mode>.outlook-hrrr-timeline{grid-template-columns:minmax(52px,1fr) auto!important}
[data-hrrr-viewer].is-comparison-mode>.outlook-hrrr-timeline>label{grid-column:1!important}
[data-hrrr-viewer].is-comparison-mode>.outlook-hrrr-timeline>.outlook-hrrr-frame-status{grid-column:2!important}

@media(min-width:701px) and (min-height:621px){.outlook-builder-dialog.is-guidance-standalone [data-hrrr-viewer].is-comparison-mode>.outlook-hrrr-timeline{margin-left:var(--comparison-map-left,250px)!important;width:var(--comparison-map-width,calc(100% - 250px))!important}}

/* Crop controls have their own full-height track. Never inherit playback offsets. */
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop .ff-loop-crop-track input[type=range] {
  box-sizing:border-box !important; inset:0 !important; transform:none !important;
  width:100% !important; height:44px !important; min-height:44px !important;
  padding:0 !important; margin:0 !important; border:0 !important;
}
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop .ff-loop-crop-track input[type=range]::-webkit-slider-runnable-track {
  box-sizing:border-box !important; height:44px !important; border:0 !important; background:transparent !important;
}
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop .ff-loop-crop-track input[type=range]::-webkit-slider-thumb {
  box-sizing:border-box !important; width:22px !important; height:32px !important;
  margin-top:6px !important; transform:none !important; border-radius:5px !important;
}
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop .ff-loop-crop-track input[type=range]::-moz-range-track {
  height:44px !important; border:0 !important; background:transparent !important;
}
.outlook-builder-dialog [data-hrrr-viewer] .ff-loop-crop .ff-loop-crop-track input[type=range]::-moz-range-thumb {
  box-sizing:border-box !important; width:22px !important; height:32px !important; border-radius:5px !important;
}

/* Radar and model display sliders share the same full-width settings controls. */
[data-hrrr-viewer] .ff-radar-settings input[type=range] { box-sizing:border-box!important; width:100%!important; min-width:0!important; height:20px!important; min-height:20px!important; padding:0!important; margin:0!important; border:0!important; border-radius:0!important; background:transparent!important; box-shadow:none!important; }

/* Product modes reuse Guidance control density and settings scope. */
[data-hrrr-viewer] .ff-radar-mode-switch button { font-family:inherit!important; font-size:12px!important; line-height:1.35!important; min-height:36px!important; padding:7px 10px!important; }
[data-hrrr-viewer] .ff-radar-controls .ff-field { margin:10px 0!important; gap:6px!important; }
[data-hrrr-viewer] .ff-radar-controls .ff-field > span { font-size:10px!important; }
[data-hrrr-viewer] .ff-radar-controls select { font-family:inherit!important; font-size:12px!important; line-height:1.35!important; min-height:36px!important; }
[data-hrrr-viewer] .ff-radar-products button { font-family:inherit!important; font-size:12px!important; font-weight:400!important; line-height:1.35!important; min-height:36px!important; padding:8px 10px!important; }
[data-hrrr-viewer] .ff-radar-controls p { margin:12px 0 0!important; font-size:11px!important; }
[data-hrrr-viewer] .ff-radar-controls .ff-radar-station-heading { display:flex!important; align-items:center!important; justify-content:space-between!important; gap:10px!important; }
[data-hrrr-viewer].ff-radar-active .outlook-hrrr-appearance-group.is-weather,
[data-hrrr-viewer].ff-radar-active label:has([data-cape-values]) { display:none!important; }
[data-hrrr-viewer]:not(.ff-radar-active) .ff-radar-settings { display:none!important; }
[data-hrrr-viewer] :is(.ff-model-dock-toggle,.ff-guidance-tools,.ff-guidance-shortcuts) svg { display:block; width:18px!important; height:18px!important; margin:0!important; }
[data-hrrr-viewer] .ff-alert-filters label { display:grid!important; grid-template-columns:18px minmax(0,1fr) 30px!important; padding:7px 0!important; gap:8px!important; }
[data-hrrr-viewer] .ff-alert-filters label:has(i) { grid-template-columns:10px 18px minmax(0,1fr) 30px!important; }
[data-hrrr-viewer] .ff-alert-filters b { text-align:center; font-size:12px!important; }
@media(min-width:900px) { [data-hrrr-viewer] .ff-feature-card:not(.ff-feature-outlook):not(.ff-feature-inline):not(.ff-feature-alert-summary) { width:min(760px,calc(100% - 24px)); } }
[data-hrrr-viewer] .ff-feature-card.ff-feature-alert-summary { width:min(340px,calc(100% - 20px)); padding:12px; }
[data-hrrr-viewer] .ff-feature-card.ff-feature-alert-summary h3 { color:inherit; font-size:15px; }
[data-hrrr-viewer] .ff-feature-card.ff-feature-alert-summary{border:1px solid var(--ff-border,#394348);border-radius:8px;outline:none}
[data-hrrr-viewer] .ff-feature-card.ff-feature-alert-summary article:last-child{padding-bottom:0}
[data-hrrr-viewer] .ff-feature-card.ff-feature-alert-summary article>button{display:inline-flex;align-items:center;min-height:24px;margin-top:3px;padding:0;border:0;border-radius:0;background:none;color:#ffcf45;font-size:12px;text-decoration:underline;text-underline-offset:3px}
[data-hrrr-viewer] .ff-feature-card.ff-feature-alert-details pre { white-space:pre-wrap; overflow-wrap:anywhere; font:12px/1.6 ui-monospace,monospace; color:inherit; margin:16px 0; }