/* ROI3 v18 Operations and Billing & Finance. Every selector is anchored to #revenue and an op18 or fn18 class. Nothing animates. Amber means "what has to be true". */

/* Heading and lead */
#revenue .op18-eyebrow, #revenue .fn18-eyebrow { margin: 0 0 .5rem; color: var(--teal); font-size: .8rem; font-weight: 700; letter-spacing: .08em; line-height: 1.3; text-transform: uppercase; }
#revenue .op18-title, #revenue .fn18-title { max-width: 22ch; margin: 0 0 .5rem; font-size: clamp(1.9rem, 4.4vw, 3.25rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.06; }
#revenue .op18-lead, #revenue .fn18-lead { max-width: 62ch; margin: 0; color: var(--muted); font-size: 1.1rem; line-height: 1.4; }
#revenue .op18-hint, #revenue .fn18-hint { margin: .7rem 0 0; font-size: .92rem; font-weight: 600; line-height: 1.35; }
#revenue .op18-hint-amber, #revenue .fn18-hint-amber { color: var(--amber); }

/* SVG paint */
#revenue .op18-fw, #revenue .fn18-fw { fill: #fff; }
#revenue .op18-ft { fill: var(--teal); }
#revenue .op18-lw { stroke: #fff; stroke-width: 4; }
#revenue .op18-la, #revenue .fn18-la { stroke: var(--amber); }
#revenue .fn18-lk { stroke: var(--ink); }
#revenue .fn18-lt { stroke: var(--teal); }
#revenue .fn18-lb { stroke: var(--blue); }
#revenue .fn18-lv { stroke: var(--violet); }

/* Shared labels and controls */
#revenue .op18-k, #revenue .fn18-k { display: block; color: var(--muted); font-size: .78rem; font-weight: 700; letter-spacing: .05em; line-height: 1.2; text-transform: uppercase; }
#revenue .op18-n, #revenue .fn18-n { display: block; color: var(--ink); font-size: 1.08rem; font-weight: 800; line-height: 1.18; }
#revenue .op18-n-big, #revenue .fn18-n-big { font-size: 1.75rem; letter-spacing: -.02em; line-height: 1.1; }
#revenue .op18-d, #revenue .fn18-d { display: block; margin-top: .15rem; color: var(--muted); font-size: .88rem; font-weight: 400; line-height: 1.28; }
#revenue .op18-plus, #revenue .fn18-plus { display: inline-grid; flex: none; width: 1.4rem; height: 1.4rem; place-items: center; border-radius: 50%; background: var(--blue); color: #fff; font-size: 1rem; font-weight: 800; line-height: 1; }
#revenue .op18-plus-inline, #revenue .fn18-plus-inline { margin-right: .4rem; vertical-align: -.25rem; }
#revenue .op18-cta, #revenue .fn18-cta { display: flex; align-items: center; gap: .4rem; min-height: 1.75rem; margin-top: .4rem; color: var(--blue); font-size: .9rem; font-weight: 700; line-height: 1.2; }
#revenue .op18-open, #revenue .fn18-open { color: inherit; text-decoration: none; }
#revenue .op18-open:hover .op18-cta, #revenue .fn18-open:hover .fn18-cta { text-decoration: underline; }
#revenue .op18-open:hover .op18-plus, #revenue .fn18-open:hover .fn18-plus { background: var(--ink); }
#revenue .op18-obj { display: block; min-width: 0; min-height: 44px; }
#revenue .op18-gate, #revenue .fn18-gate { display: inline-flex; align-items: center; min-height: 44px; padding: .3rem .75rem; border: 2px solid var(--amber); border-radius: 2rem; background: #fff; color: var(--ink); font-size: .88rem; font-weight: 700; line-height: 1.15; }
#revenue .op18-gate::after, #revenue .fn18-gate::after { content: " \203A"; margin-left: .3rem; color: var(--amber); font-weight: 800; }
#revenue .op18-gate:hover, #revenue .fn18-gate:hover { background: var(--amber); color: #fff; text-decoration: underline; }
#revenue .op18-gate:hover::after, #revenue .fn18-gate:hover::after { color: #fff; }
#revenue .op18-gates { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin-top: .6rem; }
#revenue .op18-gates-l { flex: 1 1 100%; margin: 0; font-size: .88rem; font-weight: 700; line-height: 1.25; }
#revenue .fn18-gates { margin: .6rem 0 0; }
#revenue .op18-foot, #revenue .fn18-foot { max-width: 76ch; margin: .9rem 0 0; color: var(--muted); font-size: .875rem; line-height: 1.4; }
#revenue .op18-link { display: inline-block; padding: .55rem 0; font-weight: 700; text-underline-offset: 3px; }
#revenue .op18-topics-h, #revenue .fn18-topics-h { margin: 2rem 0 .5rem; font-size: 1.25rem; font-weight: 800; }

