.fer-odds-center { max-width: 1120px; }

.fer-oc-hero {
  margin: 0 0 16px;
  padding: clamp(24px, 5vw, 46px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  overflow: hidden;
  position: relative;
  color: #fff;
  border-radius: 22px;
  background: radial-gradient(circle at 87% 15%, rgba(79, 230, 174, .3), transparent 30%), linear-gradient(135deg, #071523, #112d3c 68%, #08724f);
  box-shadow: var(--fer-shadow);
}

.fer-oc-hero h1 { margin: 0 0 10px; color: #fff; font-size: clamp(32px, 5vw, 52px); letter-spacing: -.04em; line-height: 1; }
.fer-oc-hero p { max-width: 660px; margin: 0; color: #d5e4ea; font-size: 16px; }
.fer-oc-kicker { display: block; margin-bottom: 9px; color: #65efba; font-size: 11px; font-weight: 900; letter-spacing: .14em; }
.fer-oc-state { min-width: 172px; padding: 18px; display: grid; gap: 4px; border: 1px solid rgba(255,255,255,.18); border-radius: 16px; background: rgba(5,18,28,.35); }
.fer-oc-state strong { color: #68efba; font-size: 19px; }
.fer-oc-state span { color: #bed0d9; font-size: 10px; }

.fer-oc-summary { margin-bottom: 14px; display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
.fer-oc-summary article { min-height: 86px; padding: 15px 17px; display: grid; align-content: center; gap: 3px; border: 1px solid var(--fer-line); border-radius: 14px; background: var(--fer-card); box-shadow: 0 5px 18px rgba(15,31,52,.04); }
.fer-oc-summary span { color: var(--fer-muted); font-size: 10px; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.fer-oc-summary strong { color: var(--fer-navy); font-size: 25px; font-variant-numeric: tabular-nums; }

.fer-oc-pulse { margin-bottom: 14px; padding: 16px; overflow: hidden; border: 1px solid #cde6dd; border-radius: 16px; background: linear-gradient(135deg, #f7fcfa, #edf8f4); }
.fer-oc-pulse > header { margin-bottom: 11px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.fer-oc-pulse > header div { display: grid; gap: 2px; }
.fer-oc-pulse > header span { color: #087450; font-size: 8px; font-weight: 950; letter-spacing: .11em; }
.fer-oc-pulse h2 { margin: 0; color: var(--fer-navy); font-size: 20px; letter-spacing: -.02em; }
.fer-oc-pulse > header button { min-height: 38px; padding: 0 12px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid #b8ddcf; border-radius: 9px; color: #075f43; background: #fff; font-size: 9px; font-weight: 900; cursor: pointer; }
.fer-oc-pulse > header button:hover { color: #fff; background: var(--fer-green); }
.fer-oc-pulse > header button:disabled { opacity: .62; cursor: wait; }
.fer-oc-pulse > header button.is-refreshing span { animation: fer-oc-spin .8s linear infinite; }
.fer-oc-pulse > div { display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px; }
.fer-oc-pulse article { min-height: 62px; padding: 10px 12px; display: grid; align-content: center; gap: 1px; border: 1px solid rgba(7,95,67,.1); border-radius: 10px; background: rgba(255,255,255,.82); }
.fer-oc-pulse article span { color: var(--fer-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.fer-oc-pulse article strong { color: var(--fer-navy); font-size: 20px; font-variant-numeric: tabular-nums; }
.fer-oc-pulse article.is-down strong { color: #b23a42; }
.fer-oc-pulse article.is-up strong { color: #087450; }
.fer-oc-pulse article.is-visit { border-color: #ead79f; background: #fff9e8; }
.fer-oc-pulse > p { margin: 10px 2px 0; color: var(--fer-muted); font-size: 8px; line-height: 1.5; }
@keyframes fer-oc-spin { to { transform: rotate(360deg); } }

.fer-oc-watch { margin-bottom: 14px; padding: 16px; border: 1px solid #cbdcf0; border-radius: 16px; background: linear-gradient(135deg, #f7faff, #eef4fb); }
.fer-oc-watch > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.fer-oc-watch > header > div { display: grid; gap: 2px; }
.fer-oc-watch > header span { color: #285c7c; font-size: 8px; font-weight: 950; letter-spacing: .1em; }
.fer-oc-watch h2 { margin: 0; color: var(--fer-navy); font-size: 20px; letter-spacing: -.02em; }
.fer-oc-watch > header p { max-width: 680px; margin: 3px 0 0; color: var(--fer-muted); font-size: 9px; line-height: 1.5; }
.fer-oc-watch > header button { min-height: 40px; padding: 0 13px; display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; border: 1px solid #bed0e4; border-radius: 9px; color: #285c7c; background: #fff; font-size: 9px; font-weight: 900; cursor: pointer; }
.fer-oc-watch > header button:hover { color: #fff; background: #285c7c; }
.fer-oc-watch > header button span { color: inherit; font-size: 15px; letter-spacing: 0; }
.fer-oc-watch-stats { margin-top: 12px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.fer-oc-watch-stats article { min-height: 61px; padding: 10px 12px; display: grid; align-content: center; gap: 1px; border: 1px solid rgba(40,92,124,.12); border-radius: 10px; background: rgba(255,255,255,.84); }
.fer-oc-watch-stats span { color: var(--fer-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.fer-oc-watch-stats strong { color: var(--fer-navy); font-size: 20px; font-variant-numeric: tabular-nums; }
.fer-oc-watch-stats .is-reached { border-color: #b7dfcb; background: #f2fcf7; }
.fer-oc-watch-stats .is-reached strong { color: #087450; }
.fer-oc-watch-stats .is-unavailable strong { color: #8c5960; }
.fer-oc-watch > details { margin-top: 10px; overflow: hidden; border: 1px solid #cfdeec; border-radius: 11px; background: rgba(255,255,255,.7); }
.fer-oc-watch > details > summary { min-height: 43px; padding: 0 12px; display: flex; align-items: center; gap: 8px; color: #285c7c; font-size: 10px; font-weight: 900; list-style: none; cursor: pointer; }
.fer-oc-watch > details > summary::-webkit-details-marker { display: none; }
.fer-oc-watch > details > summary small { margin-left: auto; color: var(--fer-muted); font-size: 8px; font-weight: 700; }
.fer-oc-watch > details > summary i { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .18s ease; }
.fer-oc-watch > details[open] > summary { border-bottom: 1px solid #cfdeec; background: #f5f9fd; }
.fer-oc-watch > details[open] > summary i { transform: rotate(225deg); }
.fer-oc-watch > details > div { padding: 10px; }
.fer-oc-watch-list { display: grid; gap: 7px; }
.fer-oc-watch-list[hidden], .fer-oc-watch-empty[hidden] { display: none !important; }
.fer-oc-watch-item { min-height: 58px; display: grid; grid-template-columns: minmax(0, 1fr) auto 34px; align-items: center; gap: 8px; overflow: hidden; border: 1px solid #d7e2ec; border-radius: 10px; background: #fff; }
.fer-oc-watch-item > button:first-child { min-width: 0; min-height: 58px; padding: 8px 11px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1px 8px; border: 0; color: var(--fer-text); background: transparent; text-align: left; cursor: pointer; }
.fer-oc-watch-item > button:first-child strong, .fer-oc-watch-item > button:first-child span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-watch-item > button:first-child strong { color: var(--fer-navy); font-size: 10px; }
.fer-oc-watch-item > button:first-child span { color: var(--fer-muted); font-size: 8px; }
.fer-oc-watch-item > button:first-child b { grid-column: 2; grid-row: 1; color: var(--fer-navy); font-size: 14px; font-variant-numeric: tabular-nums; }
.fer-oc-watch-item > button:first-child small { grid-column: 2; grid-row: 2; color: #285c7c; font-size: 8px; font-weight: 900; }
.fer-oc-watch-item > em { padding: 5px 7px; border-radius: 999px; color: #285c7c; background: #e7f2f8; font-size: 7px; font-style: normal; font-weight: 900; white-space: nowrap; }
.fer-oc-watch-item.is-reached { border-color: #9fd5ba; background: #f5fcf8; }
.fer-oc-watch-item.is-reached > em { color: #087450; background: #dff7eb; }
.fer-oc-watch-item.is-unavailable { opacity: .72; }
.fer-oc-watch-item.is-unavailable > em { color: #865159; background: #f7e9eb; }
.fer-oc-watch-item-remove { width: 30px; height: 30px; padding: 0; display: grid; place-items: center; border: 1px solid #ead8dc; border-radius: 50%; color: #a0414a; background: #fff7f8; font-size: 16px; cursor: pointer; }
.fer-oc-watch-empty { padding: 18px; border: 1px dashed #c8d8e7; border-radius: 9px; text-align: center; }
.fer-oc-watch-empty strong { color: var(--fer-navy); font-size: 11px; }
.fer-oc-watch-empty p { margin: 4px auto 0; max-width: 640px; color: var(--fer-muted); font-size: 9px; line-height: 1.5; }
.fer-oc-watch > details footer { margin-top: 9px; display: flex; justify-content: flex-end; gap: 7px; }
.fer-oc-watch > details footer button { min-height: 36px; padding: 0 11px; border: 1px solid #bed0e4; border-radius: 8px; color: #285c7c; background: #fff; font-size: 8px; font-weight: 900; cursor: pointer; }
.fer-oc-watch > details footer button.is-danger { color: #99434b; border-color: #e9ccd0; background: #fff7f8; }
.fer-oc-watch > details footer button:disabled { opacity: .45; cursor: not-allowed; }
.fer-oc-watch-status { margin: 8px 2px 0; color: var(--fer-muted); font-size: 8px; line-height: 1.5; }

.fer-oc-slip { margin-bottom: 14px; padding: 16px; border: 1px solid #e3d3a4; border-radius: 16px; background: linear-gradient(135deg, #fffdf7, #fbf5e7); }
.fer-oc-slip > header { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.fer-oc-slip > header > div { display: grid; gap: 2px; }
.fer-oc-slip > header span { color: #886711; font-size: 8px; font-weight: 950; letter-spacing: .1em; }
.fer-oc-slip h2 { margin: 0; color: var(--fer-navy); font-size: 20px; letter-spacing: -.02em; }
.fer-oc-slip > header p { max-width: 700px; margin: 3px 0 0; color: var(--fer-muted); font-size: 9px; line-height: 1.5; }
.fer-oc-slip > header button { min-height: 40px; padding: 0 13px; display: inline-flex; align-items: center; gap: 7px; flex: 0 0 auto; border: 1px solid #ddca91; border-radius: 9px; color: #72550d; background: #fff; font-size: 9px; font-weight: 900; cursor: pointer; }
.fer-oc-slip > header button:hover { color: #fff; background: #886711; }
.fer-oc-slip > header button span { color: inherit; font-size: 15px; letter-spacing: 0; }
.fer-oc-slip-stats { margin-top: 12px; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.fer-oc-slip-stats article { min-height: 61px; padding: 10px 12px; display: grid; align-content: center; gap: 1px; border: 1px solid rgba(136,103,17,.13); border-radius: 10px; background: rgba(255,255,255,.84); }
.fer-oc-slip-stats span { color: var(--fer-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.fer-oc-slip-stats strong { color: var(--fer-navy); font-size: 20px; font-variant-numeric: tabular-nums; }
.fer-oc-slip-stats .is-changed strong { color: #9a6510; }
.fer-oc-slip > details { margin-top: 10px; overflow: hidden; border: 1px solid #e2d4ac; border-radius: 11px; background: rgba(255,255,255,.72); }
.fer-oc-slip > details > summary { min-height: 43px; padding: 0 12px; display: flex; align-items: center; gap: 8px; color: #72550d; font-size: 10px; font-weight: 900; list-style: none; cursor: pointer; }
.fer-oc-slip > details > summary::-webkit-details-marker { display: none; }
.fer-oc-slip > details > summary small { margin-left: auto; color: var(--fer-muted); font-size: 8px; font-weight: 700; }
.fer-oc-slip > details > summary i { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .18s ease; }
.fer-oc-slip > details[open] > summary { border-bottom: 1px solid #e2d4ac; background: #fffaf0; }
.fer-oc-slip > details[open] > summary i { transform: rotate(225deg); }
.fer-oc-slip > details > div { padding: 10px; }
.fer-oc-slip-plan-tabs { margin-bottom: 8px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.fer-oc-slip-plan-tabs button { min-width: 0; min-height: 66px; padding: 9px 10px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-content: center; gap: 2px 8px; border: 1px solid #e2d4ac; border-radius: 10px; color: var(--fer-text); background: #fffdf8; text-align: left; cursor: pointer; }
.fer-oc-slip-plan-tabs button:hover { border-color: #c9ad5d; background: #fff8e7; }
.fer-oc-slip-plan-tabs button.is-active { border-color: #aa821a; background: #fff3c9; box-shadow: inset 0 0 0 1px rgba(136,103,17,.12); }
.fer-oc-slip-plan-tabs strong, .fer-oc-slip-plan-tabs span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-slip-plan-tabs strong { color: var(--fer-navy); font-size: 10px; }
.fer-oc-slip-plan-tabs span { grid-column: 1; color: var(--fer-muted); font-size: 7px; }
.fer-oc-slip-plan-tabs b { grid-column: 2; grid-row: 1 / span 2; align-self: center; color: #72550d; font-size: 15px; font-variant-numeric: tabular-nums; }
.fer-oc-slip-plan-tools { margin-bottom: 9px; padding: 9px; display: grid; grid-template-columns: minmax(180px, 1fr) auto auto auto; align-items: end; gap: 7px; border: 1px solid #eadfbe; border-radius: 10px; background: #fffaf0; }
.fer-oc-slip-plan-tools label { min-width: 0; display: grid; gap: 4px; }
.fer-oc-slip-plan-tools label span { color: var(--fer-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.fer-oc-slip-plan-tools input { width: 100%; min-height: 38px; padding: 0 10px; border: 1px solid #dfd2ae; border-radius: 8px; color: var(--fer-text); background: #fff; font: inherit; font-size: 10px; font-weight: 800; }
.fer-oc-slip-plan-tools button { min-height: 38px; padding: 0 10px; border: 1px solid #ddca91; border-radius: 8px; color: #72550d; background: #fff; font-size: 8px; font-weight: 900; cursor: pointer; white-space: nowrap; }
.fer-oc-slip-plan-tools button.is-danger { color: #99434b; border-color: #e9ccd0; background: #fff7f8; }
.fer-oc-slip-plan-tools button:disabled { opacity: .45; cursor: not-allowed; }
.fer-oc-slip-compare { margin: 0 0 9px; overflow: hidden; border: 1px solid #d9c477; border-radius: 11px; background: #fffdf7; }
.fer-oc-slip-compare > summary { min-height: 42px; padding: 0 11px; display: flex; align-items: center; gap: 8px; color: #72550d; font-size: 9px; font-weight: 950; list-style: none; cursor: pointer; }
.fer-oc-slip-compare > summary::-webkit-details-marker { display: none; }
.fer-oc-slip-compare > summary small { margin-left: auto; color: var(--fer-muted); font-size: 8px; font-weight: 700; }
.fer-oc-slip-compare > summary i { width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .18s ease; }
.fer-oc-slip-compare[open] > summary { border-bottom: 1px solid #e1d39c; background: #fff7df; }
.fer-oc-slip-compare[open] > summary i { transform: rotate(225deg); }
.fer-oc-slip-compare > div { padding: 9px; }
.fer-oc-slip-portfolio-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.fer-oc-slip-portfolio-stats article { min-height: 53px; padding: 8px 10px; display: grid; align-content: center; gap: 1px; border: 1px solid #eadfbe; border-radius: 9px; background: #fff; }
.fer-oc-slip-portfolio-stats span { color: var(--fer-muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.fer-oc-slip-portfolio-stats strong { color: var(--fer-navy); font-size: 15px; font-variant-numeric: tabular-nums; }
.fer-oc-slip-portfolio-stats article.is-shared strong { color: #9a6510; }
.fer-oc-slip-compare-table { margin-top: 8px; overflow-x: auto; border: 1px solid #eadfbe; border-radius: 9px; background: #fff; }
.fer-oc-slip-compare-table:focus { outline: 3px solid rgba(136,103,17,.18); outline-offset: 2px; }
.fer-oc-slip-compare-table table { width: 100%; min-width: 900px; border-collapse: collapse; font-size: 8px; }
.fer-oc-slip-compare-table th, .fer-oc-slip-compare-table td { padding: 8px 9px; border-bottom: 1px solid #eee6cf; text-align: left; white-space: nowrap; font-variant-numeric: tabular-nums; }
.fer-oc-slip-compare-table th { color: #72550d; background: #fff9e8; font-size: 7px; text-transform: uppercase; }
.fer-oc-slip-compare-table tr:last-child td { border-bottom: 0; }
.fer-oc-slip-compare-table tr.is-active td { background: #fff8df; }
.fer-oc-slip-compare-table td button { padding: 0; border: 0; color: var(--fer-navy); background: transparent; font: inherit; font-weight: 900; cursor: pointer; text-decoration: underline; text-decoration-color: #d7c17b; text-underline-offset: 3px; }
.fer-oc-slip-compare-table td.is-up { color: #177a56; font-weight: 850; }
.fer-oc-slip-compare-table td.is-down { color: #a6444d; font-weight: 850; }
.fer-oc-slip-data-state { padding: 4px 7px; display: inline-flex; border-radius: 999px; color: #5c6670; background: #eef1f3; font-size: 7px; font-weight: 900; }
.fer-oc-slip-data-state.is-ready { color: #0f6848; background: #e1f4eb; }
.fer-oc-slip-data-state.is-partial { color: #77590e; background: #fff1c3; }
.fer-oc-slip-data-state.is-warning { color: #963e47; background: #ffe7e9; }
.fer-oc-slip-overlap { margin-top: 8px; display: grid; gap: 7px; }
.fer-oc-slip-overlap:empty { display: none; }
.fer-oc-slip-overlap article { padding: 9px 10px; border: 1px solid #e6dcbf; border-radius: 9px; background: #fff; }
.fer-oc-slip-overlap article.is-conflicting { border-color: #e7c9cd; background: #fff8f8; }
.fer-oc-slip-overlap header { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fer-oc-slip-overlap header > div { min-width: 0; display: grid; gap: 2px; }
.fer-oc-slip-overlap strong { overflow: hidden; color: var(--fer-navy); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-slip-overlap header span { color: var(--fer-muted); font-size: 7px; }
.fer-oc-slip-overlap em { padding: 4px 7px; flex: 0 0 auto; border-radius: 999px; color: #71560f; background: #fff0bd; font-size: 7px; font-style: normal; font-weight: 900; }
.fer-oc-slip-overlap article.is-conflicting em { color: #963e47; background: #ffe4e7; }
.fer-oc-slip-overlap ul { margin: 7px 0 0; padding: 7px 0 0 17px; border-top: 1px solid #eee7d4; color: var(--fer-muted); font-size: 8px; line-height: 1.55; }
.fer-oc-slip-overlap-empty { margin-top: 8px; padding: 13px; border: 1px dashed #dfd1aa; border-radius: 9px; text-align: center; }
.fer-oc-slip-overlap-empty[hidden] { display: none !important; }
.fer-oc-slip-overlap-empty strong { color: var(--fer-navy); font-size: 9px; }
.fer-oc-slip-overlap-empty p, .fer-oc-slip-compare-note { margin: 3px auto 0; color: var(--fer-muted); font-size: 8px; line-height: 1.5; }
.fer-oc-slip-compare-note { max-width: 800px; }
.fer-oc-slip-list { display: grid; gap: 7px; }
.fer-oc-slip-list[hidden], .fer-oc-slip-empty[hidden] { display: none !important; }
.fer-oc-slip-item { min-height: 62px; padding: 8px; display: grid; grid-template-columns: minmax(0, 1fr) auto 34px; align-items: center; gap: 9px; border: 1px solid #e4dcc6; border-radius: 10px; background: #fff; }
.fer-oc-slip-item > div:first-child { min-width: 0; display: grid; gap: 2px; }
.fer-oc-slip-item > div:first-child strong, .fer-oc-slip-item > div:first-child span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-slip-item > div:first-child strong { color: var(--fer-navy); font-size: 10px; }
.fer-oc-slip-item > div:first-child span, .fer-oc-slip-item > div:first-child small { color: var(--fer-muted); font-size: 8px; }
.fer-oc-slip-price { min-width: 92px; display: grid; justify-items: end; gap: 2px; }
.fer-oc-slip-price strong { color: var(--fer-navy); font-size: 16px; font-variant-numeric: tabular-nums; }
.fer-oc-slip-price span { color: var(--fer-muted); font-size: 7px; white-space: nowrap; }
.fer-oc-slip-price small { color: #7a6a3b; font-size: 7px; white-space: nowrap; }
.fer-oc-slip-item.is-changed { border-color: #ddc06e; background: #fffaf0; }
.fer-oc-slip-item.is-changed .fer-oc-slip-price span { color: #886711; font-weight: 850; }
.fer-oc-slip-item.is-unavailable { opacity: .7; }
.fer-oc-slip-item > button { width: 30px; height: 30px; padding: 0; display: grid; place-items: center; border: 1px solid #ead8dc; border-radius: 50%; color: #a0414a; background: #fff7f8; font-size: 16px; cursor: pointer; }
.fer-oc-slip-empty { padding: 18px; border: 1px dashed #dfd1aa; border-radius: 9px; text-align: center; }
.fer-oc-slip-empty strong { color: var(--fer-navy); font-size: 11px; }
.fer-oc-slip-empty p { margin: 4px auto 0; max-width: 650px; color: var(--fer-muted); font-size: 9px; line-height: 1.5; }
.fer-oc-slip-calculator { margin-top: 9px; padding: 10px; display: grid; grid-template-columns: 1fr 1fr 1fr; align-items: end; gap: 8px; border: 1px solid #eadfbe; border-radius: 10px; background: #fffdf8; }
.fer-oc-slip-calculator label { display: grid; gap: 4px; }
.fer-oc-slip-calculator span { color: var(--fer-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.fer-oc-slip-calculator input { width: 100%; min-height: 42px; padding: 0 11px; border: 1px solid #dfd2ae; border-radius: 8px; color: var(--fer-text); background: #fff; font: inherit; font-size: 11px; }
.fer-oc-slip-calculator article { min-height: 42px; padding: 6px 10px; display: grid; align-content: center; border: 1px solid #eadfbe; border-radius: 8px; background: #fff; }
.fer-oc-slip-calculator article strong { color: var(--fer-navy); font-size: 14px; font-variant-numeric: tabular-nums; }
.fer-oc-slip > details footer { margin-top: 9px; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
.fer-oc-slip > details footer button, .fer-oc-slip-import { min-height: 36px; padding: 0 11px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #ddca91; border-radius: 8px; color: #72550d; background: #fff; font-size: 8px; font-weight: 900; cursor: pointer; }
.fer-oc-slip > details footer button.is-danger { color: #99434b; border-color: #e9ccd0; background: #fff7f8; }
.fer-oc-slip > details footer button:disabled { opacity: .45; cursor: not-allowed; }
.fer-oc-slip-import input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.fer-oc-slip-import:focus-within { outline: 3px solid rgba(18,126,87,.28); outline-offset: 2px; }
.fer-oc-slip-status { margin: 8px 2px 0; color: var(--fer-muted); font-size: 8px; line-height: 1.5; }

.fer-oc-watch-dialog[hidden] { display: none !important; }
.fer-oc-watch-dialog { position: fixed; z-index: 99999; inset: 0; padding: 18px; display: grid; place-items: center; }
.fer-oc-watch-backdrop { position: absolute; inset: 0; border: 0; background: rgba(3,14,24,.72); cursor: default; }
.fer-oc-watch-dialog > section { width: min(100%, 510px); max-height: min(720px, calc(100vh - 36px)); padding: 20px; overflow: auto; position: relative; border: 1px solid #cbd9e5; border-radius: 18px; background: #fff; box-shadow: 0 24px 70px rgba(3,14,24,.3); }
.fer-oc-watch-dialog > section > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.fer-oc-watch-dialog > section > header > div { display: grid; gap: 2px; }
.fer-oc-watch-dialog > section > header span { color: #285c7c; font-size: 8px; font-weight: 950; letter-spacing: .1em; }
.fer-oc-watch-dialog h2 { margin: 0; color: var(--fer-navy); font-size: 18px; line-height: 1.3; }
.fer-oc-watch-dialog > section > header > button { width: 36px; height: 36px; padding: 0; display: grid; place-items: center; flex: 0 0 auto; border: 1px solid #dce4ea; border-radius: 50%; color: var(--fer-muted); background: #f8fafb; font-size: 20px; cursor: pointer; }
.fer-oc-watch-current { margin: 14px 0; padding: 13px 14px; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 12px; border: 1px solid #cbdcf0; border-radius: 11px; background: #f5f9fd; }
.fer-oc-watch-current span { color: var(--fer-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.fer-oc-watch-current strong { grid-column: 2; grid-row: 1 / span 2; color: var(--fer-navy); font-size: 24px; font-variant-numeric: tabular-nums; }
.fer-oc-watch-current small { color: #506c7d; font-size: 8px; line-height: 1.45; }
.fer-oc-watch-dialog form { display: grid; grid-template-columns: 1.5fr 1fr; gap: 10px; }
.fer-oc-watch-dialog form label { display: grid; gap: 5px; }
.fer-oc-watch-dialog form label span { color: var(--fer-muted); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.fer-oc-watch-dialog select, .fer-oc-watch-dialog input { width: 100%; min-height: 44px; padding: 0 11px; border: 1px solid #d4e0e7; border-radius: 9px; color: var(--fer-text); background: #fbfdfd; font: inherit; font-size: 11px; }
.fer-oc-watch-dialog select:focus, .fer-oc-watch-dialog input:focus { outline: 3px solid rgba(40,92,124,.15); border-color: #285c7c; }
.fer-oc-watch-dialog form > p { grid-column: 1 / -1; margin: 0; padding: 8px 10px; border-radius: 8px; color: #9e3e48; background: #fff0f1; font-size: 9px; }
.fer-oc-watch-dialog form > p[hidden] { display: none !important; }
.fer-oc-watch-dialog form footer { grid-column: 1 / -1; display: flex; justify-content: flex-end; gap: 8px; }
.fer-oc-watch-dialog form footer button { min-height: 42px; padding: 0 15px; border: 1px solid #285c7c; border-radius: 9px; color: #fff; background: #285c7c; font-size: 9px; font-weight: 900; cursor: pointer; }
.fer-oc-watch-dialog form footer button.is-danger { margin-right: auto; color: #9d3e47; border-color: #e8c9ce; background: #fff6f7; }
.fer-oc-watch-dialog form footer button.is-secondary { color: #72550d; border-color: #ddca91; background: #fffaf0; }
.fer-oc-watch-dialog form footer button.is-secondary.is-active { color: #fff; background: #886711; }
.fer-oc-watch-dialog form footer button[hidden] { display: none !important; }
.fer-oc-watch-disclaimer { margin: 13px 0 0; color: var(--fer-muted); font-size: 8px; line-height: 1.55; }
.fer-oc-watch-dialog-open { overflow: hidden; }

.fer-oc-filters { min-height: 54px; margin-bottom: 12px; padding: 7px; display: flex; align-items: center; gap: 6px; border: 1px solid var(--fer-line); border-radius: 14px; background: var(--fer-card); }
.fer-oc-filters a { min-height: 38px; padding: 0 15px; display: inline-flex; align-items: center; justify-content: center; border-radius: 9px; color: var(--fer-muted); font-size: 12px; font-weight: 850; }
.fer-oc-filters a:hover, .fer-oc-filters a.is-active { color: #fff; background: var(--fer-green); }
.fer-oc-updated { margin-left: auto; padding-right: 9px; color: var(--fer-muted); font-size: 10px; font-variant-numeric: tabular-nums; }

.fer-oc-tools { margin-bottom: 12px; padding: 12px; display: grid; grid-template-columns: minmax(210px, 1.25fr) minmax(190px, 1fr) auto auto; align-items: end; gap: 10px; border: 1px solid var(--fer-line); border-radius: 14px; background: var(--fer-card); }
.fer-oc-tools label { display: grid; gap: 5px; }
.fer-oc-tools label > span { color: var(--fer-muted); font-size: 9px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.fer-oc-tools input, .fer-oc-tools select { width: 100%; min-height: 42px; padding: 0 12px; border: 1px solid #d9e4e8; border-radius: 9px; color: var(--fer-text); background: #fbfdfd; font: inherit; font-size: 12px; }
.fer-oc-tools input:focus, .fer-oc-tools select:focus { outline: 3px solid rgba(10,163,108,.14); border-color: var(--fer-green); }
.fer-oc-tools > button { min-height: 42px; padding: 0 14px; border: 1px solid #cde3da; border-radius: 9px; color: var(--fer-green-dark); background: var(--fer-green-soft); font-size: 11px; font-weight: 900; cursor: pointer; white-space: nowrap; }
.fer-oc-tools > button.is-active { color: #fff; background: var(--fer-green); }
.fer-oc-tools > button b { min-width: 18px; margin-left: 4px; padding: 2px 5px; display: inline-block; border-radius: 999px; color: inherit; background: rgba(255,255,255,.45); font-size: 9px; }
.fer-oc-tools output { min-width: 92px; padding-bottom: 13px; color: var(--fer-muted); font-size: 10px; text-align: right; white-space: nowrap; }

.fer-oc-quick { margin-bottom: 12px; padding: 10px 12px; display: flex; align-items: end; gap: 10px; border: 1px solid var(--fer-line); border-radius: 14px; background: var(--fer-card); }
.fer-oc-quick > div { display: flex; flex-wrap: wrap; gap: 6px; }
.fer-oc-quick button { min-height: 36px; padding: 0 11px; border: 1px solid #d9e4e8; border-radius: 9px; color: var(--fer-muted); background: #f8fbfa; font-size: 10px; font-weight: 850; cursor: pointer; white-space: nowrap; }
.fer-oc-quick button:hover, .fer-oc-quick button.is-active { color: #fff; border-color: var(--fer-green); background: var(--fer-green); }
.fer-oc-quick button b { min-width: 17px; margin-left: 3px; padding: 2px 4px; display: inline-block; border-radius: 999px; color: inherit; background: rgba(255,255,255,.5); font-size: 7px; }
.fer-oc-quick label { min-width: 150px; margin-left: auto; display: grid; gap: 4px; }
.fer-oc-quick label span { color: var(--fer-muted); font-size: 8px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.fer-oc-quick select { min-height: 36px; padding: 0 10px; border: 1px solid #d9e4e8; border-radius: 9px; color: var(--fer-text); background: #fbfdfd; font: inherit; font-size: 10px; }
.fer-oc-quick .fer-oc-reset { color: #8c4b4f; border-color: #efd9da; background: #fff7f7; }
.fer-oc-quick .fer-oc-reset:hover { border-color: #b94b53; background: #b94b53; }

.fer-oc-advanced { margin-bottom: 12px; overflow: hidden; border: 1px solid var(--fer-line); border-radius: 14px; background: var(--fer-card); }
.fer-oc-advanced > summary { min-height: 46px; padding: 0 13px; display: flex; align-items: center; gap: 9px; color: var(--fer-text); font-size: 11px; font-weight: 900; list-style: none; cursor: pointer; }
.fer-oc-advanced > summary::-webkit-details-marker { display: none; }
.fer-oc-advanced > summary small { margin-left: auto; color: var(--fer-muted); font-size: 8px; font-weight: 650; }
.fer-oc-advanced > summary i { width: 8px; height: 8px; border-right: 2px solid var(--fer-green); border-bottom: 2px solid var(--fer-green); transform: rotate(45deg); transition: transform .18s ease; }
.fer-oc-advanced[open] > summary { border-bottom: 1px solid var(--fer-line); background: #f8fbfa; }
.fer-oc-advanced[open] > summary i { transform: rotate(225deg); }
.fer-oc-advanced > div { padding: 12px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: end; gap: 9px; }
.fer-oc-advanced label { display: grid; gap: 4px; }
.fer-oc-advanced label > span { color: var(--fer-muted); font-size: 8px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.fer-oc-advanced select { width: 100%; min-height: 40px; padding: 0 10px; border: 1px solid #d9e4e8; border-radius: 9px; color: var(--fer-text); background: #fbfdfd; font: inherit; font-size: 10px; }
.fer-oc-advanced button { min-height: 40px; padding: 0 12px; border: 1px solid #ead79f; border-radius: 9px; color: #795e10; background: #fff9e8; font-size: 9px; font-weight: 900; cursor: pointer; white-space: nowrap; }
.fer-oc-advanced button.is-active { color: #fff; border-color: #9b7813; background: #9b7813; }
.fer-oc-advanced button b { min-width: 18px; margin-left: 4px; padding: 2px 5px; display: inline-block; border-radius: 999px; color: inherit; background: rgba(255,255,255,.45); font-size: 8px; }

.fer-oc-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.fer-oc-card { overflow: hidden; border: 1px solid var(--fer-line); border-radius: 16px; background: var(--fer-card); box-shadow: 0 7px 24px rgba(15,31,52,.05); }
.fer-oc-card.is-live { border-color: rgba(10,163,108,.45); box-shadow: 0 7px 24px rgba(10,163,108,.08); }
.fer-oc-card > header { min-height: 55px; padding: 10px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid var(--fer-line); background: #f9fbfc; }
.fer-oc-card > header div { min-width: 0; display: grid; }
.fer-oc-card > header span { color: var(--fer-muted); font-size: 9px; font-weight: 750; text-transform: uppercase; }
.fer-oc-card > header strong { overflow: hidden; color: var(--fer-text); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-card > header aside { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
.fer-oc-card > header em { padding: 4px 7px; flex: 0 0 auto; border-radius: 999px; color: #087450; background: var(--fer-green-soft); font-size: 8px; font-style: normal; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.fer-oc-card > header em.fer-oc-moving { color: #285c7c; background: #e7f2f8; }
.fer-oc-card > header em.fer-oc-since-card { color: #795e10; background: #fff2bd; }
.fer-oc-card > header em.fer-oc-watch-card { color: #285c7c; background: #e7f2f8; }
.fer-oc-card > header em.fer-oc-watch-card.is-reached { color: #087450; background: #dff7eb; }
.fer-oc-card > header em.fer-oc-watch-card[hidden] { display: none !important; }
.fer-oc-card > header em.fer-oc-slip-card { color: #72550d; background: #fff2bd; }
.fer-oc-card > header em.fer-oc-slip-card[hidden] { display: none !important; }
.fer-oc-card > header em.fer-oc-shared-card { color: #8f3f48; background: #ffe9eb; }
.fer-oc-card > header em.fer-oc-shared-card[hidden] { display: none !important; }
.fer-oc-since-card[hidden] { display: none !important; }
.fer-oc-card > header [data-fer-oc-favorite] { width: 32px; height: 32px; padding: 0; display: grid; place-items: center; border: 1px solid #dce5e8; border-radius: 50%; color: #7b8991; background: #fff; font-size: 18px; line-height: 1; cursor: pointer; }
.fer-oc-card > header [data-fer-oc-favorite]:hover, .fer-oc-card > header [data-fer-oc-favorite].is-active { color: #936400; border-color: #f0d791; background: #fff7d9; }

.fer-oc-match { min-height: 83px; padding: 13px 14px; display: grid; grid-template-columns: 78px minmax(0, 1fr) auto; align-items: center; gap: 12px; }
.fer-oc-match:hover { background: #fbfdfc; }
.fer-oc-match time { color: var(--fer-muted); font-size: 11px; font-weight: 850; }
.is-live .fer-oc-match time { color: var(--fer-red); }
.fer-oc-match > div { min-width: 0; display: grid; gap: 5px; }
.fer-oc-match > div span { overflow: hidden; color: var(--fer-navy); font-size: 14px; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-match > b { color: var(--fer-navy); font-size: 18px; font-variant-numeric: tabular-nums; white-space: nowrap; }

.fer-oc-1x2 { padding: 0 14px 14px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.fer-oc-1x2 button { min-width: 0; min-height: 58px; padding: 7px 25px 7px 7px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: 6px; position: relative; border: 1px solid #dbe5e9; border-radius: 10px; color: var(--fer-text); background: #f8fbfa; cursor: pointer; }
.fer-oc-1x2 button:hover, .fer-oc-market > div button:hover { border-color: #9dbbd0; background: #f0f6fb; }
.fer-oc-1x2 small { color: var(--fer-green-dark); font-size: 10px; font-weight: 950; }
.fer-oc-1x2 span { overflow: hidden; color: var(--fer-muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-1x2 strong { color: var(--fer-navy); font-size: 15px; font-variant-numeric: tabular-nums; }
.fer-oc-movement { min-width: 40px; min-height: 22px; padding: 2px 5px !important; display: inline-flex; align-items: center; justify-content: center; gap: 3px; border-radius: 999px !important; font-size: 11px !important; font-style: normal !important; font-weight: 950 !important; letter-spacing: 0 !important; }
.fer-oc-movement b { color: inherit; font-size: 11px; line-height: 1; }
.fer-oc-movement small { color: inherit; font-size: 7px; font-weight: 850; line-height: 1; }
.fer-oc-movement.is-up { color: #087450 !important; background: #dff7eb !important; }
.fer-oc-movement.is-down { color: #b23a42 !important; background: #ffe7e9 !important; }
.fer-oc-since { position: absolute; top: -6px; right: -5px; min-width: 24px; min-height: 17px; padding: 1px 5px; display: inline-flex; align-items: center; justify-content: center; border: 2px solid #fff; border-radius: 999px; color: #fff !important; background: #9b7813; font-size: 7px !important; font-weight: 950 !important; line-height: 1; text-transform: uppercase; }
.fer-oc-since[hidden] { display: none !important; }
[data-fer-oc-selection].is-since-visit { border-color: #d7b64d !important; box-shadow: 0 0 0 2px rgba(215,182,77,.14); }
[data-fer-oc-selection]::after { content: '◎'; width: 18px; height: 18px; display: grid; place-items: center; position: absolute; right: 4px; bottom: 4px; border-radius: 50%; color: #65849a; background: #e9f1f6; font-size: 10px; font-style: normal; font-weight: 950; line-height: 1; }
[data-fer-oc-selection].is-watched { border-color: #6e9fc0 !important; box-shadow: 0 0 0 2px rgba(40,92,124,.1); }
[data-fer-oc-selection].is-watched::after { content: '●'; color: #285c7c; background: #dcebf5; }
[data-fer-oc-selection].is-target-reached { border-color: #45ad7b !important; background: #effaf4 !important; box-shadow: 0 0 0 2px rgba(10,163,108,.14); }
[data-fer-oc-selection].is-target-reached::after { content: '✓'; color: #fff; background: #087450; }
[data-fer-oc-selection].is-in-slip { border-color: #d1ad3f !important; box-shadow: inset 0 -3px 0 rgba(136,103,17,.2), 0 0 0 2px rgba(209,173,63,.1); }
[data-fer-oc-selection].is-in-slip::before { content: '+'; width: 17px; height: 17px; display: grid; place-items: center; position: absolute; left: 4px; bottom: 4px; border-radius: 50%; color: #fff; background: #886711; font-size: 11px; font-weight: 950; line-height: 1; }
.fer-oc-markets { border-top: 1px solid var(--fer-line); }
.fer-oc-markets > summary { min-height: 44px; padding: 0 14px; display: flex; align-items: center; gap: 8px; color: #075f43; background: #f3faf7; font-size: 10px; font-weight: 900; list-style: none; cursor: pointer; }
.fer-oc-markets > summary::-webkit-details-marker { display: none; }
.fer-oc-markets > summary:hover, .fer-oc-markets[open] > summary { background: #e9f7f1; }
.fer-oc-markets > summary small { margin-left: auto; color: var(--fer-muted); font-size: 8px; font-weight: 800; }
.fer-oc-markets > summary i { width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); transition: transform .18s ease; }
.fer-oc-markets[open] > summary i { transform: rotate(225deg); }
.fer-oc-market-grid { padding: 10px 12px 12px; display: grid; gap: 8px; border-top: 1px solid var(--fer-line); background: #fbfdfc; }
.fer-oc-market { overflow: hidden; border: 1px solid #dce7e3; border-radius: 10px; background: #fff; }
.fer-oc-market > header { min-height: 38px; padding: 7px 9px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 1px solid #e4ece9; background: #f7faf9; }
.fer-oc-market > header strong { color: var(--fer-navy); font-size: 10px; }
.fer-oc-market > header div { display: flex; align-items: center; gap: 5px; }
.fer-oc-market > header span { color: var(--fer-muted); font-size: 8px; white-space: nowrap; }
.fer-oc-market > header em { padding: 3px 6px; border-radius: 999px; color: #285c7c; background: #e7f2f8; font-size: 7px; font-style: normal; font-weight: 900; white-space: nowrap; }
.fer-oc-market.is-moving { border-color: #c7dfe9; }
.fer-oc-market > div { padding: 7px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.fer-oc-market > div button { min-width: 0; min-height: 46px; padding: 6px 25px 6px 8px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 6px; position: relative; border: 1px solid #e0e8e6; border-radius: 8px; color: var(--fer-text); background: #fbfdfc; cursor: pointer; }
.fer-oc-market > div button small { overflow: hidden; color: var(--fer-muted); font-size: 8px; font-weight: 750; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-market > div button strong { color: var(--fer-navy); font-size: 13px; font-variant-numeric: tabular-nums; }
.fer-oc-market-note { margin: -3px 12px 11px; color: var(--fer-muted); font-size: 8px; line-height: 1.45; }
.fer-oc-history { border-top: 1px solid var(--fer-line); }
.fer-oc-history > button { width: 100%; min-height: 42px; padding: 0 14px; display: flex; align-items: center; gap: 7px; border: 0; color: #285c7c; background: #f7fafc; font-size: 10px; font-weight: 900; text-align: left; cursor: pointer; }
.fer-oc-history > button:hover, .fer-oc-history > button[aria-expanded="true"] { color: #075f43; background: #edf9f4; }
.fer-oc-history > button > span { font-size: 15px; line-height: 1; transform: rotate(45deg); }
.fer-oc-history > button[aria-expanded="true"] > span { transform: rotate(135deg); }
[data-fer-oc-timeline-panel] { padding: 14px; border-top: 1px solid var(--fer-line); background: #fbfdfd; }
[data-fer-oc-timeline-panel][hidden] { display: none !important; }
[data-fer-oc-timeline-panel][aria-busy="true"] { min-height: 72px; display: grid; align-items: center; }
[data-fer-oc-timeline-panel] > p[role="status"] { margin: 0; color: var(--fer-muted); font-size: 10px; }
.fer-oc-timeline-head { margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fer-oc-timeline-head > div { display: grid; gap: 2px; }
.fer-oc-timeline-head strong { color: var(--fer-navy); font-size: 12px; }
.fer-oc-timeline-head span { color: var(--fer-muted); font-size: 8px; }
.fer-oc-timeline-head > b { padding: 5px 8px; border-radius: 999px; color: #285c7c; background: #e7f2f8; font-size: 8px; white-space: nowrap; }
.fer-oc-timeline-groups { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.fer-oc-timeline-groups > section { min-width: 0; overflow: hidden; border: 1px solid #dce6ea; border-radius: 10px; background: #fff; }
.fer-oc-timeline-groups > section > header { min-height: 42px; padding: 7px 8px; display: flex; align-items: center; justify-content: space-between; gap: 6px; border-bottom: 1px solid #e5ecef; background: #f7fafb; }
.fer-oc-timeline-groups > section > header span { overflow: hidden; color: var(--fer-muted); font-size: 8px; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.fer-oc-timeline-groups > section > header strong { color: var(--fer-navy); font-size: 13px; font-variant-numeric: tabular-nums; }
.fer-oc-timeline-groups ol { max-height: 184px; margin: 0; padding: 0; overflow: auto; list-style: none; }
.fer-oc-timeline-groups li { min-height: 38px; padding: 5px 7px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 1px 5px; border-top: 1px solid #eef2f4; font-variant-numeric: tabular-nums; }
.fer-oc-timeline-groups li:first-child { border-top: 0; }
.fer-oc-timeline-groups li time { color: var(--fer-muted); font-size: 7px; }
.fer-oc-timeline-groups li span { color: var(--fer-text); font-size: 9px; font-weight: 800; }
.fer-oc-timeline-groups li span b { color: var(--fer-muted); font-weight: 600; }
.fer-oc-timeline-groups li em { grid-column: 2; grid-row: 1 / span 2; font-size: 8px; font-style: normal; font-weight: 900; }
.fer-oc-timeline-groups li.is-up em { color: #087450; }
.fer-oc-timeline-groups li.is-down em { color: #b23a42; }
.fer-oc-timeline-groups section > p { min-height: 64px; margin: 0; padding: 12px 8px; color: var(--fer-muted); font-size: 8px; line-height: 1.5; }
.fer-oc-timeline-empty { padding: 14px; border: 1px dashed #ccdce2; border-radius: 10px; background: #fff; }
.fer-oc-timeline-empty strong { color: var(--fer-navy); font-size: 11px; }
.fer-oc-timeline-empty p { margin: 4px 0 0; color: var(--fer-muted); font-size: 9px; line-height: 1.55; }
.fer-oc-timeline-note { margin: 10px 0 0; color: var(--fer-muted); font-size: 8px; line-height: 1.5; }
.fer-oc-card > footer { min-height: 36px; padding: 8px 14px; display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--fer-muted); border-top: 1px solid var(--fer-line); font-size: 9px; }
.fer-oc-card > footer div { display: grid; gap: 2px; }
.fer-oc-card > footer div b { color: #5f7280; font-size: 8px; font-weight: 800; }
.fer-oc-card.is-live > footer span { color: var(--fer-green-dark); font-weight: 850; }

.fer-oc-empty, .fer-oc-filter-empty, .fer-oc-notice { padding: 26px; border: 1px solid var(--fer-line); border-radius: 16px; background: var(--fer-card); }
.fer-oc-empty { min-height: 180px; display: grid; place-content: center; text-align: center; }
.fer-oc-filter-empty { min-height: 130px; display: grid; place-content: center; text-align: center; }
.fer-oc-filter-empty[hidden] { display: none !important; }
.fer-oc-empty strong, .fer-oc-filter-empty strong, .fer-oc-notice strong { color: var(--fer-navy); }
.fer-oc-empty p, .fer-oc-filter-empty p, .fer-oc-notice p { max-width: 720px; margin: 7px 0 0; color: var(--fer-muted); font-size: 12px; line-height: 1.65; }
.fer-oc-notice { margin-top: 14px; border-color: #bfe7d6; background: var(--fer-green-soft); }

[data-fer-theme="dark"] .fer-oc-summary article,
[data-fer-theme="dark"] .fer-oc-pulse,
[data-fer-theme="dark"] .fer-oc-watch,
[data-fer-theme="dark"] .fer-oc-slip,
[data-fer-theme="dark"] .fer-oc-filters,
[data-fer-theme="dark"] .fer-oc-tools,
[data-fer-theme="dark"] .fer-oc-quick,
[data-fer-theme="dark"] .fer-oc-advanced,
[data-fer-theme="dark"] .fer-oc-card,
[data-fer-theme="dark"] .fer-oc-empty,
[data-fer-theme="dark"] .fer-oc-filter-empty { background: #101f30; }
[data-fer-theme="dark"] .fer-oc-pulse { border-color: #214438; }
[data-fer-theme="dark"] .fer-oc-watch { border-color: #2a465e; }
[data-fer-theme="dark"] .fer-oc-slip { border-color: #655622; }
[data-fer-theme="dark"] .fer-oc-pulse article { border-color: #274459; background: #132537; }
[data-fer-theme="dark"] .fer-oc-watch-stats article,
[data-fer-theme="dark"] .fer-oc-watch > details,
[data-fer-theme="dark"] .fer-oc-watch-item,
[data-fer-theme="dark"] .fer-oc-watch-dialog > section,
[data-fer-theme="dark"] .fer-oc-watch-current { color: #eaf1f5; border-color: #2a465e; background: #132537; }
[data-fer-theme="dark"] .fer-oc-slip-stats article,
[data-fer-theme="dark"] .fer-oc-slip > details,
[data-fer-theme="dark"] .fer-oc-slip-item,
[data-fer-theme="dark"] .fer-oc-slip-plan-tabs button,
[data-fer-theme="dark"] .fer-oc-slip-plan-tools,
[data-fer-theme="dark"] .fer-oc-slip-compare,
[data-fer-theme="dark"] .fer-oc-slip-portfolio-stats article,
[data-fer-theme="dark"] .fer-oc-slip-compare-table,
[data-fer-theme="dark"] .fer-oc-slip-overlap article,
[data-fer-theme="dark"] .fer-oc-slip-overlap-empty,
[data-fer-theme="dark"] .fer-oc-slip-calculator,
[data-fer-theme="dark"] .fer-oc-slip-calculator article { color: #eaf1f5; border-color: #655622; background: #292616; }
[data-fer-theme="dark"] .fer-oc-watch > details[open] > summary,
[data-fer-theme="dark"] .fer-oc-watch-dialog select,
[data-fer-theme="dark"] .fer-oc-watch-dialog input { color: #eaf1f5; background: #172b3f; }
[data-fer-theme="dark"] .fer-oc-slip > details[open] > summary,
[data-fer-theme="dark"] .fer-oc-slip-compare[open] > summary,
[data-fer-theme="dark"] .fer-oc-slip-plan-tools input,
[data-fer-theme="dark"] .fer-oc-slip-calculator input { color: #eaf1f5; background: #322d18; }
[data-fer-theme="dark"] .fer-oc-slip-plan-tabs button.is-active { border-color: #caa84f; background: #433918; }
[data-fer-theme="dark"] .fer-oc-slip-compare-table th { color: #e7cf80; background: #3a321b; }
[data-fer-theme="dark"] .fer-oc-slip-compare-table th,
[data-fer-theme="dark"] .fer-oc-slip-compare-table td,
[data-fer-theme="dark"] .fer-oc-slip-overlap ul { border-color: #5a4d28; }
[data-fer-theme="dark"] .fer-oc-slip-compare-table tr.is-active td { background: #403719; }
[data-fer-theme="dark"] .fer-oc-slip-compare-table td button { color: #f3f7fa; }
[data-fer-theme="dark"] .fer-oc-slip-overlap article.is-conflicting { border-color: #754047; background: #352123; }
[data-fer-theme="dark"] .fer-oc-watch-item.is-reached { border-color: #2e7155; background: #142d26; }
[data-fer-theme="dark"] .fer-oc-watch h2,
[data-fer-theme="dark"] .fer-oc-watch-stats strong,
[data-fer-theme="dark"] .fer-oc-watch-item strong,
[data-fer-theme="dark"] .fer-oc-watch-item b,
[data-fer-theme="dark"] .fer-oc-watch-dialog h2,
[data-fer-theme="dark"] .fer-oc-watch-current strong,
[data-fer-theme="dark"] .fer-oc-watch-empty strong { color: #f3f7fa; }
[data-fer-theme="dark"] .fer-oc-slip h2,
[data-fer-theme="dark"] .fer-oc-slip-stats strong,
[data-fer-theme="dark"] .fer-oc-slip-plan-tabs strong,
[data-fer-theme="dark"] .fer-oc-slip-portfolio-stats strong,
[data-fer-theme="dark"] .fer-oc-slip-overlap strong,
[data-fer-theme="dark"] .fer-oc-slip-overlap-empty strong,
[data-fer-theme="dark"] .fer-oc-slip-item strong,
[data-fer-theme="dark"] .fer-oc-slip-calculator strong,
[data-fer-theme="dark"] .fer-oc-slip-empty strong { color: #f3f7fa; }
[data-fer-theme="dark"] .fer-oc-pulse article.is-visit { border-color: #655622; background: #292616; }
[data-fer-theme="dark"] .fer-oc-pulse > header button { color: #72ddb5; border-color: #315e4e; background: #132537; }
[data-fer-theme="dark"] .fer-oc-card > header,
[data-fer-theme="dark"] .fer-oc-1x2 button,
[data-fer-theme="dark"] .fer-oc-tools input,
[data-fer-theme="dark"] .fer-oc-tools select,
[data-fer-theme="dark"] .fer-oc-quick select,
[data-fer-theme="dark"] .fer-oc-quick button,
[data-fer-theme="dark"] .fer-oc-advanced select,
[data-fer-theme="dark"] .fer-oc-advanced button,
[data-fer-theme="dark"] .fer-oc-advanced[open] > summary { color: #eaf1f5; background: #132537; }
[data-fer-theme="dark"] .fer-oc-history > button,
[data-fer-theme="dark"] .fer-oc-markets > summary,
[data-fer-theme="dark"] .fer-oc-market-grid,
[data-fer-theme="dark"] .fer-oc-market,
[data-fer-theme="dark"] .fer-oc-market > header,
[data-fer-theme="dark"] .fer-oc-market > div button,
[data-fer-theme="dark"] [data-fer-oc-timeline-panel],
[data-fer-theme="dark"] .fer-oc-timeline-groups > section,
[data-fer-theme="dark"] .fer-oc-timeline-empty { color: #eaf1f5; background: #132537; }
[data-fer-theme="dark"] .fer-oc-timeline-groups > section > header { background: #172b3f; }
[data-fer-theme="dark"] .fer-oc-summary strong,
[data-fer-theme="dark"] .fer-oc-pulse h2,
[data-fer-theme="dark"] .fer-oc-pulse article strong,
[data-fer-theme="dark"] .fer-oc-match > div span,
[data-fer-theme="dark"] .fer-oc-match > b,
[data-fer-theme="dark"] .fer-oc-1x2 strong,
[data-fer-theme="dark"] .fer-oc-market > header strong,
[data-fer-theme="dark"] .fer-oc-market > div button strong,
[data-fer-theme="dark"] .fer-oc-empty strong { color: #f3f7fa; }
[data-fer-theme="dark"] .fer-oc-pulse article.is-down strong { color: #ff9aa0; }
[data-fer-theme="dark"] .fer-oc-pulse article.is-up strong { color: #72ddb5; }
[data-fer-theme="dark"] .fer-oc-since { border-color: #132537; }

@media (max-width: 760px) {
  .fer-oc-hero { align-items: flex-start; flex-direction: column; }
  .fer-oc-state { width: 100%; }
  .fer-oc-summary { grid-template-columns: repeat(2, 1fr); }
  .fer-oc-pulse > div { grid-template-columns: repeat(2, 1fr); }
  .fer-oc-pulse article.is-visit { grid-column: 1 / -1; }
  .fer-oc-watch > header { align-items: flex-start; }
  .fer-oc-watch-stats { grid-template-columns: repeat(2, 1fr); }
  .fer-oc-watch-stats article:last-child { grid-column: 1 / -1; }
  .fer-oc-slip > header { align-items: flex-start; }
  .fer-oc-slip-stats { grid-template-columns: repeat(2, 1fr); }
  .fer-oc-slip-stats article:first-child { grid-column: 1 / -1; }
  .fer-oc-slip-plan-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fer-oc-slip-plan-tools { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fer-oc-slip-plan-tools label { grid-column: 1 / -1; }
  .fer-oc-slip-portfolio-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fer-oc-tools { grid-template-columns: 1fr 1fr; }
  .fer-oc-tools output { padding: 0 3px; text-align: left; }
  .fer-oc-quick { align-items: stretch; flex-wrap: wrap; }
  .fer-oc-quick > div { flex: 1 1 100%; }
  .fer-oc-quick label { margin-left: 0; flex: 1 1 190px; }
  .fer-oc-advanced > div { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fer-oc-advanced button { width: 100%; }
  .fer-oc-list { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
  .fer-odds-center { width: min(100% - 20px, 1120px); padding-top: 18px; }
  .fer-oc-hero { padding: 23px 20px; border-radius: 17px; }
  .fer-oc-summary article { min-height: 72px; padding: 12px; }
  .fer-oc-pulse { padding: 13px; }
  .fer-oc-pulse > header { align-items: flex-start; }
  .fer-oc-pulse > header button { min-height: 44px; }
  .fer-oc-pulse article { min-height: 58px; }
  .fer-oc-watch { padding: 13px; }
  .fer-oc-watch > header { flex-direction: column; }
  .fer-oc-watch > header button { width: 100%; min-height: 44px; justify-content: center; }
  .fer-oc-watch-stats article { min-height: 57px; }
  .fer-oc-watch > details > summary { min-height: 50px; }
  .fer-oc-watch > details > summary small { display: none; }
  .fer-oc-watch-item { grid-template-columns: minmax(0, 1fr) 32px; }
  .fer-oc-watch-item > em { grid-column: 1; margin: 0 10px 8px; justify-self: start; }
  .fer-oc-watch-item-remove { grid-column: 2; grid-row: 1 / span 2; }
  .fer-oc-watch > details footer { flex-direction: column; }
  .fer-oc-watch > details footer button { width: 100%; min-height: 42px; }
  .fer-oc-watch-dialog { padding: 10px; }
  .fer-oc-watch-dialog > section { max-height: calc(100vh - 20px); padding: 16px; border-radius: 14px; }
  .fer-oc-watch-dialog form { grid-template-columns: 1fr; }
  .fer-oc-watch-dialog form > p, .fer-oc-watch-dialog form footer { grid-column: 1; }
  .fer-oc-watch-dialog form footer { flex-direction: column-reverse; }
  .fer-oc-watch-dialog form footer button, .fer-oc-watch-dialog form footer button.is-danger { width: 100%; margin: 0; }
  .fer-oc-slip { padding: 13px; }
  .fer-oc-slip > header { flex-direction: column; }
  .fer-oc-slip > header button { width: 100%; min-height: 44px; justify-content: center; }
  .fer-oc-slip-stats article { min-height: 57px; }
  .fer-oc-slip > details > summary { min-height: 50px; }
  .fer-oc-slip > details > summary small { display: none; }
  .fer-oc-slip-plan-tabs { grid-template-columns: 1fr; }
  .fer-oc-slip-plan-tools { grid-template-columns: 1fr; }
  .fer-oc-slip-plan-tools label { grid-column: 1; }
  .fer-oc-slip-plan-tools button { width: 100%; min-height: 42px; }
  .fer-oc-slip-compare > summary { min-height: 48px; }
  .fer-oc-slip-compare > summary small { display: none; }
  .fer-oc-slip-portfolio-stats { grid-template-columns: 1fr 1fr; }
  .fer-oc-slip-portfolio-stats article { min-height: 50px; }
  .fer-oc-slip-overlap header { align-items: flex-start; flex-direction: column; gap: 6px; }
  .fer-oc-slip-overlap em { align-self: flex-start; }
  .fer-oc-slip-item { grid-template-columns: minmax(0, 1fr) 32px; }
  .fer-oc-slip-price { grid-column: 1; justify-items: start; }
  .fer-oc-slip-item > button { grid-column: 2; grid-row: 1 / span 2; }
  .fer-oc-slip-calculator { grid-template-columns: 1fr; }
  .fer-oc-slip > details footer { flex-direction: column; }
  .fer-oc-slip > details footer button, .fer-oc-slip-import { width: 100%; min-height: 42px; }
  .fer-oc-filters { flex-wrap: wrap; }
  .fer-oc-filters a { flex: 1; padding: 0 8px; }
  .fer-oc-updated { width: 100%; margin: 0; padding: 2px 5px; text-align: right; }
  .fer-oc-match { grid-template-columns: 65px minmax(0, 1fr) auto; gap: 8px; }
  .fer-oc-1x2 { padding-right: 10px; padding-left: 10px; gap: 5px; }
  .fer-oc-tools { grid-template-columns: 1fr; }
  .fer-oc-tools output { min-height: 20px; }
  .fer-oc-quick > div button { flex: 1 1 auto; }
  .fer-oc-quick label, .fer-oc-quick .fer-oc-reset { width: 100%; }
  .fer-oc-advanced > summary { min-height: 52px; }
  .fer-oc-advanced > summary small { display: none; }
  .fer-oc-advanced > div { grid-template-columns: 1fr; }
  .fer-oc-advanced select, .fer-oc-advanced button { min-height: 44px; }
  .fer-oc-1x2 button { min-height: 54px; grid-template-columns: auto 1fr auto; }
  .fer-oc-1x2 span { display: none; }
  .fer-oc-1x2 .fer-oc-since:not([hidden]) { display: inline-flex; }
  .fer-oc-market > div { grid-template-columns: 1fr; }
  .fer-oc-market > div button { min-height: 44px; }
  .fer-oc-timeline-groups { grid-template-columns: 1fr; }
  .fer-oc-timeline-groups ol { max-height: 150px; }
}

@media (prefers-reduced-motion: reduce) {
  .fer-oc-card { scroll-behavior: auto; }
  .fer-oc-pulse > header button.is-refreshing span { animation: none; }
}