/* Control view lives on the tracked office computer, with the same event
   image and brand seen in the venue. It illustrates modules without figures. */
#opsScreen .ops-command{display:grid;grid-template-columns:53% 47%;height:224px;margin-top:14px;overflow:hidden;background:#1a1921;color:#fff}
#opsScreen .ops-command-show{position:relative;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;padding:19px 22px;background:linear-gradient(90deg,#17121fe8,#17121f42),url('/assets/boxoffice/img/ui/ops-hero-show.webp') center/cover}
#opsScreen .ops-command-show::after{content:"";position:absolute;inset:auto 0 0;height:7px;background:linear-gradient(90deg,#e63e85 0 34%,#25bed7 34% 67%,#d7ff3a 67%)}
#opsScreen .ops-command-live{position:relative;z-index:1;width:max-content;padding:6px 9px;background:#d7ff3a;color:#171719;font-size:9px;font-weight:800;letter-spacing:.05em}
#opsScreen .ops-command-show>strong{position:relative;z-index:1;font-size:45px;line-height:.84;letter-spacing:-.075em;max-width:290px;text-shadow:0 2px 14px #000a}
#opsScreen .ops-command-wave{position:relative;z-index:1;height:20px;display:flex;gap:4px;align-items:end}
#opsScreen .ops-command-wave i{width:5px;height:35%;background:#d7ff3a;opacity:.88}
#opsScreen .ops-command-wave i:nth-child(3n){height:85%;background:#f47ab2}
#opsScreen .ops-command-wave i:nth-child(4n){height:55%;background:#73d4df}
#opsScreen .ops-command-wave i:nth-child(5n){height:100%}
#opsScreen .ops-command-modules{display:grid;grid-template-rows:1fr 1fr}
#opsScreen .ops-command-modules>div{display:flex;flex-direction:column;justify-content:space-between;padding:17px 22px}
#opsScreen .ops-command-sales{background:#e63e85;color:#fff}
#opsScreen .ops-command-entries{background:#e9e8e4;color:#201b25}
#opsScreen .ops-command-modules small{font-size:9px;font-weight:800;letter-spacing:.07em}
#opsScreen .ops-command-modules strong{font-size:23px;line-height:1;letter-spacing:-.045em}
#opsScreen .ops-command-modules span{font-size:10px;font-weight:700;letter-spacing:-.01em}
#opsScreen .ops-foot{margin-top:16px}

/* ---------- V15d (2026-09-27): three moments on the same office monitor ----------
   1 event summary (base view) · 2 CRM customer profile · 3 AI campaign. The CRM and AI panels
   rise over the base view with clip-path wipes (timing-v15.js drawOps). No figures anywhere. */