/* Stages */
#revenue .op18-path, #revenue .fn18-path { display: grid; gap: 1rem; margin: 1.1rem 0 0; padding: 0; list-style: none; }
#revenue .op18-stage, #revenue .fn18-stage { min-width: 0; }
#revenue .op18-stage-h, #revenue .fn18-stage-h { margin: 0 0 .6rem; color: var(--ink); font-size: 1.1rem; font-weight: 800; line-height: 1.22; }
#revenue .op18-band { padding: .8rem; border-radius: .35rem; background: #e6f4f2; }
#revenue .op18-band-out { background: #f1f8f7; }
#revenue .fn18-band { padding: .8rem; border-radius: .35rem; background: #fff7ea; }

/* Sequence arrows, vertical on phones */
#revenue .op18-arrow { position: relative; display: block; flex: none; width: 3px; height: 1.4rem; margin: .35rem 0 calc(.35rem + 8px) 1rem; background: var(--ink); }
#revenue .op18-arrow::after { content: ""; position: absolute; bottom: -8px; left: -6px; border-top: 10px solid var(--ink); border-right: 7.5px solid transparent; border-left: 7.5px solid transparent; }

/* Operations: queue, check and return */
#revenue .op18-floor { display: block; }
#revenue .op18-q { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 4px; max-width: 11.5rem; margin-bottom: .55rem; }
#revenue .op18-files { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 3px; max-width: 13rem; margin-bottom: .55rem; }
#revenue .op18-fld { position: relative; display: block; aspect-ratio: 5 / 4; margin-top: 2px; border-radius: 0 2px 2px 2px; background: #6b7a90; }
#revenue .op18-fld::before { content: ""; position: absolute; top: -2px; left: 0; width: 45%; height: 2px; background: inherit; }
#revenue .op18-fld-new { background: var(--teal); }
#revenue .op18-check { display: grid; gap: 2px; margin: .35rem 0; padding: .35rem; border: 2px solid var(--ink); border-radius: .35rem; background: #fff; }
#revenue .op18-check-r { display: flex; align-items: center; gap: .4rem; padding: .15rem .25rem; font-size: .88rem; font-weight: 600; line-height: 1.2; }
#revenue .op18-check-flag { border-radius: .2rem; background: #fff7ea; color: var(--amber); font-weight: 800; }
#revenue .op18-mark { display: inline-grid; flex: none; width: 1.15rem; height: 1.15rem; place-items: center; border-radius: 50%; background: var(--teal); color: #fff; font-size: .72rem; font-weight: 800; line-height: 1; }
#revenue .op18-mark-flag { background: var(--amber); }
#revenue .op18-exit-pic { width: 4.5rem; height: auto; margin-bottom: .45rem; }
#revenue .op18-return { margin-top: .7rem; }

