/* rubiqos.com · proforma and entity pages: cards (subgrid-aligned sections), live blocks, status bar. Shared by /proforma/ and /entity/. */
body.site .pf { max-width: none; padding: 0 20px; }
body.site .cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; }
  /* every card is a subgrid of the cards grid: the same section sits on the same row across a row of cards (founder 2026-10-19) */
body.site .cards { grid-auto-rows: auto; }
body.site .con { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; display: grid; grid-template-rows: subgrid; grid-row: span 9; row-gap: 8px; align-content: start; }
body.site .con.svc { grid-row: span 7; }
body.site .con .sec { display: flex; flex-direction: column; gap: 4px; }
body.site .con .sec .cap { margin-top: 0; }
body.site .con .live { align-self: start; }
@supports not (grid-template-rows: subgrid) { body.site .con { display: flex; flex-direction: column; gap: 8px; } }
body.site .con.wide { display: grid; grid-template-columns: minmax(280px, 1fr) 2fr; grid-template-rows: none; column-gap: 24px; align-items: start; }
body.site .con.wide .col { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
body.site .con.wide table.t { font-size: 12.5px; }
@media (max-width: 800px) { body.site .con.wide { grid-template-columns: 1fr; } }
body.site .con .hd { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
body.site .con h3 { font: 600 17px var(--body); color: var(--navy); margin: 0; letter-spacing: -0.01em; }
body.site .con .zone { font: 500 11px var(--body); color: var(--muted); white-space: nowrap; }
body.site .con .zone i { display: inline-block; width: 9px; height: 9px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
body.site .con p { margin: 0; font-size: 12.5px; color: var(--text); }
body.site .con > p { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }   /* founder 2026-10-19: descriptions are two lines */
body.site .con .op { font: 500 11.5px var(--body); color: var(--navy); background: var(--panel); border-radius: 7px; padding: 3px 8px; align-self: flex-start; }
body.site .con .op b { color: var(--accent); font-weight: 600; margin-right: 6px; text-transform: uppercase; font-size: 10px; letter-spacing: 0.08em; }
body.site .con .cap { font: 600 10.5px var(--body); text-transform: uppercase; letter-spacing: 0.08em; color: var(--accent); margin-top: 4px; }
body.site .con .kv { grid-template-columns: 1fr auto; font-size: 12.5px; }
body.site .con .live { background: var(--panel); border-radius: 10px; padding: 8px 10px; }
body.site .con .live span:nth-child(2n) { font-size: 14px; }
body.site .con .live .cap { color: var(--muted); margin: 0 0 4px; }
body.site .con .live .cap i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--ok); margin-right: 6px; vertical-align: 0; }
body.site .off .con .live .cap i { background: #c7ccd4; }
body.site .con .bar { height: 7px; border-radius: 4px; background: rgba(10, 18, 32, 0.08); overflow: hidden; grid-column: 1 / -1; margin: -1px 0 3px; }
body.site .con .bar i { display: block; height: 100%; background: var(--accent); border-radius: 4px; }
body.site .con .bar i.over { background: var(--bad); }
body.site .con .rooms { display: grid; gap: 5px; margin-top: 4px; } body.site .con .rooms .rr { display: grid; grid-template-columns: minmax(0, 1fr) 72px 36px; gap: 10px; align-items: center; font-size: 12.5px; } body.site .con .rooms .rr span { color: var(--muted); } body.site .con .rooms .rr .bar { margin: 0; grid-column: auto; } body.site .con .rooms .rr b { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
body.site .bal .bar { height: 8px; border-radius: 4px; background: rgba(10, 18, 32, 0.08); overflow: hidden; }
body.site .bal .bar i { display: block; height: 100%; background: var(--accent); }
body.site .bal .bar i.over { background: var(--bad); }
body.site .bal td:nth-child(n+2) { font-variant-numeric: tabular-nums; }
body.site .bal .over-txt { color: var(--bad); font-weight: 600; }
body.site .status { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 12px 16px; margin: 18px 0 6px; }
body.site .status .big { font: 600 30px var(--body); color: var(--navy); letter-spacing: -0.02em; line-height: 1; }
body.site .status .k { font-size: 12px; color: var(--muted); }
body.site .status .k b { color: var(--navy); font-weight: 600; }
body.site .status .dot { width: 9px; height: 9px; border-radius: 50%; background: var(--ok); }
body.site .off .status .dot { background: #c7ccd4; }
body.site table.t td.num { font-variant-numeric: tabular-nums; text-align: right; }
body.site .log { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 8px 14px; max-height: 360px; overflow: auto; font-size: 12.5px; }
body.site .log > div { display: grid; grid-template-columns: 44px 1fr; gap: 8px; padding: 5px 0; border-bottom: 1px solid rgba(10, 18, 32, 0.06); }
body.site .log > div > span { color: var(--muted); font-variant-numeric: tabular-nums; }
body.site .log .d { color: var(--text); font-size: 12px; margin-top: 1px; }
#sim { position: fixed; width: 2px; height: 2px; left: -10px; top: -10px; opacity: 0; pointer-events: none; border: 0; }
body.site h3.grp { font: 600 11px var(--body); text-transform: uppercase; letter-spacing: 0.1em; color: var(--muted); margin: 18px 0 8px; }   /* category of a card group (founder 2026-10-19) */
body.site h3.grp:first-child { margin-top: 4px; }
body.site .con .zone i { margin-right: 0; width: 10px; height: 10px; }
/* --- the event programme as a schedule (founder 2026-10-19): venues as rows, the day as the x axis, bookings in every block */
body.site .sched { --svw: 150px; position: relative; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 10px 14px 12px; overflow: hidden; }
body.site .srow { display: grid; grid-template-columns: var(--svw) 1fr; align-items: stretch; min-height: 54px; border-top: 1px solid rgba(10, 18, 32, 0.06); }
body.site .srow.shead { min-height: 22px; border-top: 0; }
body.site .svenue { font: 600 12.5px var(--body); color: var(--navy); padding: 10px 10px 10px 0; } body.site .svenue a { color: var(--navy); text-decoration: none; }
body.site .slane { position: relative; background-image: repeating-linear-gradient(to right, rgba(10, 18, 32, 0.06) 0 1px, transparent 1px calc(100% / 9)); }
body.site .sticks { height: 22px; background: none; } body.site .sticks span { position: absolute; top: 2px; transform: translateX(-50%); font: 500 10px var(--body); color: var(--muted); }
body.site .sev { position: absolute; top: 6px; bottom: 6px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 5px 8px 4px; overflow: hidden; min-width: 0; }
body.site .sev b { display: block; font: 600 11.5px var(--body); color: var(--navy); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.site .sev small { display: block; font-size: 10.5px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.site .sev .sbar { display: block; height: 4px; border-radius: 2px; background: rgba(10, 18, 32, 0.1); margin-top: 4px; overflow: hidden; } body.site .sev .sbar u { display: block; height: 100%; background: var(--navy); }
body.site .sev[data-state="now"] { background: #e3ebfd; border-color: var(--accent); } body.site .sev[data-state="now"] .sbar u { background: var(--accent); }
body.site .sev[data-state="done"] { opacity: 0.55; }
body.site .snow { position: absolute; top: 10px; bottom: 12px; width: 2px; background: var(--accent); pointer-events: none; }
@media (max-width: 720px) { body.site .sched { --svw: 90px; } body.site .svenue { font-size: 11px; } }
/* label / value by span order, not by child order: a bar (div) between rows must not flip the parity */
body.site .con .kv span:nth-child(2n), body.site .con .kv span:nth-child(2n+1) { text-align: left; font-weight: 400; color: var(--text); font-size: 12.5px; }
body.site .con .kv span:nth-of-type(2n) { text-align: right; font-weight: 600; color: var(--navy); font-variant-numeric: tabular-nums; }
body.site .con .live .kv span:nth-of-type(2n) { font-size: 14px; }
body.site .con.wide .live { width: 100%; }
body.site .con.wide .col .kv span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.site table.t td.bar-td { vertical-align: middle; } body.site table.t td.bar-td .bar { height: 7px; border-radius: 4px; background: rgba(10, 18, 32, 0.08); overflow: hidden; margin: 0; } body.site table.t td.bar-td .bar i { display: block; height: 100%; background: var(--navy); border-radius: 4px; }
body.site .con.wide.three { grid-template-columns: minmax(280px, 1.1fr) minmax(240px, 1fr) minmax(220px, 0.9fr); }
/* the marina block: five columns on the same grid as the standard cards (founder 2026-10-19) */
body.site .con.wide.cols { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); column-gap: 14px; row-gap: 18px; }
body.site .con.wide.cols .col .sec.team + .sec.team { margin-top: 6px; }
body.site .con.wide.cols .col.span2 { grid-column: span 2; } @media (max-width: 660px) { body.site .con.wide.cols .col.span2 { grid-column: auto; } }
body.site table.t.mini { font-size: 12px; border-radius: 10px; } body.site table.t.mini th { padding: 7px 10px; } body.site table.t.mini td { padding: 6px 10px; }
@media (max-width: 1000px) { body.site .con.wide.three { grid-template-columns: 1fr 1fr; } } @media (max-width: 800px) { body.site .con.wide.three { grid-template-columns: 1fr; } }

body.site .con .kv .sub { color: var(--accent); font: 600 10.5px var(--body); text-transform: uppercase; letter-spacing: 0.06em; margin-top: 4px; }

body.site .con .nomodel { width: 9px; height: 9px; border-radius: 50%; background: var(--bad, #c0504d); flex: none; align-self: flex-start; margin-top: 6px; }

/* 30-day occupancy strip: 30 plain bars; actual navy, today accent, forecast light (founder 2026-10-19: no outlines, no axis) */
body.site .con .f30 { display: grid; grid-template-columns: repeat(30, 1fr); gap: 2px; height: 44px; align-items: end; }
body.site .con .f30 i { display: block; background: rgba(36, 87, 230, 0.26); min-height: 2px; }
body.site .con .f30 i.we { background: rgba(36, 87, 230, 0.4); }
body.site .con .f30 i.past { background: var(--navy); } body.site .con .f30 i.past.we { background: var(--navy); }
body.site .con .f30 i.today { background: var(--accent); }
/* Standard / Detailed view (founder 2026-10-20): Standard hides what a card consumes and returns a day; the switch sits in the status bar */
body.site.view-std .con .detail { display: none; }
body.site.view-std .con:not(.svc):not(.wide) { grid-row: span 6; }   /* chart, consumes, returns hidden: 5 visible blocks */
body.site .viewsw { margin-left: auto; display: inline-flex; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; }
body.site .viewsw button { font: 500 12.5px var(--body); color: var(--navy); background: #fff; border: 0; padding: 7px 12px; cursor: pointer; }
body.site .viewsw button + button { border-left: 1px solid var(--line); }
body.site .viewsw button.on { background: var(--navy); color: #fff; }
/* workforce: people amber, robots teal */
body.site .con .kv .sub.pp { color: #b2641a; } body.site .con .kv .pp { color: #b2641a; }   /* people amber, robots teal (founder 2026-10-19) */
body.site .con .kv .sub.rb { color: #0f8a7a; } body.site .con .kv .rb { color: #0f8a7a; }

/* yacht services log: arrivals green down-arrow, departures red up-arrow (founder 2026-10-20) */
body.site table.t.ys td { padding: 4px 8px; } body.site .ys-in { color: #1f9e4a; } body.site .ys-out { color: #d43d32; } body.site .ys-svc { color: var(--muted); }

/* operations list on a card (founder 2026-10-21: replaces Workforce) */
body.site .con .sec.ops ol { margin: 2px 0 0; padding-left: 20px; font-size: 13px; line-height: 1.45; }
body.site .con .sec.ops li::marker { color: var(--muted); }
/* R / A / H mark per operation (founder 2026-10-21): robot teal, fixed automation slate blue, human amber */
body.site .con .sec.ops .mk { display: inline-block; min-width: 74px; margin-right: 6px; padding: 0 5px; border-radius: 3px; font-size: 10.5px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; color: #fff; text-align: center; }
body.site .con .sec.ops .mk.R { background: #0f8a7a; }
body.site .con .sec.ops .mk.A { background: #4a6a93; }
body.site .con .sec.ops .mk.H { background: #b2641a; }
body.site .con .sec.ops .mk-sum { margin-left: 8px; }
body.site .con .sec.ops .mk-sum .mk { min-width: 0; margin-right: 3px; }