#opsScreen .ops-ui-main{padding:26px 35px 20px}
#opsScreen .ops-workspace-title{align-items:center;margin:0 0 16px}
#opsScreen .ops-workspace-title h2{margin:0;font-size:38px}
#opsScreen .ops-report-btn{padding:10px 14px;background:#171719;color:#fff;font-size:13px;font-weight:700;letter-spacing:-.01em;align-self:center}
#opsScreen .ops-command{margin-top:0;height:222px}
#opsScreen .ops-command-modules strong{font-size:24px}
#opsScreen .ops-spark{display:flex;align-items:end;gap:4px;height:34px}
#opsScreen .ops-spark i{flex:1;background:#fff;opacity:.9;height:30%;transform-origin:50% 100%}
#opsScreen .ops-spark i:nth-child(3n){height:62%}#opsScreen .ops-spark i:nth-child(4n){height:84%}#opsScreen .ops-spark i:nth-child(5n+2){height:48%}#opsScreen .ops-spark i:last-child{height:100%;background:#d7ff3a}
#opsScreen .ops-meter{height:10px;background:#d3d1d6}
#opsScreen .ops-meter i{display:block;height:100%;width:var(--ops-meter,68%);background:#201b25}
#opsScreen .ops-summary-row{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:16px;padding-top:14px;border-top:1px solid #d8d6d9}
#opsScreen .ops-summary-row>div{display:flex;flex-direction:column;gap:9px}
#opsScreen .ops-summary-row small{font-size:17px;font-weight:700;letter-spacing:-.02em;color:#171719}
#opsScreen .ops-summary-row span{font-size:12px;font-weight:600;color:#6f6c74}
#opsScreen .ops-split{display:flex;height:12px;gap:3px}
#opsScreen .ops-split i{display:block;flex:46}#opsScreen .ops-split i:nth-child(1){background:#e63e85}#opsScreen .ops-split i:nth-child(2){flex:31;background:#25bed7}#opsScreen .ops-split i:nth-child(3){flex:23;background:#b9e02a}
#opsScreen .ops-split-fb i:nth-child(1){flex:38;background:#171719}#opsScreen .ops-split-fb i:nth-child(2){flex:34;background:#8f8a94}#opsScreen .ops-split-fb i:nth-child(3){flex:28;background:#e63e85}
#opsScreen .ops-foot{margin-top:14px}
/* Panels 2 and 3 cover the whole working area (under the dark app header). */
#opsScreen .ops-crm-v15,#opsScreen .ops-ai-panel{display:block;padding:26px 35px 20px;opacity:0;background:#f4f3ee;color:#171719}
#opsScreen .ops-ai-panel{z-index:7}
#opsScreen .crm-person{display:grid;grid-template-columns:62px 1fr 300px;gap:18px;align-items:center;padding:0 0 18px;border-bottom:1px solid #d8d6d9}
#opsScreen .crm-person>b{width:62px;height:62px;display:grid;place-items:center;background:#26172e;color:#fff;font-size:28px}
#opsScreen .crm-person>div{display:flex;flex-direction:column;gap:6px}
#opsScreen .crm-person strong{font-size:30px;letter-spacing:-.04em;line-height:1}
#opsScreen .crm-person>div>span{font-size:14px;font-weight:600;color:#6f6c74}
#opsScreen .crm-intent{padding:14px 16px;background:#d7ff3a}
#opsScreen .crm-intent small{display:block;font-size:13px;font-weight:700}
#opsScreen .crm-intent strong{display:block;font-size:26px;margin:5px 0 8px}
#opsScreen .crm-intent i{display:block;height:8px;background:#17171926}
#opsScreen .crm-intent u{display:block;height:100%;width:82%;background:#171719}
#opsScreen .crm-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;padding-top:18px}
#opsScreen .crm-grid small{display:block;font-size:17px;font-weight:700;letter-spacing:-.02em;margin:0 0 10px}
#opsScreen .crm-grid p{display:flex;flex-direction:column;gap:3px;margin:0;padding:10px 0;border-top:1px solid #dedce0}
#opsScreen .crm-grid b{font-size:16px;font-weight:600;letter-spacing:-.02em}
#opsScreen .crm-grid p span{font-size:12px;color:#77727c}
#opsScreen .ai-grid{display:grid;grid-template-columns:1fr 1.08fr;gap:28px}
#opsScreen .ai-form{display:flex;flex-direction:column;gap:12px}
#opsScreen .ai-field{display:flex;flex-direction:column;gap:6px;padding:12px 14px;background:#fff;border:1px solid #d8d6d9}
#opsScreen .ai-field small,#opsScreen .ai-preview>small{font-size:12px;font-weight:700;color:#6f6c74}
#opsScreen .ai-field strong{font-size:18px;letter-spacing:-.02em}
#opsScreen .ai-generate{display:block;padding:15px 16px;background:#171719;color:#d7ff3a;font-size:16px;font-weight:700;transform:scale(calc(1 - .03*var(--ai-press,0)))}
#opsScreen .ai-preview{display:flex;flex-direction:column;gap:8px}
#opsScreen .ai-card{display:grid;grid-template-columns:120px 1fr;background:#fff;border:1px solid #d8d6d9;min-height:190px}
#opsScreen .ai-card>i{background:linear-gradient(0deg,#17121f99,transparent),url('/assets/boxoffice/img/ui/ops-hero-show.webp') 30% center/cover}
#opsScreen .ai-card>div{padding:16px;display:flex;flex-direction:column;gap:9px;clip-path:inset(0 0 calc(100% * (1 - var(--ai-draft,1))) 0)}
#opsScreen .ai-card strong{font-size:22px;letter-spacing:-.04em;line-height:1}
#opsScreen .ai-card p{margin:0;font-size:14px;line-height:1.35;color:#4c4852}
#opsScreen .ai-cta{align-self:flex-start;margin-top:auto;padding:8px 11px;background:#e63e85;color:#fff;font-size:12px;font-weight:700}
#opsScreen .ai-edit{align-self:flex-start;font-size:14px;font-weight:700;color:#171719;border-bottom:2px solid #e63e85;padding-bottom:2px;opacity:var(--ai-draft,1)}