/* Operations: hours */
#revenue .op18-hours { display: grid; gap: 1.1rem; }
#revenue .op18-tiles-row { display: grid; grid-template-columns: 3.1rem auto 2.5rem; align-items: center; justify-content: start; gap: .4rem; margin-top: .35rem; }
#revenue .op18-tiles-l { font-size: .88rem; font-weight: 600; }
#revenue .op18-tiles { display: flex; gap: 3px; }
#revenue .op18-tile { display: block; width: 1.75rem; height: 1.75rem; border-radius: 2px; background: #6b7a90; }
#revenue .op18-tile-after { background: var(--teal); }
#revenue .op18-tile-empty { border: 2px dashed var(--teal); background: #fff; }
#revenue .op18-tiles-v { font-size: 1.15rem; font-weight: 800; }
#revenue .op18-ledger-wrap { min-width: 0; }
#revenue .op18-ledger { display: block; margin-top: .35rem; }
#revenue .op18-ledger-gap { margin-top: 1rem; }
#revenue .op18-bar-l { display: block; margin: .45rem 0 .15rem; font-size: .9rem; font-weight: 700; line-height: 1.22; }
#revenue .op18-bar, #revenue .fn18-bar { display: grid; width: 100%; min-height: 2.4rem; }
#revenue .op18-bar-before { grid-template-columns: minmax(0, 1fr); }
#revenue .op18-bar-after { grid-template-columns: minmax(0, 160fr) minmax(0, 24fr) minmax(0, 16fr); }
#revenue .op18-bar-cmp { grid-template-columns: minmax(0, 160fr) minmax(0, 40fr); }
#revenue .op18-bar-bridge { grid-template-columns: minmax(0, 60fr) minmax(0, 40fr); }
#revenue .op18-seg, #revenue .fn18-seg { display: flex; align-items: center; justify-content: center; min-width: 0; padding: .15rem 0; font-size: .86rem; font-weight: 800; line-height: 1.1; text-align: center; }
#revenue .op18-seg-old { background: #6b7a90; color: #fff; }
#revenue .op18-seg-after { background: var(--teal); color: #fff; }
#revenue .op18-seg-new { background: var(--teal); color: #fff; }
#revenue .op18-seg-rest { background: repeating-linear-gradient(135deg, #fff7ea 0 6px, #fbe6c8 6px 12px); box-shadow: inset 0 0 0 2px var(--amber); color: var(--ink); }
#revenue .op18-seg-free { background: #fff; box-shadow: inset 0 0 0 2px var(--teal); color: var(--teal); }
#revenue .op18-seg-cost { background: #6b7a90; color: #fff; }
#revenue .op18-seg-gp { background: var(--teal); color: #fff; }
#revenue .op18-bracket { display: grid; grid-template-columns: minmax(0, 160fr) minmax(0, 40fr); align-items: end; margin-top: .1rem; }
#revenue .op18-bracket-t { padding-right: .35rem; color: var(--teal); font-size: .86rem; font-weight: 800; line-height: 1.1; text-align: right; }
#revenue .op18-bracket-b { display: block; height: .55rem; border: 2px solid var(--teal); border-bottom: 0; }
#revenue .op18-axis, #revenue .fn18-axis { display: flex; justify-content: space-between; margin-top: .15rem; color: var(--muted); font-size: .8rem; line-height: 1.2; }
#revenue .op18-key, #revenue .fn18-key { display: grid; gap: .25rem; margin-top: .45rem; }
#revenue .op18-key-r, #revenue .fn18-key-r { display: flex; align-items: flex-start; gap: .45rem; font-size: .88rem; line-height: 1.25; }
#revenue .op18-key-sum { font-size: .95rem; font-weight: 800; line-height: 1.25; }
#revenue .op18-sw, #revenue .fn18-sw { display: block; flex: none; width: .85rem; height: .85rem; margin-top: .15rem; }
#revenue .op18-sw-old { background: #6b7a90; }
#revenue .op18-sw-new { background: var(--teal); }
#revenue .op18-sw-rest { background: #fbe6c8; box-shadow: inset 0 0 0 2px var(--amber); }

/* Operations: outcome */
#revenue .op18-outcome { display: block; }
#revenue .op18-link-c { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .7rem; min-width: 0; }
#revenue .op18-link-t { font-size: .9rem; font-weight: 800; line-height: 1.2; }
#revenue .op18-obj-gp { padding: .65rem .7rem; border-radius: .35rem; background: var(--ink); }
#revenue .op18-obj-gp .op18-k { color: #8fe0d2; }
#revenue .op18-obj-gp .op18-n { color: #fff; }
#revenue .op18-obj-gp .op18-d { color: #c9d4e3; }
#revenue .op18-obj-gp .op18-cta { color: #fff; }
#revenue .op18-obj-gp .op18-plus { background: #fff; color: var(--ink); }
#revenue .op18-obj-gp:hover .op18-plus { background: #5eead4; }
#revenue .op18-strip { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: .7rem; align-items: start; min-height: 44px; margin-top: 1rem; padding: .7rem .8rem; border-left: 4px solid var(--amber); border-radius: .25rem; background: #fff7ea; }
#revenue .op18-strip-pic { width: 100%; height: auto; }
#revenue .op18-strip-t { display: block; min-width: 0; }

