/* wx-fc16.css · SAME-15 2026-10-11 (Errol: the /weather day-by-day forecast on /crew-weather too, truly identical).
 Generated from the live /weather page: every rule that styles #fcSummary and #forecastCards, scoped under #fc16,
 so both pages paint the list from this one file. Edit here, not in two places. Emblem block at the end. */
#fc16{--green:#34d399;--yellow:#fbbf24;--red:#f87171;--display:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--text2:#d3d6db;--gold:#d4a853;--mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--text3:#9aa1ab;--text4:#9aa0ac;--body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--hair:rgba(255,255,255,.12);--gold-soft:#e5c77b;--ice:#a9c8d8;--ease:cubic-bezier(.2,.7,.2,1)}
#fc16 *,#fc16 ::before,#fc16 ::after{box-sizing: border-box; margin: 0px; padding: 0px;}
#fc16 .agi-conf-pip{display: inline-block; width: 4px; height: 10px; border-radius: 2px; margin: 0px 1px; opacity: 0.7; vertical-align: middle;}
#fc16 .fc{display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px;}
#fc16 .fc-card{background: rgba(255, 255, 255, 0.12); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 10px; display: flex; align-items: stretch; min-height: 52px; overflow: hidden; position: relative; transition: border-color 0.2s;}
#fc16 .fc-card.fc-nogo{border-color: rgba(239, 68, 68, 0.3); background: rgba(239, 68, 68, 0.05);}
#fc16 .fc-card.fc-caution{border-color: rgba(251, 191, 36, 0.2);}
#fc16 .fc-status-dot{flex-shrink: 0; font-size: 14px; line-height: 1; margin-right: 2px;}
#fc16 .fc-status-dot.dot-go{color: var(--green);}
#fc16 .fc-status-dot.dot-caution{color: var(--yellow);}
#fc16 .fc-status-dot.dot-nogo{color: var(--red);}
#fc16 .fc-card-body{flex: 1 1 0%; min-width: 0px; padding: 7px 12px 6px 10px; display: flex; flex-direction: column; justify-content: center; gap: 2px; overflow: hidden;}
#fc16 .fc-card-top{display: flex; align-items: center; gap: 4px; line-height: 1; overflow: hidden;}
#fc16 .fc-day{font-family: var(--display); font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text2); flex-shrink: 0;}
#fc16 .fc-day.today{color: var(--gold);}
#fc16 .fc-date{font-weight: 500; font-size: 11px; opacity: 0.85; letter-spacing: 0.02em; margin-left: 3px;}
#fc16 .fc-badge-wrap{display: flex; align-items: center; gap: 4px; flex-shrink: 0; margin-left: auto; overflow: hidden;}
#fc16 .fc-tags{display: flex; flex-wrap: nowrap; gap: 3px;}
#fc16 .fc-tag{font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: 0.04em; padding: 2px 5px; border-radius: 4px; line-height: 1;}
#fc16 .fc-tag.cold{background: rgba(0, 212, 255, 0.1); color: rgb(0, 212, 255); border: 1px solid rgba(0, 212, 255, 0.2);}
#fc16 .fc-tag.rain{background: rgba(227, 175, 37, 0.1); color: rgb(227, 175, 37); border: 1px solid rgba(227, 175, 37, 0.25);}
#fc16 .fc-tag.eta-tag{background: rgba(212, 168, 83, 0.1); color: var(--gold); border: 1px solid rgba(212, 168, 83, 0.25); font-style: italic;}
#fc16 .fc-card::before{content: ""; position: absolute; top: 0px; left: 0px; right: 0px; height: 1px; background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.12), transparent); z-index: 1;}
#fc16 .fc-card-mid{display: flex; align-items: center; gap: 6px; line-height: 1; overflow: hidden;}
#fc16 .fc-icon{font-size: 18px; line-height: 1; flex-shrink: 0;}
#fc16 .fc-hilo{font-family: var(--display); font-weight: 700; font-size: 16px; display: flex; gap: 4px; align-items: baseline; flex-shrink: 0;}
#fc16 .fc-hi{color: rgb(255, 255, 255); font-weight: 700;}
#fc16 .fc-lo{color: var(--text3); font-size: 14px; font-weight: 600;}
#fc16 .fc-card-stats{display: flex; align-items: center; gap: 4px; font-family: var(--mono); font-size: 11px; font-weight: 700; color: var(--text3); margin-left: auto; flex-shrink: 1; min-width: 0px; overflow: hidden; flex-wrap: nowrap;}
#fc16 .fc-stat{display: flex; align-items: center; gap: 2px; white-space: nowrap;}
#fc16 .fc-stat.wind-breezy{color: var(--text2);}
#fc16 .fc-stat-sep{color: var(--text4); font-size: 8px;}
#fc16 .fc-summary{font-family: var(--mono); font-size: 12px; font-weight: 700; color: var(--text3); margin-bottom: 10px; letter-spacing: 0.03em; display: flex; align-items: center; gap: 6px; flex-wrap: wrap;}
#fc16 .fc-summary   .s-go{color: var(--green);}
#fc16 .fc-summary   .s-caution{color: var(--yellow);}
#fc16 .fc-summary   .s-nogo{color: var(--red);}
#fc16 .fc-summary   .s-sep{color: var(--text4);}
#fc16 .fc-bar{height: 2px; background: rgba(255, 255, 255, 0.12); position: absolute; bottom: 0px; left: 0px; right: 0px;}
#fc16 .fc-bar-fill{position: absolute; top: 0px; height: 100%; transition: width 0.5s, left 0.5s;}
#fc16 .fc-card{cursor: pointer;}
#fc16 .fc-card-wrap{margin-bottom: 2px;}
#fc16 .fc-expand-chev{position: absolute; right: 8px; top: 50%; transform: translateY(-50%); font-size: 10px; color: var(--text4); transition: transform 0.3s, color 0.3s; pointer-events: none; z-index: 2;}
#fc16 .fc-card.fc-expanded   .fc-expand-chev{transform: translateY(-50%) rotate(180deg); color: var(--gold);}
#fc16 .fc-detail{max-height: 0px; overflow: hidden; transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.3s, padding 0.3s; opacity: 0; background: rgba(255, 255, 255, 0.055); border-right: 1px solid rgba(255, 255, 255, 0.12); border-bottom: 1px solid rgba(255, 255, 255, 0.12); border-left: 1px solid rgba(255, 255, 255, 0.12); border-image: initial; border-top: none; border-radius: 0px 0px 10px 10px; padding: 0px 12px; margin-top: -2px;}
#fc16 .fc-detail.fc-detail-open{border-color: rgba(212, 168, 83, 0.15); overflow: hidden; max-height: 600px !important; opacity: 1 !important; padding: 14px 12px 12px !important;}
#fc16 .fc-detail-liner{font-family: var(--body); font-size: 13px; font-weight: 600; color: var(--gold); font-style: italic; margin-bottom: 10px; line-height: 1.4; padding-bottom: 8px; border-bottom: 1px solid rgba(255, 255, 255, 0.12);}
#fc16 .fc-detail-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px;}
#fc16 .fc-detail-item{display: flex; flex-direction: column; gap: 1px;}
#fc16 .fc-detail-label{font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text4);}
#fc16 .fc-detail-val{font-family: var(--display); font-size: 14px; font-weight: 700; color: var(--text2);}
#fc16 .fc-detail-val.highlight{color: var(--gold);}
#fc16 .fc-detail-val.warn{color: var(--yellow);}
#fc16 .fc-detail-temps{display: flex; gap: 4px; margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, 0.12);}
#fc16 .fc-detail-temp-block{flex: 1 1 0%; text-align: center; padding: 6px 2px; background: rgba(255, 255, 255, 0.055); border-radius: 6px; border: 1px solid rgba(255, 255, 255, 0.12);}
#fc16 .fc-detail-temp-label{font-family: var(--mono); font-size: 9px; font-weight: 700; color: var(--text4); letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 2px;}
#fc16 .fc-detail-temp-val{font-family: var(--display); font-size: 15px; font-weight: 700; color: rgb(255, 255, 255);}
#fc16 .fc-detail-precip-row{display: flex; gap: 4px; margin-top: 8px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, 0.12);}
#fc16 .fc-detail-precip-block{flex: 1 1 0%; text-align: center; padding: 4px 2px; background: rgba(255, 255, 255, 0.055); border-radius: 6px;}
#fc16 .fc-detail-precip-label{font-family: var(--mono); font-size: 9px; font-weight: 700; color: var(--text4); letter-spacing: 0.06em;}
#fc16 .fc-detail-precip-val{font-family: var(--display); font-size: 13px; font-weight: 700;}
#fc16 .fc-detail-precip-cap{font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text4); margin-top: 8px; padding-top: 8px; margin-bottom: 3px; border-top: 1px solid rgba(255, 255, 255, 0.12);}
#fc16 .fc-detail-precip-row{margin-top: 0px; padding-top: 0px; border-top: none;}
@media (prefers-reduced-motion: reduce){#fc16 *,#fc16 ::before,#fc16 ::after{animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important;}}
#fc16 ::selection{background: rgba(212, 168, 83, 0.35); color: rgb(255, 255, 255);}
#fc16 #forecastCards{display: flex; flex-direction: column; border: 1px solid var(--hair); border-radius: 24px; background: linear-gradient(rgba(23, 26, 32, 0.9), rgba(10, 11, 14, 0.94)); padding: 6px 10px; gap: 0px !important;}
#fc16 #forecastCards   .fc-card-wrap{border-bottom: 1px solid rgba(255, 255, 255, 0.12); margin: 0px !important;}
#fc16 #forecastCards   .fc-card-wrap:last-child{border-bottom: 0px;}
#fc16 #forecastCards   .fc-card{grid-template-columns: 26px 92px 30px 40px minmax(60px, 1fr) 40px minmax(0px, 150px) 16px; align-items: center; gap: 10px; min-height: 54px; cursor: pointer; display: grid !important; padding: 6px !important; background: transparent !important; border: 0px !important; border-radius: 12px !important; overflow: visible !important;}
#fc16 #forecastCards   .fc-card::before{display: none;}
#fc16 #forecastCards   .fc-card.fc-nogo{background: rgba(248, 113, 113, 0.05) !important;}
#fc16 #forecastCards   .fc-card-body,#fc16 #forecastCards   .fc-card-top,#fc16 #forecastCards   .fc-card-mid,#fc16 #forecastCards   .fc-hilo{display: contents !important;}
#fc16 #forecastCards   .agi-conf-pip{order: 0; position: absolute; opacity: 0; pointer-events: none;}
#fc16 #forecastCards   .fc-status-dot{order: 1; font-size: 13px; text-align: center;}
#fc16 #forecastCards   .fc-day{order: 2; font: 600 14px/1.1 var(--display) !important; letter-spacing: -0.01em !important; text-transform: none !important; color: rgb(255, 255, 255) !important;}
#fc16 #forecastCards   .fc-day.today{color: var(--gold-soft) !important;}
#fc16 #forecastCards   .fc-date{display: block; color: var(--text3); margin: 3px 0px 0px !important; font: 500 10.5px/1 var(--mono) !important; opacity: 1 !important;}
#fc16 #forecastCards   .fc-icon{order: 3; font-size: 20px; text-align: center;}
#fc16 #forecastCards   .fc-hi{order: 4; text-align: right; font: 500 14px/1 var(--mono) !important; color: rgb(255, 255, 255) !important;}
#fc16 #forecastCards   .fc-bar{order: 5; transform: scaleX(-1); border-radius: 6px; position: relative !important; inset: auto !important; height: 6px !important; background: rgba(255, 255, 255, 0.12) !important; margin: 0px !important; width: auto !important;}
#fc16 #forecastCards   .fc-bar-fill{position: absolute; top: 0px; bottom: 0px; border-radius: 6px; box-shadow: rgba(212, 168, 83, 0.4) 0px 0px 12px; height: auto !important; background: linear-gradient(90deg,var(--ice),var(--gold) 70%,var(--gold-soft)) !important;}
#fc16 #forecastCards   .fc-lo{order: 6; text-align: left; font: 500 14px/1 var(--mono) !important; color: var(--ice) !important;}
#fc16 #forecastCards   .fc-card-stats{order: 7; justify-content: flex-end; align-items: center; gap: 5px; font: 500 11.5px/1.2 var(--mono); color: var(--text3); min-width: 0px; overflow: hidden; white-space: nowrap; display: flex !important;}
#fc16 #forecastCards   .fc-stat{text-overflow: ellipsis; overflow: hidden; font: 500 11.5px/1.2 var(--mono) !important;}
#fc16 #forecastCards   .fc-expand-chev{order: 8; font-size: 9px; color: var(--text4); transition: transform .3s var(--ease); position: static !important;}
#fc16 #forecastCards   .fc-badge-wrap{order: 9; grid-column: 2 / -1; justify-content: flex-start; margin: -4px 0px 4px !important;}
#fc16 #forecastCards   .fc-badge-wrap:empty,#fc16 #forecastCards   .fc-badge-wrap:not(:has(.fc-tag)){display: none !important;}
#fc16 #forecastCards   .fc-tags{flex-wrap: wrap !important;}
#fc16 #forecastCards   .fc-detail{padding: 0px 10px;}
#fc16 #fcSummary{font: 500 12px/1.4 var(--mono) !important; color: var(--text3) !important;}
@media (max-width: 640px){#fc16 #forecastCards{padding: 4px 6px; border-radius: 20px;}}
@media (max-width: 640px){#fc16 #forecastCards   .fc-card{grid-template-columns: 24px 56px 24px 32px minmax(36px, 1fr) 32px 44px 12px; gap: 7px; padding: 6px 2px !important;}}
@media (max-width: 640px){#fc16 #forecastCards   .fc-day{font-size: 13px !important;}}
@media (max-width: 640px){#fc16 #forecastCards   .fc-card-stats   .fc-stat:first-child,#fc16 #forecastCards   .fc-card-stats   .fc-stat-sep{display: none !important;}}
@media (max-width: 640px){#fc16 #forecastCards   .fc-card-stats   .fc-precip-amt{display: none !important;}}
#fc16 *{min-width: 0px; max-width: 100%;}
@media (min-width: 1200px){#fc16 *{grid-column: 1 / -1;}}
@media (min-width: 1200px){#fc16 #fcSummary{grid-area: 3 / 1;}}
@media (min-width: 1200px){#fc16 #forecastCards{grid-area: 4 / 1 / span 6; align-self: start;}}
@media (min-width: 1200px){#fc16 #forecastCards   .fc-card{gap: 8px; grid-template-columns: 26px 84px 28px 40px minmax(40px, 1fr) 40px auto 16px !important;}}
#fc16 .fc-date,#fc16 .agi-conf-pip{opacity: 1 !important;}
/* EMBLEM 2026-10-11 (Errol: the GO / CAUTION / NO-GO emblem on the far left has to stand out): a filled, glowing
   badge, green check for GO, amber ! for CAUTION (amber lightning when storms), red X for NO-GO. */
#fc16 #forecastCards .fc-status-dot,#fc16 .fc-status-dot{display:grid!important;place-items:center;width:24px!important;height:24px!important;margin:0!important;border-radius:50%;font:900 13px/1 Inter,system-ui,sans-serif!important;text-align:center;opacity:1!important}
#fc16 .fc-status-dot.dot-go{background:#22c55e!important;color:#052e14!important;box-shadow:0 0 0 2px rgba(34,197,94,.28),0 0 12px rgba(34,197,94,.55)}
#fc16 .fc-status-dot.dot-caution,#fc16 .fc-status-dot.dot-warn{background:#f59e0b!important;color:#231400!important;box-shadow:0 0 0 2px rgba(245,158,11,.28),0 0 12px rgba(245,158,11,.55)}
#fc16 .fc-status-dot.dot-warn{font-size:12px!important}
#fc16 .fc-status-dot.dot-nogo{background:#ef4444!important;color:#fff!important;box-shadow:0 0 0 2px rgba(239,68,68,.3),0 0 12px rgba(239,68,68,.6)}
@media (max-width:420px){#fc16 #forecastCards .fc-status-dot,#fc16 .fc-status-dot{width:22px!important;height:22px!important;font-size:12px!important}}