/* Mobile flat surface: under the headline (split), same three states. */
.ops-mobile-surface .ops-spark{display:flex;align-items:end;gap:3px;height:22px}
.ops-mobile-surface .ops-spark i{flex:1;background:#e63e85;height:35%}
.ops-mobile-surface .ops-spark i:nth-child(3n){height:65%}.ops-mobile-surface .ops-spark i:nth-child(4n){height:88%}.ops-mobile-surface .ops-spark i:last-child{height:100%;background:#171719}
.ops-mobile-surface .ops-meter{height:8px;background:#d3d1d6}.ops-mobile-surface .ops-meter i{display:block;height:100%;width:68%;background:#171719}
@media(max-width:700px){
  #operar .ops-mobile-surface.is-split{inset:var(--ops-flat-top,300px) 12px 12px}
  #operar .ops-mobile-surface.is-split header{margin-top:0;height:52px;padding:0 16px}
  #operar .ops-mobile-surface.is-split>div{top:52px;bottom:26px;padding:14px 16px}
  #operar .ops-mobile-surface.is-split footer{height:26px;padding:6px 16px}
  #operar .ops-mobile-surface.is-split>.ops-mobile-activity{display:block}
  #operar .ops-mobile-surface h3{font-size:clamp(26px,7.4vw,34px);margin:0 0 10px}
  #operar .ops-mobile-surface .ops-mobile-row{grid-template-columns:118px 1fr;padding:9px 0;font-size:14px;gap:10px}
  #operar .ops-mobile-surface .ops-mobile-row span{font-size:12px}
  #operar .ops-mobile-surface .ops-mobile-btn{display:inline-block;margin-top:10px;padding:9px 12px;background:#171719;color:#fff;font-size:13px;font-weight:700}
  #operar .ops-mobile-surface .ai-generate{color:#d7ff3a;margin:8px 0 6px}
  #operar .ops-mobile-person{margin:0 0 8px}
  #operar .ops-mobile-person b{width:40px;height:40px;background:#26172e;color:#fff;font-size:18px}
  #operar .ops-mobile-person>div{display:flex;flex-direction:column;gap:2px}
  #operar .ops-mobile-person small{font-size:12px;font-weight:600;color:#6f6c74}
  #operar .ops-mobile-customer .ops-mobile-row{grid-template-columns:118px 1fr;gap:10px;padding:8px 0}
  #operar .ops-mobile-preview{display:flex;flex-direction:column;gap:5px;margin-top:4px;padding:10px 12px;background:#fff;border:1px solid #d8d6d9}
  #operar .ops-mobile-preview small{font-size:11px;font-weight:700;color:#6f6c74}
  #operar .ops-mobile-preview strong{font-size:18px;letter-spacing:-.04em;line-height:1.05}
  #operar .ops-mobile-preview p{margin:0;font-size:13px;line-height:1.3;color:#4c4852}
  #operar .ops-mobile-preview>span{align-self:flex-start;font-size:12px;font-weight:700;border-bottom:2px solid #e63e85}
  #operar .ops-mobile-customer,#operar .ops-mobile-ai{transform:none}
}
/* V15d sizing: the monitor is read at ~0.8 scale during the hold, so type stays large. */
#opsScreen .ops-report-btn{font-size:16px;padding:11px 16px}
#opsScreen .ai-field{padding:14px 16px}
#opsScreen .ai-field small,#opsScreen .ai-preview>small{font-size:14px}
#opsScreen .ai-field strong{font-size:22px}
#opsScreen .ai-generate{font-size:19px;padding:17px 18px}
#opsScreen .ai-card{min-height:268px;grid-template-columns:130px 1fr}
#opsScreen .ai-card strong{font-size:27px}
#opsScreen .ai-card p{font-size:17px}
#opsScreen .ai-cta{font-size:14px;padding:10px 13px}
#opsScreen .ai-edit{font-size:16px}
#opsScreen .crm-grid b{font-size:18px}
#opsScreen .crm-grid p span{font-size:13px}
#opsScreen .ops-workspace-title>.ops-report-btn{align-self:center;padding:12px 18px;color:#fff;font-size:17px;letter-spacing:-.01em}