/* Finance: invoice trays */
#revenue .fn18-batch { display: grid; gap: .7rem; }
#revenue .fn18-batch-sum { display: block; min-width: 0; }
#revenue .fn18-trays { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: .5rem; }
#revenue .fn18-tray { display: block; min-width: 0; min-height: 44px; }
#revenue .fn18-tray .fn18-n { font-size: 1.2rem; }
#revenue .fn18-inv-grid { display: grid; gap: 3px; margin-bottom: .45rem; }
#revenue .fn18-inv-grid-ready { grid-template-columns: repeat(10, minmax(0, 1.5rem)); }
#revenue .fn18-inv-grid-held { grid-template-columns: repeat(5, minmax(0, 1.5rem)); }
#revenue .fn18-inv { display: block; aspect-ratio: 1 / 1; border-radius: 2px; background: var(--teal); }
#revenue .fn18-inv-held { border: 2px dashed var(--amber); background: #fff7ea; }

/* Finance: route */
#revenue .fn18-route { display: block; min-height: 44px; }
#revenue .fn18-rsteps { display: grid; gap: .55rem; }
#revenue .fn18-rstep { display: grid; grid-template-columns: 2.25rem minmax(0, 1fr); gap: .6rem; align-items: center; min-width: 0; }
#revenue .fn18-ric { width: 2.25rem; height: 2.25rem; }
#revenue .fn18-rstep-t { display: block; min-width: 0; }
#revenue .fn18-rstep-t strong { display: block; font-size: .93rem; font-weight: 800; line-height: 1.2; }

/* Finance: timeline and bars on one scale */
#revenue .fn18-tl-link, #revenue .fn18-lens-link { display: block; min-height: 44px; }
#revenue .fn18-tl { display: block; }
#revenue .fn18-tl-l { display: block; margin: .45rem 0 .15rem; font-size: .92rem; line-height: 1.25; }
#revenue .fn18-tl-before { grid-template-columns: minmax(0, 10fr) minmax(0, 30fr); }
#revenue .fn18-tl-after { grid-template-columns: minmax(0, 2fr) minmax(0, 30fr) minmax(0, 8fr); }
#revenue .fn18-seg-wait { background: repeating-linear-gradient(135deg, #fff7ea 0 6px, #fbe6c8 6px 12px); box-shadow: inset 0 0 0 2px var(--amber); color: var(--ink); }
#revenue .fn18-seg-terms { background: var(--blue); color: #fff; }
#revenue .fn18-seg-early { background: #fff; box-shadow: inset 0 0 0 2px var(--teal); color: var(--teal); }
#revenue .fn18-sw-wait { background: #fbe6c8; box-shadow: inset 0 0 0 2px var(--amber); }
#revenue .fn18-sw-terms { background: var(--blue); }
#revenue .fn18-sw-early { background: #fff; box-shadow: inset 0 0 0 2px var(--teal); }
#revenue .fn18-same { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: .7rem; align-items: start; margin-top: .7rem; }
#revenue .fn18-same-pic { width: 100%; height: auto; }
#revenue .fn18-same-t { display: block; min-width: 0; }

/* Finance: separate margin lens */
#revenue .fn18-lens { margin-top: 1.5rem; padding-top: .9rem; border-top: 3px solid var(--violet); }
#revenue .fn18-lens-head { display: grid; grid-template-columns: 2.75rem minmax(0, 1fr); gap: .6rem; align-items: center; margin-bottom: .2rem; }
#revenue .fn18-lens-pic { width: 100%; height: auto; }
#revenue .fn18-lens-t { min-width: 0; }
#revenue .fn18-lens-k { margin: 0 0 .15rem; color: var(--violet); font-size: .78rem; font-weight: 700; letter-spacing: .05em; line-height: 1.2; text-transform: uppercase; }
#revenue .fn18-lens .fn18-stage-h { margin-bottom: 0; }
#revenue .fn18-bar-plan { grid-template-columns: minmax(0, 800fr) minmax(0, 2000fr) minmax(0, 1200fr); }
#revenue .fn18-bar-act { grid-template-columns: minmax(0, 1200fr) minmax(0, 2000fr) minmax(0, 800fr); }
#revenue .fn18-bar-batch { grid-template-columns: minmax(0, 80fr) minmax(0, 40fr); }
#revenue .fn18-seg-staff { background: var(--violet); color: #fff; }
#revenue .fn18-seg-other { background: #6b7a90; color: #fff; }
#revenue .fn18-seg-gp { background: var(--teal); color: #fff; }
#revenue .fn18-seg-ready { padding: .2rem .25rem; background: var(--teal); color: #fff; }
#revenue .fn18-seg-held { padding: .2rem .25rem; background: #fff7ea; box-shadow: inset 0 0 0 2px var(--amber); color: var(--ink); }
#revenue .fn18-sw-staff { background: var(--violet); }
#revenue .fn18-sw-other { background: #6b7a90; }
#revenue .fn18-sw-gp { background: var(--teal); }

