/* Approved homepage CRM showcase: stationary window and wheel-operated tabs. */
.live-track{position:relative;container-type:inline-size}
.live-board{position:relative;display:grid;grid-template-columns:minmax(0,1fr);align-items:center;min-height:420px;padding-block:12px}
.live-tabs,.live-window{grid-area:1/1}
.live-window{position:relative;width:82%;justify-self:end;padding:6px;border:1px solid var(--line);border-radius:6px;background:var(--card);box-shadow:8px 10px 0 var(--shadow)}
.live-tabs{width:27%;z-index:2;display:grid;gap:14px;align-content:center;padding-block:12px}
.live-tabs button{position:relative;text-align:left;border:1px solid var(--line);border-radius:5px;padding:20px 24px;background:var(--card);color:var(--ink);box-shadow:5px 6px 0 var(--shadow);cursor:pointer;transform:rotate(-1deg);transition:transform .22s,background .22s,color .22s}
.live-tabs button:nth-child(even){transform:rotate(1deg)}
.live-tabs button>span{font-size:18px;font-weight:500;display:block;line-height:1.3}
.live-tabs small{display:none;font-size:14px;line-height:1.55;margin-top:12px}
.live-tabs button[aria-selected=true]{background:var(--action);border-color:var(--action);color:var(--action-ink);transform:translateX(12px) rotate(-1.3deg)}
.live-tabs button[aria-selected=true] small{display:block}
.live-tabs button:hover{transform:translateX(6px) rotate(0)}
.live-tabs button[aria-selected=true]:hover{transform:translateX(12px) rotate(0)}
.live-panel:not([hidden]){animation:live-reveal .28s ease-out}
@keyframes live-reveal{from{opacity:.5;transform:translateX(10px)}to{opacity:1;transform:translateX(0)}}
.live-expand{position:absolute;right:16px;top:16px;width:44px;height:44px;padding:10px;display:grid;place-items:center;border:1px solid #ffffff60;border-radius:9px;background:#192c49;color:#fff;cursor:zoom-in;box-shadow:0 3px 12px #0003}
.live-expand svg{width:22px;height:22px}.live-expand:hover{background:#2458a6}
@media(min-width:751px) and (max-width:1000px){.live-tabs button{padding:16px}.live-tabs button>span{font-size:16px}.live-tabs small{font-size:12px}.live-tabs{gap:10px}}
@media(max-width:750px){.live-board{position:relative;top:auto;display:flex;flex-direction:column;min-height:0;padding:0}.live-tabs{width:100%;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;padding:0 0 82px;position:relative;align-content:normal}.live-tabs button,.live-tabs button:nth-child(even){position:static;padding:12px 5px;transform:none;box-shadow:none;text-align:center;min-height:60px}.live-tabs button>span{font-size:12px}.live-tabs button[aria-selected=true],.live-tabs button:hover,.live-tabs button[aria-selected=true]:hover{transform:none}.live-tabs small{position:absolute;left:0;right:0;top:70px;margin:0;color:var(--ink);text-align:left;font-size:14px;line-height:1.5;padding:0 4px}.live-window{width:100%;box-shadow:5px 6px 0 var(--shadow)}.live-expand{top:12px;right:12px}}
@media(prefers-reduced-motion:reduce){.live-board{position:relative;top:auto}.live-panel:not([hidden]){animation:none}.live-tabs button{transition:none}}

.live-panel[hidden]{display:none}
.live-panel .scene-image{display:block;width:100%;aspect-ratio:5/3;border:0;padding:0;overflow:hidden;border-radius:3px;background:#fff;cursor:zoom-in}
.live-panel .scene-image img{display:block;width:100%;height:auto}