/* EVA Scoreboard — Light cream theme */
*{margin:0;padding:0;box-sizing:border-box}
html,body{background:#FBF6EA;color:#2B2419;font-family:'Montserrat',sans-serif;overflow:hidden;height:100vh;width:100vw;perspective:1600px;perspective-origin:50% 50%}
body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 30% 20%,rgba(196,162,101,.12),transparent 55%),radial-gradient(ellipse at 70% 80%,rgba(155,124,80,.08),transparent 55%);z-index:0}

.slide{position:absolute;top:0;left:0;width:100vw;height:100vh;padding:3vh 3.5vw 5vh;opacity:0;transform:translateZ(-180px) rotateY(-12deg) scale(.97);transform-origin:50% 50%;transition:opacity 1s cubic-bezier(.16,1,.3,1),transform 1s cubic-bezier(.16,1,.3,1);pointer-events:none;display:flex;flex-direction:column;will-change:opacity,transform;transform-style:preserve-3d;backface-visibility:hidden;z-index:1}
.slide.active{opacity:1;transform:translateZ(0) rotateY(0) scale(1);pointer-events:auto;z-index:2}
.slide.prev{transform:translateZ(-180px) rotateY(12deg) scale(.97)}

.hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:1vh;flex-shrink:0}
.eva-svg{height:5.5vh;width:auto;display:inline-block;object-fit:contain;filter:invert(1) brightness(0)}
.pills{display:flex;gap:.7vw}
.pill{border:1px solid rgba(43,36,25,.18);border-radius:.4vh;padding:.5vh 1vw;display:flex;align-items:center;gap:.4vw;background:rgba(255,255,255,.55)}
.pill-l{font-size:.55vw;font-weight:600;color:rgba(43,36,25,.55);text-transform:uppercase;letter-spacing:.06vw}
.pill-v{font-size:1.05vw;font-weight:700;color:#2B2419}
.gold-bar{height:2px;background:linear-gradient(90deg,#9C7F3F 0%,#C4A265 40%,rgba(196,162,101,0) 100%);margin-bottom:2vh;flex-shrink:0}

.stitle{font-size:1.6vw;font-weight:300;letter-spacing:.1vw;margin-bottom:2vh;color:rgba(43,36,25,.7)}
.stitle b{font-weight:700;color:#9C7F3F}

.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.5vw;margin-bottom:2vh;flex-shrink:0;transform-style:preserve-3d}
.gc{background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.6vh;padding:2.5vh 1.8vw;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(67,53,32,.08),0 2px 6px rgba(67,53,32,.04);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;transform-style:preserve-3d}
.gc:hover{transform:translateZ(20px) rotateX(2deg);box-shadow:0 16px 40px rgba(67,53,32,.14),0 4px 12px rgba(67,53,32,.06)}
.gc::before{content:"";position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(180deg,#C4A265,rgba(196,162,101,0))}
.gc-n{font-size:.65vw;font-weight:700;color:rgba(43,36,25,.55);text-transform:uppercase;letter-spacing:.15vw;margin-bottom:1vh}
.gc-a{font-size:3.8vw;font-weight:800;line-height:1;margin-bottom:.3vh;color:#2B2419;font-variant-numeric:tabular-nums}
.gc-t{font-size:.72vw;color:rgba(43,36,25,.55);margin-bottom:1vh}
.gc-t b{color:#2B2419;font-weight:700}
.gc-v{font-size:.85vw;font-weight:700;color:#C0392B;margin-bottom:1.2vh}
.gc-v.ok{color:#218B47}
.gc-bar{height:.5vh;background:rgba(43,36,25,.08);border-radius:1vh;overflow:hidden}
.gc-fill{height:100%;border-radius:1vh;transition:width 1.2s cubic-bezier(.2,.7,.2,1)}
.gc-p{font-size:.6vw;color:rgba(43,36,25,.55);margin-top:.3vh;text-align:right;font-weight:700}

.tw{background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.8vh;padding:1.8vh 2vw;flex:0 0 auto;max-width:min(1300px,95vw);width:100%;margin:0 auto;display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(67,53,32,.08),0 2px 6px rgba(67,53,32,.04)}

/* Team bar chart (RM / 2D / 3D) */
.bchart-card{background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.8vh;padding:2vh 2vw 1.5vh;flex:0 0 auto;max-width:min(1300px,95vw);width:100%;margin:0 auto 1.5vh;display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(67,53,32,.08),0 2px 6px rgba(67,53,32,.04)}
.bchart-card.team-chart{padding:3vh 2vw 5vh;margin-bottom:0}
.bchart-card.team-chart .bchart{height:52vh}
.bchart-card-t{font-size:.65vw;font-weight:700;color:rgba(43,36,25,.55);text-transform:uppercase;letter-spacing:.1vw;margin-bottom:1.5vh}
.bchart{position:relative;height:34vh;display:flex;padding-left:3.5vw}
.bchart-empty{color:rgba(43,36,25,.4);font-size:1vw;text-align:center;padding:8vh 0}
.bchart-y-axis{position:absolute;left:0;top:0;bottom:0;width:3.5vw}
.bchart-y-axis span{position:absolute;left:0;right:.5vw;text-align:right;font-size:.55vw;font-weight:600;color:rgba(43,36,25,.4);transform:translateY(50%);font-variant-numeric:tabular-nums}
.bchart-y-axis span:last-child{transform:translateY(0)}
.bchart-plot{flex:1;position:relative;border-left:1px solid rgba(43,36,25,.18);border-bottom:1px solid rgba(43,36,25,.18)}
.bchart-plot::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:repeating-linear-gradient(to right,rgba(43,36,25,.08) 0,rgba(43,36,25,.08) 3px,transparent 3px,transparent 7px)}
.bchart-plot::after{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:repeating-linear-gradient(to right,rgba(43,36,25,.08) 0,rgba(43,36,25,.08) 3px,transparent 3px,transparent 7px)}

.bchart-target-line{position:absolute;left:0;right:0;height:0;border-top:2px dashed #9C7F3F;z-index:2;pointer-events:none}
.bchart-target-label{position:absolute;right:0;top:-1.5vh;background:#9C7F3F;color:#FFFFFF;font-size:.6vw;font-weight:800;padding:.3vh .7vw;border-radius:.3vh;letter-spacing:.08vw;white-space:nowrap;box-shadow:0 2px 6px rgba(155,124,63,.3)}

.bchart-bars{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-around;padding:0 .5vw}
.bchart-bar-group{flex:1;height:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;position:relative;max-width:8vw;min-width:0}
.bchart-bar{width:60%;max-width:4vw;border-radius:.4vh .4vh 0 0;position:relative;transition:height 1s cubic-bezier(.2,.7,.2,1);box-shadow:0 -2px 8px rgba(0,0,0,.04),inset 0 1px 0 rgba(255,255,255,.3)}
.bchart-bar.on{background:linear-gradient(180deg,#27B05A,#218B47)}
.bchart-bar.mid{background:linear-gradient(180deg,#E5A234,#D97706)}
.bchart-bar.off{background:linear-gradient(180deg,#E04C3A,#C0392B)}
.bchart-bar.na{background:rgba(43,36,25,.15);box-shadow:none}
/* Capped (overflow) bars: jagged top edge so it's obvious the bar is clipped */
.bchart-bar.capped{border-top-left-radius:0;border-top-right-radius:0;border-top:3px solid #2B2419;background-image:linear-gradient(180deg,#27B05A,#218B47),repeating-linear-gradient(135deg,rgba(255,255,255,.18) 0,rgba(255,255,255,.18) 4px,transparent 4px,transparent 8px);background-blend-mode:overlay}
.bchart-bar.capped.mid{background:linear-gradient(180deg,#E5A234,#D97706)}
.bchart-bar.capped.off{background:linear-gradient(180deg,#E04C3A,#C0392B)}
.bchart-bar.capped::before{content:"";position:absolute;left:0;right:0;top:-7px;height:7px;background:linear-gradient(135deg,transparent 50%,#FBF6EA 50%) 0 0/7px 7px repeat-x;pointer-events:none}
.bchart-overflow{color:#218B47;font-weight:900;margin-left:.15vw;font-size:.8vw;vertical-align:middle}

.bchart-val{position:absolute;bottom:calc(var(--bh,0%) + .8vh);left:50%;transform:translateX(-50%);font-size:.85vw;font-weight:800;color:#2B2419;font-variant-numeric:tabular-nums;white-space:nowrap;z-index:3}
.bchart-name{position:absolute;top:calc(100% + .5vh);left:50%;transform:translateX(-50%);font-size:.7vw;font-weight:700;color:rgba(43,36,25,.75);text-transform:uppercase;letter-spacing:.05vw;white-space:nowrap}
.bchart-pct{position:absolute;top:calc(100% + 2vh);left:50%;transform:translateX(-50%);font-size:.65vw;font-weight:700;white-space:nowrap}
.bchart-pct.on{color:#218B47}
.bchart-pct.mid{color:#D97706}
.bchart-pct.off{color:#C0392B}
.bchart-pct.na{color:rgba(43,36,25,.35)}

.slide.active .bchart-bar{animation:bcGrow 1s cubic-bezier(.2,.7,.2,1) both}
@keyframes bcGrow{from{height:0!important}}
.slide.active .bchart-target-line{animation:fadeUp .8s ease both;animation-delay:.3s}
.slide.active .bchart-val{animation:fadeUp .6s ease both;animation-delay:.5s}
.tw-t{font-size:.65vw;font-weight:700;color:rgba(43,36,25,.55);text-transform:uppercase;letter-spacing:.1vw;margin-bottom:1.2vh}
table.t{width:100%;border-collapse:collapse}
table.t th{font-size:.55vw;font-weight:700;color:rgba(43,36,25,.5);text-transform:uppercase;letter-spacing:.06vw;padding:.8vh .5vw;text-align:right;border-bottom:1px solid rgba(43,36,25,.1);background:rgba(240,232,212,.4)}
table.t th:first-child{text-align:left}
table.t td{font-size:1.05vw;font-weight:500;padding:1vh .5vw;text-align:right;border-bottom:1px solid rgba(43,36,25,.06);font-variant-numeric:tabular-nums;color:#2B2419}
table.t td:first-child{text-align:left;font-weight:600;color:#2B2419}
table.t tr.tot td{font-weight:800;border-top:2px solid rgba(43,36,25,.2);border-bottom:none;padding-top:1.2vh;color:#2B2419;font-size:1.1vw;background:rgba(240,232,212,.4)}
.cg{color:#9C7F3F}.cr{color:#C0392B}.cm{color:rgba(43,36,25,.3)}.cok{color:#218B47}

.dh{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:2.5vh;flex-shrink:0}
.dh-l{font-size:.65vw;font-weight:700;color:#9C7F3F;text-transform:uppercase;letter-spacing:.2vw;margin-bottom:.5vh}
.dh-a{font-size:5.5vw;font-weight:800;line-height:1;color:#2B2419;font-variant-numeric:tabular-nums}
.dh-t{font-size:.95vw;color:rgba(43,36,25,.6);margin-top:.4vh}
.dh-t b{color:#2B2419;font-weight:700}
.dh-vb{font-size:2.8vw;font-weight:800;color:#C0392B;line-height:1;font-variant-numeric:tabular-nums}
.dh-vb.ok,.dh-vb.on{color:#218B47}
.dh-vb.mid{color:#D97706}
.dh-vb.off{color:#C0392B}
.dh-vb.na{color:rgba(43,36,25,.35)}
.dh-vl{font-size:.55vw;color:rgba(43,36,25,.55);text-transform:uppercase;letter-spacing:.08vw;margin-top:.3vh;font-weight:700}
.dh-r{text-align:right}

.cs{flex:1;background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.6vh;padding:2vh 2.5vw;display:flex;flex-direction:column;min-height:0;box-shadow:0 8px 24px rgba(67,53,32,.06)}
.cs-t{font-size:.65vw;font-weight:700;color:rgba(43,36,25,.55);text-transform:uppercase;letter-spacing:.1vw;margin-bottom:1vh}
.cs-leg{display:flex;gap:1.5vw;margin-bottom:1.2vh}
.lg{display:flex;align-items:center;gap:.3vw;font-size:.6vw;color:rgba(43,36,25,.6);font-weight:600}
.ld{width:.65vw;height:.65vw;border-radius:.1vw}
.la{background:#C4A265}.lt{background:rgba(43,36,25,.18)}

.chart{flex:1;display:flex;align-items:flex-end;justify-content:center;gap:5vw;padding:3vh 0 3vh;position:relative;min-height:0}
.chart::after{content:"";position:absolute;bottom:2.5vh;left:1vw;right:1vw;height:1px;background:rgba(43,36,25,.12)}

.bg{display:flex;flex-direction:column;align-items:center;gap:.3vh;transform-style:preserve-3d}
.bp{display:flex;align-items:flex-end;gap:.45vw;height:36vh;transform-style:preserve-3d}
.b{width:3.8vw;border-radius:.3vh .3vh 0 0;position:relative;min-height:1px;transition:height 1s cubic-bezier(.2,.7,.2,1),transform .4s ease;transform-style:preserve-3d}
.bg:hover .b{transform:translateZ(8px)}
.b::after{content:"";position:absolute;right:-.18vw;top:0;width:.18vw;height:100%;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,.08));transform-origin:left;transform:skewY(-45deg);border-radius:0 .15vh 0 0;opacity:.65}
.ba{background:linear-gradient(180deg,#D4B87A,#9C7F3F);box-shadow:0 4px 12px rgba(155,124,63,.25),inset 0 1px 0 rgba(255,255,255,.4)}
.ba::after{background:linear-gradient(180deg,#7A6230,#5C4824)}
.bt{background:rgba(43,36,25,.18);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.bv{position:absolute;top:-2.7vh;left:50%;transform:translateX(-50%);font-size:.9vw;font-weight:700;white-space:nowrap;color:#2B2419;font-variant-numeric:tabular-nums}
.bvt{color:rgba(43,36,25,.5);font-weight:600}
.bg-l{font-size:.72vw;font-weight:700;color:rgba(43,36,25,.7);text-align:center;margin-top:.4vh}
.bg-p{font-size:.65vw;font-weight:700}
.tsep{margin-left:3vw;padding-left:3vw;border-left:1px solid rgba(43,36,25,.18)}

/* ----- Waterfall chart ----- */
.wf-card{background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.8vh;padding:2vh 2vw 2vh;flex:0 0 auto;max-width:min(1300px,95vw);width:100%;margin:0 auto;display:flex;flex-direction:column;box-shadow:0 8px 24px rgba(67,53,32,.08),0 2px 6px rgba(67,53,32,.04)}
.wf-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2vh}
.wf-card-t{font-size:.7vw;font-weight:700;color:rgba(43,36,25,.6);text-transform:uppercase;letter-spacing:.12vw}
.wf-toggle{display:inline-flex;background:rgba(43,36,25,.06);border-radius:.5vh;padding:.3vh}
.wf-tog{background:transparent;border:none;font:inherit;font-family:'Montserrat',sans-serif;font-size:.6vw;font-weight:700;color:rgba(43,36,25,.55);padding:.55vh 1vw;border-radius:.35vh;cursor:pointer;text-transform:uppercase;letter-spacing:.08vw;transition:all .2s}
.wf-tog:hover{color:#2B2419}
.wf-tog.active{background:#FFFFFF;color:#9C7F3F;box-shadow:0 2px 4px rgba(0,0,0,.06)}

.wf-chart{position:relative;height:42vh;display:flex;padding-left:4vw}
.wf-y-axis{position:absolute;left:0;top:0;bottom:2.5vh;width:4vw}
.wf-y-axis span{position:absolute;left:0;right:.5vw;text-align:right;font-size:.6vw;font-weight:600;color:rgba(43,36,25,.4);transform:translateY(50%);font-variant-numeric:tabular-nums}
.wf-y-axis span:last-child{transform:translateY(0)}
.wf-plot{flex:1;position:relative;border-left:1px solid rgba(43,36,25,.18);border-bottom:1px solid rgba(43,36,25,.18);margin-bottom:5vh}
.wf-grid{position:absolute;left:0;right:0;height:1px;background:repeating-linear-gradient(to right,rgba(43,36,25,.08) 0,rgba(43,36,25,.08) 3px,transparent 3px,transparent 7px)}

.wf-target-line{position:absolute;left:0;right:0;height:0;border-top:2px dashed #9C7F3F;z-index:5;pointer-events:none}
.wf-target-label{position:absolute;right:0;top:-1.8vh;background:#9C7F3F;color:#FFFFFF;font-size:.65vw;font-weight:800;padding:.35vh .8vw;border-radius:.3vh;letter-spacing:.08vw;white-space:nowrap;box-shadow:0 2px 6px rgba(155,124,63,.3)}

.wf-bars{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:space-around;padding:0 .8vw}
.wf-bar-group{flex:1;height:100%;position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;min-width:0;max-width:11vw}
.wf-bar{width:65%;max-width:6vw;border-radius:.4vh .4vh 0 0;position:absolute;left:50%;transform:translateX(-50%);transition:bottom 1s cubic-bezier(.2,.7,.2,1),height 1s cubic-bezier(.2,.7,.2,1);box-shadow:0 -2px 8px rgba(0,0,0,.04),inset 0 1px 0 rgba(255,255,255,.3)}
.wf-bar.c-target{background:linear-gradient(180deg,rgba(43,36,25,.4),rgba(43,36,25,.25));border-radius:.4vh}
.wf-bar.c-actual{background:linear-gradient(180deg,#D4B87A,#9C7F3F)}
.wf-bar.c-actual.on{background:linear-gradient(180deg,#27B05A,#218B47)}
.wf-bar.c-actual.mid{background:linear-gradient(180deg,#E5A234,#D97706)}
.wf-bar.c-actual.off{background:linear-gradient(180deg,#E04C3A,#C0392B)}
.wf-bar.c-wf-no-risk{background:linear-gradient(180deg,#27B05A,#218B47)}
.wf-bar.c-wf-with-risk{background:linear-gradient(180deg,#E5A234,#D97706)}
.wf-bar.c-pipeline{background:linear-gradient(180deg,#7A6230,#5C4824)}
.wf-bar.c-total{background:linear-gradient(180deg,#D4B87A,#9C7F3F);border:2px solid #2B2419}
.wf-bar.c-total.on{background:linear-gradient(180deg,#27B05A,#218B47)}
.wf-bar.c-total.mid{background:linear-gradient(180deg,#E5A234,#D97706)}
.wf-bar.c-total.off{background:linear-gradient(180deg,#E04C3A,#C0392B)}
.wf-val{position:absolute;left:50%;transform:translateX(-50%);font-size:.9vw;font-weight:800;color:#2B2419;white-space:nowrap;z-index:3;font-variant-numeric:tabular-nums}
.wf-val.on{color:#218B47}
.wf-val.mid{color:#D97706}
.wf-val.off{color:#C0392B}
.wf-label{position:absolute;top:calc(100% + .6vh);left:50%;transform:translateX(-50%);font-size:.65vw;font-weight:700;color:rgba(43,36,25,.65);text-transform:uppercase;letter-spacing:.04vw;white-space:nowrap;text-align:center;line-height:1.2;width:100%}
.wf-label small{display:block;font-size:.55vw;color:rgba(43,36,25,.4);font-weight:600;margin-top:.2vh}
.wf-pct{position:absolute;top:calc(100% + 3.3vh);left:50%;transform:translateX(-50%);font-size:.7vw;font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
.wf-pct.on{color:#218B47}
.wf-pct.mid{color:#D97706}
.wf-pct.off{color:#C0392B}

.wf-connector{position:absolute;height:0;border-top:1.5px dotted rgba(43,36,25,.45);z-index:1;pointer-events:none}

/* ----- Per-service grid (Page 2: Revenue by Service Detail) ----- */
.svc-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5vw;flex:1;min-height:0;align-content:start}
.svc-card{background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.8vh;padding:2vh 2vw;display:flex;flex-direction:column;box-shadow:0 6px 18px rgba(67,53,32,.07);position:relative;overflow:hidden}
.svc-card::before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:linear-gradient(180deg,#C4A265,rgba(196,162,101,0))}
.svc-card-h{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1.2vh}
.svc-card-name{font-size:1.1vw;font-weight:700;color:#2B2419;letter-spacing:.02vw}
.svc-card-pct{font-size:1.6vw;font-weight:800;font-variant-numeric:tabular-nums;line-height:1}
.svc-card-pct.on{color:#218B47}
.svc-card-pct.mid{color:#D97706}
.svc-card-pct.off{color:#C0392B}
.svc-card-pct.na{color:rgba(43,36,25,.35)}

.svc-mini{position:relative;height:14vh;display:flex;padding-left:3vw;margin-bottom:1.4vh}
.svc-mini-y{position:absolute;left:0;top:0;bottom:0;width:3vw}
.svc-mini-y span{position:absolute;left:0;right:.4vw;text-align:right;font-size:.55vw;font-weight:600;color:rgba(43,36,25,.4);font-variant-numeric:tabular-nums;transform:translateY(50%)}
.svc-mini-y span:last-child{transform:translateY(0)}
.svc-mini-plot{flex:1;position:relative;border-left:1px solid rgba(43,36,25,.18);border-bottom:1px solid rgba(43,36,25,.18)}
.svc-mini-target-line{position:absolute;left:0;right:0;height:0;border-top:2px dashed #9C7F3F;z-index:2}
.svc-mini-target-label{position:absolute;right:.3vw;top:-1.4vh;background:#9C7F3F;color:#FFFFFF;font-size:.5vw;font-weight:800;padding:.2vh .5vw;border-radius:.25vh;letter-spacing:.05vw;white-space:nowrap}
.svc-mini-bars{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:center;padding:0 .5vw}
.svc-mini-bar-group{flex:0 0 auto;width:30%;max-width:5vw;height:100%;position:relative;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}
.svc-mini-val{position:absolute;left:50%;transform:translateX(-50%);font-size:.75vw;font-weight:800;color:#2B2419;white-space:nowrap;font-variant-numeric:tabular-nums;z-index:3}
.svc-mini-bar{width:100%;border-radius:.3vh .3vh 0 0;transition:height 1s cubic-bezier(.2,.7,.2,1);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.svc-mini-bar.on{background:linear-gradient(180deg,#27B05A,#218B47)}
.svc-mini-bar.mid{background:linear-gradient(180deg,#E5A234,#D97706)}
.svc-mini-bar.off{background:linear-gradient(180deg,#E04C3A,#C0392B)}
.svc-mini-bar.capped{border-top:2px solid #2B2419;background-image:repeating-linear-gradient(135deg,rgba(255,255,255,.2) 0,rgba(255,255,255,.2) 3px,transparent 3px,transparent 7px)}

.svc-card-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:.8vw}
.svc-stat{display:flex;flex-direction:column}
.svc-stat-l{font-size:.55vw;font-weight:700;color:rgba(43,36,25,.45);text-transform:uppercase;letter-spacing:.1vw;margin-bottom:.4vh}
.svc-stat-v{font-size:1.1vw;font-weight:800;font-variant-numeric:tabular-nums;color:#2B2419}
.svc-stat-v.on{color:#218B47}
.svc-stat-v.mid{color:#D97706}
.svc-stat-v.off{color:#C0392B}

.slide.active .wf-bar{animation:wfGrow 1.1s cubic-bezier(.2,.7,.2,1) both}
@keyframes wfGrow{from{height:0!important;bottom:0!important}}
.slide.active .svc-mini-bar{animation:wfGrow .9s cubic-bezier(.2,.7,.2,1) both}

/* Pace slide */
.pace-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1.5vw;margin-bottom:2vh}
.pace-card{background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.6vh;padding:2vh 1.5vw;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(67,53,32,.08);transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s;transform-style:preserve-3d}
.pace-card:hover{transform:translateZ(20px) rotateX(2deg);box-shadow:0 16px 40px rgba(67,53,32,.14)}
.pace-card::before{content:"";position:absolute;top:0;left:0;width:3px;height:100%;background:linear-gradient(180deg,#C4A265,rgba(196,162,101,0))}
.pace-l{font-size:.6vw;font-weight:700;color:rgba(43,36,25,.5);text-transform:uppercase;letter-spacing:.12vw;margin-bottom:.8vh}
.pace-v{font-size:2.6vw;font-weight:800;color:#2B2419;line-height:1;font-variant-numeric:tabular-nums}
.pace-sub{font-size:.7vw;color:rgba(43,36,25,.55);margin-top:.6vh}
.pace-sub b{color:#9C7F3F;font-weight:700}

.lc{flex:1;background:#FFFFFF;border:1px solid rgba(43,36,25,.08);border-radius:.6vh;padding:2vh 2.5vw;display:flex;flex-direction:column;min-height:0}
.lc svg{flex:1;width:100%;height:100%}
.lc-axis{stroke:rgba(43,36,25,.18);stroke-width:1}
.lc-grid{stroke:rgba(43,36,25,.08);stroke-width:1;stroke-dasharray:3 3}
.lc-target{stroke:rgba(43,36,25,.4);stroke-width:1.5;stroke-dasharray:6 4;fill:none}
.lc-actual{stroke:#9C7F3F;stroke-width:2.5;fill:none;filter:drop-shadow(0 0 8px rgba(196,162,101,.3))}
.lc-fill{fill:url(#paceGradient);opacity:.6}
.lc-tick{font-size:.55vw;fill:rgba(43,36,25,.55);font-family:'Montserrat',sans-serif}
.lc-marker{fill:#9C7F3F;stroke:#F0E8D4;stroke-width:2}

/* Fullscreen toggle */
.fs-btn{position:fixed;bottom:3vh;left:2vw;display:flex;align-items:center;gap:.5vw;padding:.7vh 1vw;background:rgba(255,255,255,.7);border:1px solid rgba(43,36,25,.15);border-radius:.5vh;cursor:pointer;z-index:99;opacity:.85;transition:opacity .35s ease,background .25s,border-color .25s,color .25s;color:#2B2419;-webkit-appearance:none;font-family:'Montserrat',sans-serif;font-size:.55vw;font-weight:700;text-transform:uppercase;letter-spacing:.15vw}
.fs-btn:hover{opacity:1!important;background:#FFFFFF;border-color:#9C7F3F;color:#9C7F3F}
.fs-btn svg{width:1.6vh;height:1.6vh;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.fs-btn .fs-exit{display:none}
.fs-btn .fs-label-out{display:none}
:fullscreen .fs-btn .fs-enter,:-webkit-full-screen .fs-btn .fs-enter{display:none}
:fullscreen .fs-btn .fs-exit,:-webkit-full-screen .fs-btn .fs-exit{display:block}
:fullscreen .fs-btn .fs-label-in,:-webkit-full-screen .fs-btn .fs-label-in{display:none}
:fullscreen .fs-btn .fs-label-out,:-webkit-full-screen .fs-btn .fs-label-out{display:inline}

/* Auto-hide the exit button in fullscreen unless mouse is moving or hovering */
:fullscreen .fs-btn,:-webkit-full-screen .fs-btn{opacity:0;pointer-events:auto}
:fullscreen.show-controls .fs-btn,:-webkit-full-screen.show-controls .fs-btn,:fullscreen .fs-btn:hover,:-webkit-full-screen .fs-btn:hover{opacity:.9}

.dots{position:fixed;bottom:2.5vh;left:50%;transform:translateX(-50%);display:flex;gap:.5vw;z-index:100}
.dot{width:.45vw;height:.45vw;border-radius:50%;background:rgba(43,36,25,.25);cursor:pointer;transition:all .4s}
.dot.active{background:#9C7F3F;width:1.8vw;border-radius:.25vw;box-shadow:0 0 12px rgba(155,124,63,.45)}

.fline{position:fixed;bottom:0;left:0;right:0;height:2px;background:linear-gradient(90deg,#9C7F3F,#C4A265,rgba(196,162,101,0));z-index:90}

/* Syberra footer mark */
.syb{position:fixed;bottom:3.5vh;right:2vw;display:flex;align-items:center;gap:.5vw;z-index:99;opacity:.85;transition:opacity .3s}
.syb:hover{opacity:1}
.syb-mark{display:inline-flex;gap:3px;align-items:center;margin-left:.2vw}
.syb-mark .sq{width:14px;height:10px;display:inline-block;background:#C0392B;border-radius:1px}
.syb-txt{font-size:.6vw;font-weight:700;color:rgba(43,36,25,.6);text-transform:uppercase;letter-spacing:.18vw}
.syb-txt b{color:#2B2419;font-weight:800}

/* Wake-lock indicator (bottom-left, next to fullscreen button) */
.wake-ind{position:fixed;bottom:3vh;left:10vw;display:flex;align-items:center;gap:.4vw;z-index:99;background:rgba(255,255,255,.6);padding:.55vh .8vw;border-radius:.5vh;border:1px solid rgba(43,36,25,.12);font-size:.5vw;color:rgba(43,36,25,.5);font-weight:700;text-transform:uppercase;letter-spacing:.12vw;opacity:.6;transition:opacity .25s,background .25s}
.wake-ind:hover{opacity:1}
.wake-dot{width:.45vw;height:.45vw;border-radius:50%;background:rgba(43,36,25,.3);box-shadow:0 0 4px rgba(43,36,25,.15);transition:background .25s,box-shadow .25s}
.wake-ind.on{background:rgba(33,139,71,.1);border-color:rgba(33,139,71,.3);color:#218B47;opacity:.75}
.wake-ind.on .wake-dot{background:#218B47;box-shadow:0 0 6px rgba(33,139,71,.6);animation:wakePulse 2s infinite}
@keyframes wakePulse{0%,100%{opacity:1}50%{opacity:.5}}

/* Live indicator */
.live{position:fixed;top:3vh;right:3.5vw;display:none;align-items:center;gap:.4vw;z-index:99;background:rgba(196,162,101,.2);padding:.5vh 1vw;border-radius:1vh;border:1px solid rgba(196,162,101,.5);font-size:.55vw;color:#9C7F3F;font-weight:700;text-transform:uppercase;letter-spacing:.1vw;animation:fadeOut 3s forwards}
.live::before{content:"";width:.6vw;height:.6vw;border-radius:50%;background:#9C7F3F;box-shadow:0 0 8px #C4A265;animation:pulse 1s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes fadeOut{0%,70%{opacity:1}100%{opacity:0}}

/* Animated entrance for bars */
@keyframes barGrow{from{height:0!important;transform:translateZ(-30px)}}
.slide.active .b{animation:barGrow 1s cubic-bezier(.2,.7,.2,1) both}

/* 3D entrance for cards and headers */
@keyframes fadeUp3d{from{opacity:0;transform:translateY(14px) translateZ(-40px) rotateX(-4deg)}to{opacity:1;transform:translateY(0) translateZ(0) rotateX(0)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.slide.active .gc-a,.slide.active .dh-a,.slide.active .pace-v{animation:fadeUp .7s ease both}

.slide.active .gc{animation:fadeUp3d .8s cubic-bezier(.2,.7,.2,1) both}
.slide.active .gc:nth-child(2){animation-delay:.1s}
.slide.active .gc:nth-child(3){animation-delay:.2s}

.slide.active .pace-card{animation:fadeUp3d .8s cubic-bezier(.2,.7,.2,1) both}
.slide.active .pace-card:nth-child(2){animation-delay:.1s}
.slide.active .pace-card:nth-child(3){animation-delay:.2s}

table.t tr{animation:none}
.slide.active table.t tbody tr{animation:fadeUp .5s ease both}
.slide.active table.t tbody tr:nth-child(1){animation-delay:.1s}
.slide.active table.t tbody tr:nth-child(2){animation-delay:.16s}
.slide.active table.t tbody tr:nth-child(3){animation-delay:.22s}
.slide.active table.t tbody tr:nth-child(4){animation-delay:.28s}
.slide.active table.t tbody tr:nth-child(5){animation-delay:.34s}