/* Finance: decision */
#revenue .fn18-choice { display: grid; gap: .6rem; min-height: 44px; margin-top: 1.25rem; padding: .8rem; border-radius: .35rem; background: var(--bg); }
#revenue .fn18-lensc { display: block; min-width: 0; padding: .55rem .65rem; border-left: 4px solid var(--teal); border-radius: .2rem; background: #fff; font-size: .9rem; line-height: 1.3; }
#revenue .fn18-lensc strong { display: block; margin: .1rem 0; font-size: .96rem; font-weight: 800; line-height: 1.25; }
#revenue .fn18-lensc-v { border-left-color: var(--violet); }
#revenue .fn18-choice-to { display: block; min-width: 0; }
#revenue .fn18-chips { display: flex; flex-wrap: wrap; gap: .3rem; margin-top: .3rem; }
#revenue .fn18-chip { padding: .2rem .55rem; border: 1px solid var(--line); border-radius: 1rem; background: #fff; font-size: .84rem; font-weight: 600; line-height: 1.25; }
#revenue .fn18-twolens { display: grid; gap: .6rem; }

/* Reader content, in the article and cloned into the dialog */
#revenue .op18-content, #revenue .fn18-content { font-size: 1rem; line-height: 1.5; }
#revenue .op18-content p, #revenue .fn18-content p { margin: 0 0 .8rem; }
#revenue .op18-content .op18-topic-lead, #revenue .fn18-content .fn18-topic-lead { font-size: 1.08rem; font-weight: 800; line-height: 1.3; }
#revenue .op18-fig, #revenue .fn18-fig { margin: 0 0 1rem; padding: .85rem; border-radius: .35rem; background: var(--bg); }
#revenue .op18-fig figcaption, #revenue .fn18-fig figcaption { margin-top: .6rem; color: var(--muted); font-size: .88rem; line-height: 1.3; }
#revenue .op18-content .op18-decide, #revenue .fn18-content .fn18-decide { margin: 1rem 0; padding: .7rem .85rem; border-left: 4px solid var(--amber); border-radius: .25rem; background: #fff7ea; }
#revenue .op18-t, #revenue .fn18-t { width: 100%; margin: 0 0 1rem; border-collapse: collapse; font-size: .92rem; line-height: 1.3; }
#revenue .op18-fig .op18-t { margin: .8rem 0 0; }
#revenue .op18-t caption, #revenue .fn18-t caption { padding-bottom: .4rem; font-weight: 800; text-align: left; }
#revenue .op18-t th, #revenue .op18-t td, #revenue .fn18-t th, #revenue .fn18-t td { padding: .45rem .5rem .45rem 0; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
#revenue .op18-t thead th, #revenue .fn18-t thead th { color: var(--muted); font-size: .8rem; font-weight: 700; }
#revenue .op18-t tbody th, #revenue .op18-t tfoot th, #revenue .fn18-t tbody th, #revenue .fn18-t tfoot th { font-weight: 700; }
#revenue .op18-t tfoot th, #revenue .op18-t tfoot td, #revenue .fn18-t tfoot th, #revenue .fn18-t tfoot td { border-bottom: 0; font-weight: 800; }
#revenue .op18-t tfoot tr:first-child th, #revenue .op18-t tfoot tr:first-child td, #revenue .fn18-t tfoot tr:first-child th, #revenue .fn18-t tfoot tr:first-child td { border-top: 2px solid var(--ink); }
#revenue .op18-t .op18-num, #revenue .fn18-t .fn18-num { padding-right: .25rem; font-weight: 800; text-align: right; white-space: nowrap; }
#revenue .op18-record, #revenue .fn18-record { border: 2px solid var(--ink); border-radius: .35rem; background: #fff; }
#revenue .fn18-record { margin-top: .85rem; }
#revenue .op18-record-h, #revenue .fn18-record-h { padding: .4rem .6rem; background: var(--ink); color: #fff; font-size: .88rem; font-weight: 800; line-height: 1.2; }
#revenue .op18-record-r, #revenue .fn18-record-r { display: grid; gap: .05rem; padding: .4rem .6rem; border-top: 1px solid var(--line); font-size: .9rem; line-height: 1.25; }
#revenue .op18-record-r strong, #revenue .fn18-record-r strong { font-weight: 800; }
#revenue .op18-record-flag, #revenue .fn18-record-flag { background: #fff7ea; }
#revenue .op18-record-flag strong, #revenue .fn18-record-flag strong { color: var(--amber); }
#revenue .op18-conds { display: grid; gap: .45rem; margin: 0 0 .9rem; padding: 0; list-style: none; }
#revenue .op18-conds li { padding: .5rem .7rem; border: 2px solid var(--amber); border-radius: .35rem; background: #fff; font-size: .95rem; line-height: 1.35; }
#revenue .op18-chain, #revenue .fn18-chain { display: grid; gap: .9rem; margin: 0; padding: 0; list-style: none; }
#revenue .op18-chain li, #revenue .fn18-chain li { position: relative; min-width: 0; padding: .45rem .6rem; border-left: 4px solid var(--teal); border-radius: .2rem; background: #fff; font-size: .9rem; font-weight: 700; line-height: 1.25; }
#revenue .op18-chain li span, #revenue .fn18-chain li span { display: block; color: var(--muted); font-size: .74rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
#revenue .op18-chain li + li::before, #revenue .fn18-chain li + li::before { content: "\2193"; position: absolute; top: -.95rem; left: .7rem; color: var(--ink); font-size: .85rem; font-weight: 800; line-height: 1; }
#revenue .op18-chain .op18-chain-end, #revenue .fn18-chain .fn18-chain-end { border-left-color: var(--ink); background: var(--ink); color: #fff; }
#revenue .op18-chain .op18-chain-end span, #revenue .fn18-chain .fn18-chain-end span { color: #8fe0d2; }
#revenue .op18-fork { display: grid; gap: .55rem; }
#revenue .op18-fork-from { padding: .5rem .65rem; border-radius: .2rem; background: var(--ink); color: #fff; font-size: .9rem; line-height: 1.3; }
#revenue .op18-fork-from strong { display: block; font-size: 1.1rem; font-weight: 800; }
#revenue .op18-roads { display: grid; gap: .55rem; }
#revenue .op18-road { min-width: 0; padding: .55rem .65rem; border-radius: .2rem; background: #fff; font-size: .9rem; line-height: 1.3; }
#revenue .op18-road span { display: block; color: var(--muted); font-size: .74rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
#revenue .op18-road strong { display: block; margin: .1rem 0; font-size: .96rem; font-weight: 800; line-height: 1.25; }
#revenue .op18-road-a { box-shadow: inset 0 0 0 2px var(--teal); }
#revenue .op18-road-b { border: 2px dashed var(--amber); }
#revenue .op18-dl, #revenue .fn18-dl { display: grid; gap: .6rem; margin: 0 0 .8rem; }
#revenue .op18-dl dt, #revenue .fn18-dl dt { font-size: .92rem; font-weight: 800; line-height: 1.25; }
#revenue .op18-dl dd, #revenue .fn18-dl dd { margin: 0; font-size: .95rem; line-height: 1.4; }
#revenue .op18-more, #revenue .fn18-more { margin: .5rem 0; border-top: 1px solid var(--line); }
#revenue .op18-more summary, #revenue .fn18-more summary { display: list-item; min-height: 44px; padding: .65rem .25rem; color: var(--blue); font-weight: 700; line-height: 1.25; cursor: pointer; }
#revenue .op18-more summary:hover, #revenue .fn18-more summary:hover { text-decoration: underline; }
#revenue .op18-more-body, #revenue .fn18-more-body { padding: 0 .25rem .5rem; }
#revenue .op18-steps, #revenue .fn18-steps { margin: 0 0 .5rem; padding-left: 1.25rem; }
#revenue .op18-steps li, #revenue .fn18-steps li { margin-bottom: .35rem; }
#revenue .op18-content .op18-next, #revenue .fn18-content .fn18-next { margin: 1rem 0 0; }
#revenue .op18-next a, #revenue .fn18-next a { display: inline-flex; align-items: center; min-height: 44px; padding: .4rem .85rem; border: 2px solid var(--blue); border-radius: .35rem; color: var(--blue); font-weight: 700; line-height: 1.2; }
#revenue .op18-next a::after, #revenue .fn18-next a::after { content: " \203A"; margin-left: .35rem; }
#revenue .op18-next a:hover, #revenue .fn18-next a:hover { background: var(--blue); color: #fff; }

@media (min-width: 640px) {
  #revenue .op18-chain, #revenue .fn18-chain { grid-auto-columns: minmax(0, 1fr); grid-auto-flow: column; gap: 1.1rem; }
  #revenue .op18-chain li + li::before, #revenue .fn18-chain li + li::before { content: "\2192"; top: 50%; left: -1rem; transform: translateY(-50%); }
  #revenue .op18-roads, #revenue .fn18-twolens { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #revenue .op18-record-r, #revenue .fn18-record-r { grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: .75rem; }
  #revenue .op18-dl > div, #revenue .fn18-dl > div { display: grid; grid-template-columns: 11rem minmax(0, 1fr); gap: 1rem; }
  #revenue .fn18-tray .fn18-n { font-size: 1.35rem; }
}

@media (min-width: 900px) {
  #revenue .op18-band, #revenue .fn18-band { padding: .9rem 1rem 1rem; }
  #revenue .op18-arrow { width: calc(100% - 10px); height: 3px; margin: 0 10px 0 0; }
  #revenue .op18-arrow::after { top: -6px; right: -10px; bottom: auto; left: auto; border-top: 7.5px solid transparent; border-right: 0; border-bottom: 7.5px solid transparent; border-left: 10px solid var(--ink); }
  #revenue .op18-floor { display: grid; grid-template-columns: minmax(0, 1fr) 2.75rem minmax(0, 1.25fr) 2.75rem minmax(0, 1fr); align-items: center; gap: .5rem; }
  #revenue .op18-return { position: relative; margin-top: .25rem; padding-top: 1rem; padding-left: 15%; }
  #revenue .op18-return::before { content: ""; position: absolute; top: 0; left: 12%; width: 38%; height: 2.1rem; border: 2px dashed var(--amber); border-top: 0; }
  #revenue .op18-return .op18-gate { position: relative; }
  #revenue .op18-hours { grid-template-columns: minmax(0, .8fr) minmax(0, 1.7fr); gap: 2rem; align-items: start; }
  #revenue .op18-key { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem .75rem; }
  #revenue .op18-key-sum { grid-column: 1 / -1; }
  #revenue .op18-gates-l { flex: 0 1 auto; }
  #revenue .op18-outcome { display: grid; grid-template-columns: minmax(0, 1.15fr) 7.5rem minmax(0, 1fr) 7.5rem minmax(0, 1fr); align-items: center; gap: .6rem; }
  #revenue .op18-link-c { flex-direction: column; align-items: stretch; text-align: center; }
  #revenue .op18-link-c .op18-gate { justify-content: center; padding: .25rem .5rem; font-size: .84rem; }
  #revenue .op18-strip { grid-template-columns: 3rem minmax(0, 1fr); }

  #revenue .fn18-batch { grid-template-columns: 15rem minmax(0, 1fr); gap: 1.5rem; align-items: start; }
  #revenue .fn18-rsteps { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .9rem; }
  #revenue .fn18-rstep { position: relative; display: block; }
  #revenue .fn18-rstep .fn18-ric { margin-bottom: .35rem; }
  #revenue .fn18-rstep + .fn18-rstep::before { content: "\2192"; position: absolute; top: .4rem; left: -.85rem; color: var(--ink); font-size: 1rem; font-weight: 800; line-height: 1; }
  #revenue .fn18-key { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem .75rem; }
  #revenue .fn18-choice { grid-template-columns: repeat(2, minmax(0, 1fr)) minmax(0, 1.4fr); align-items: stretch; }
}
