:root{--bg:#edf4ef;--bg2:#f8fbf9;--panel:rgba(255,255,255,.92);--panel2:#fff;--text:#183025;--muted:#6d7d74;--line:rgba(28,73,47,.12);--green:#238a58;--green2:#45b878;--yellow:#c48a16;--red:#cf554a;--blue:#397fca;--shadow:0 18px 45px rgba(31,78,50,.10)}html[data-theme=light],html[data-theme=dark]{--bg:#edf4ef;--bg2:#f9fcfa;--panel:rgba(255,255,255,.94);--panel2:#fff;--text:#183025;--muted:#6d7d74;--line:rgba(28,73,47,.12);--shadow:0 18px 45px rgba(31,78,50,.10)}*{box-sizing:border-box}html,body{width:100%;min-height:100%;margin:0}body{font-family:Inter,Arial,sans-serif;color:var(--text);background:radial-gradient(circle at 10% -10%,rgba(69,184,120,.20),transparent 34%),radial-gradient(circle at 95% 8%,rgba(244,198,104,.18),transparent 29%),linear-gradient(145deg,var(--bg),var(--bg2));overflow:hidden}.screenGlow{position:fixed;border-radius:50%;filter:blur(100px);opacity:.13;pointer-events:none}.glowOne{width:460px;height:460px;background:#65c993;left:-200px;bottom:-190px}.glowTwo{width:360px;height:360px;background:#ffd790;right:-160px;top:-130px}.dashboardShell{position:relative;z-index:1;height:100vh;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:15px;padding:20px 26px 18px;max-width:1920px;margin:auto}.dashboardHeader{display:flex;align-items:center;justify-content:space-between;gap:24px}.brandBlock{display:flex;align-items:center;gap:17px;min-width:0}.logoFrame{width:76px;height:76px;border-radius:20px;border:1px solid var(--line);background:#fff;display:grid;place-items:center;padding:9px;box-shadow:var(--shadow);flex:0 0 auto}.logoFrame img{width:100%;height:100%;object-fit:contain}.logoFrame.logoMissing:after{content:'LOGO';font-size:13px;font-weight:900;color:var(--muted)}.eyebrow,.panelKicker{font-size:12px;font-weight:900;letter-spacing:.16em;color:var(--green);text-transform:uppercase}.brandBlock h1{font-size:clamp(25px,2vw,38px);line-height:1.05;margin:5px 0 7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.headerMeta{color:var(--muted);font-size:15px;display:flex;align-items:center;gap:8px}.liveDot{width:8px;height:8px;border-radius:50%;background:var(--green2);box-shadow:0 0 0 6px rgba(69,184,120,.13)}.headerRight{display:flex;align-items:center;gap:18px}.connectionBadge{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 14px;font-size:13px;font-weight:800;display:flex;gap:8px;align-items:center;box-shadow:0 8px 24px rgba(31,78,50,.07)}.connectionBadge span{width:8px;height:8px;border-radius:50%;background:var(--green)}.connectionBadge.offline span{background:var(--red)}.clockBox{text-align:right;min-width:150px}.clockBox strong{display:block;font-size:36px;line-height:1;font-variant-numeric:tabular-nums}.clockBox span{display:block;color:var(--muted);font-size:13px;margin-top:6px;text-transform:capitalize}.metricGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.metricCard{position:relative;overflow:hidden;display:flex;align-items:center;gap:16px;min-height:108px;padding:16px 18px;border:1px solid var(--line);border-radius:21px;background:linear-gradient(145deg,#fff,rgba(248,252,249,.96));box-shadow:var(--shadow)}.metricCard:after{content:'';position:absolute;width:120px;height:120px;border-radius:50%;right:-60px;top:-64px;background:var(--accent,rgba(69,184,120,.13))}.metricIcon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:var(--accent,rgba(69,184,120,.14));color:var(--accentText,var(--green));font-size:18px;font-weight:900;flex:0 0 auto}.metricCard span{display:block;color:var(--muted);font-size:14px;font-weight:700}.metricCard strong{display:block;font-size:clamp(27px,2.2vw,42px);line-height:1;margin:7px 0 5px;font-variant-numeric:tabular-nums}.metricCard small{color:var(--muted);font-size:12px}.factCard{--accent:rgba(57,127,202,.12);--accentText:var(--blue)}.percentCard{--accent:rgba(196,138,22,.13);--accentText:var(--yellow)}.idleCard{--accent:rgba(207,85,74,.11);--accentText:var(--red)}.dashboardMain{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(310px,.65fr);gap:15px;min-height:0}.panel{border:1px solid var(--line);border-radius:23px;background:linear-gradient(145deg,#fff,rgba(248,252,249,.97));box-shadow:var(--shadow);min-width:0}.chartPanel,.progressPanel{padding:18px 19px;min-height:0}.panelHead{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.panelHead h2{margin:4px 0 0;font-size:20px}.legend{display:flex;align-items:center;gap:16px;color:var(--muted);font-size:12px;font-weight:700}.legend span{display:flex;align-items:center;gap:7px}.legend i{display:block;width:11px;height:11px;border-radius:3px}.legendPlan{background:#d6e1da}.legendFact{background:var(--green2)}.chartViewport{position:relative;height:calc(100% - 52px);min-height:220px;margin-top:8px}.chartViewport svg{width:100%;height:100%;overflow:visible}.emptyState{display:none;position:absolute;inset:0;place-items:center;color:var(--muted);font-size:18px}.progressPanel{display:flex;flex-direction:column}.gaugeWrap{flex:1;min-height:190px;display:grid;place-items:center}.gauge{--p:0;--gaugeColor:var(--green);width:min(220px,20vh);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--gaugeColor) calc(var(--p)*1%),#e7eee9 0);box-shadow:0 18px 45px rgba(31,78,50,.10)}.gauge:before{content:'';grid-area:1/1;width:79%;aspect-ratio:1;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}.gaugeInner{grid-area:1/1;position:relative;text-align:center}.gaugeInner strong{display:block;font-size:43px;line-height:1;font-variant-numeric:tabular-nums}.gaugeInner span{display:block;color:var(--muted);font-size:13px;margin-top:7px}.progressDetails{display:grid;grid-template-columns:1fr 1fr;gap:10px}.progressDetails div{background:#f4f8f5;border:1px solid var(--line);border-radius:15px;padding:11px 13px}.progressDetails span{display:block;color:var(--muted);font-size:11px}.progressDetails strong{display:block;margin-top:5px;font-size:18px}.statusBanner{margin-top:10px;text-align:center;padding:10px 12px;border-radius:14px;background:#e4f6eb;color:var(--green);font-size:13px;font-weight:900}.statusBanner.bad{background:#fff0ee;color:var(--red)}.statusBanner.mid{background:#fff5d9;color:var(--yellow)}.statusBanner.over{background:#e9f2ff;color:var(--blue)}.rankingPanel{padding:14px 17px 16px}.rankingPanel .panelHead{align-items:center}.updatedText{font-size:12px;color:var(--muted)}.rankingGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:12px}.rankCard{min-width:0;display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:10px;border:1px solid var(--line);background:#f7faf8;border-radius:16px;padding:10px 12px}.rankPlace{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#eaf1ec;font-weight:900}.rankCard:nth-child(1) .rankPlace{background:#fff0c9;color:#a97508}.rankCard:nth-child(2) .rankPlace{background:#e9efeb}.rankCard:nth-child(3) .rankPlace{background:#f4dfcd;color:#a86735}.rankPerson{min-width:0}.rankPerson strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}.rankPerson span{display:block;color:var(--muted);font-size:10px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rankPercent{font-size:18px;font-weight:900}.rankPercent.good{color:var(--green)}.rankPercent.mid{color:var(--yellow)}.rankPercent.bad{color:var(--red)}.rankPercent.over{color:var(--blue)}.offlineToast{position:fixed;left:50%;bottom:20px;z-index:20;transform:translate(-50%,130px);background:#9b3d35;color:#fff;padding:12px 18px;border-radius:14px;font-size:13px;font-weight:800;transition:.25s}.offlineToast.show{transform:translate(-50%,0)}@media(max-width:1250px){.rankingGrid{grid-template-columns:repeat(2,1fr)}.dashboardShell{padding:16px}.metricCard{min-height:98px}.dashboardMain{grid-template-columns:1.35fr .65fr}}@media(max-width:900px){body{overflow:auto}.dashboardShell{height:auto;min-height:100vh;grid-template-rows:auto}.dashboardHeader{align-items:flex-start}.connectionBadge{display:none}.metricGrid{grid-template-columns:1fr 1fr}.dashboardMain{grid-template-columns:1fr}.chartViewport{height:360px}.rankingGrid{grid-template-columns:1fr 1fr}}@media(max-width:620px){.dashboardHeader{flex-direction:column}.headerRight{width:100%;justify-content:flex-end}.logoFrame{width:64px;height:64px}.brandBlock h1{white-space:normal}.metricGrid,.rankingGrid{grid-template-columns:1fr}.metricCard{min-height:92px}.legend{display:none}.dashboardShell{padding:12px}.clockBox strong{font-size:30px}.panel,.metricCard{border-radius:17px}.chartViewport{height:300px}.rankCard{padding:12px}}
.dateNav{display:flex;align-items:center;gap:6px;padding:5px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.88);box-shadow:0 8px 24px rgba(31,78,50,.07)}.dateNav button{height:34px;border:0;border-radius:10px;padding:0 11px;background:transparent;color:var(--text);font:inherit;font-size:12px;font-weight:850;cursor:pointer}.dateNav button:hover{background:#eef6f1}.dateNav button:first-child,.dateNav button:last-child{width:34px;padding:0;font-size:22px}.dataNotice{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:11px 16px;border:1px solid rgba(196,138,22,.22);border-radius:17px;background:linear-gradient(135deg,#fff9e7,#fffdf7);box-shadow:0 10px 28px rgba(135,94,12,.07)}.dataNotice[hidden]{display:none}.dataNotice strong{display:block;color:#8c620f;font-size:14px}.dataNotice span{display:block;margin-top:3px;color:var(--muted);font-size:12px}.dataNotice a{flex:0 0 auto;border-radius:12px;padding:9px 12px;background:#fff;color:#8c620f;text-decoration:none;font-size:12px;font-weight:900;border:1px solid rgba(196,138,22,.20)}@media(max-width:1100px){.dateNav{order:3;width:100%;justify-content:flex-end}.headerRight{flex-wrap:wrap;justify-content:flex-end}}@media(max-width:620px){.dateNav{justify-content:space-between}.dateNav button{flex:1}.dateNav button:first-child,.dateNav button:last-child{flex:0 0 34px}.dataNotice{align-items:flex-start;flex-direction:column}.dataNotice a{width:100%;text-align:center}}

/* ===== Живой экран: мягкие анимации для телевизора ===== */
@property --p{syntax:'<number>';inherits:false;initial-value:0}
.dashboardIntro>*{opacity:0;transform:translateY(18px);animation:dashReveal .72s cubic-bezier(.2,.72,.2,1) forwards}.dashboardIntro>.dashboardHeader{animation-delay:.05s}.dashboardIntro>.dataNotice{animation-delay:.13s}.dashboardIntro>.metricGrid{animation-delay:.18s}.dashboardIntro>.dashboardMain{animation-delay:.28s}.dashboardIntro>.rankingPanel{animation-delay:.38s}@keyframes dashReveal{to{opacity:1;transform:none}}
.screenGlow{animation:ambientFloat 13s ease-in-out infinite alternate}.glowTwo{animation-delay:-6s;animation-duration:16s}@keyframes ambientFloat{0%{transform:translate3d(-2%,0,0) scale(.96);opacity:.09}100%{transform:translate3d(7%,5%,0) scale(1.08);opacity:.18}}
.liveDot{animation:livePulse 2.2s ease-out infinite}@keyframes livePulse{0%{box-shadow:0 0 0 0 rgba(69,184,120,.28)}65%{box-shadow:0 0 0 10px rgba(69,184,120,0)}100%{box-shadow:0 0 0 0 rgba(69,184,120,0)}}
.metricCard{transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}.metricCard:before{content:'';position:absolute;inset:-60% auto -60% -35%;width:28%;transform:rotate(18deg) translateX(-260%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.72),transparent);pointer-events:none;animation:metricSheen 9s ease-in-out infinite}.metricCard:nth-child(2):before{animation-delay:1.4s}.metricCard:nth-child(3):before{animation-delay:2.8s}.metricCard:nth-child(4):before{animation-delay:4.2s}@keyframes metricSheen{0%,72%{transform:rotate(18deg) translateX(-260%)}88%,100%{transform:rotate(18deg) translateX(650%)}}
.metricCard.is-updated{animation:cardUpdate .8s ease}@keyframes cardUpdate{0%{transform:scale(1)}36%{transform:scale(1.018);box-shadow:0 22px 55px rgba(35,138,88,.18)}100%{transform:scale(1)}}
.metricCard strong,.gaugeInner strong,.rankPercent{font-variant-numeric:tabular-nums}
.gauge{transition:--p 1.15s cubic-bezier(.22,.8,.26,1),--gaugeColor .45s ease;position:relative}.gauge:after{content:'';position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(35,138,88,.18);animation:gaugeBreath 3.2s ease-in-out infinite;pointer-events:none}@keyframes gaugeBreath{0%,100%{transform:scale(.98);opacity:.15}50%{transform:scale(1.035);opacity:.65}}
#mastersChart rect.chartBar{transition:y 1s cubic-bezier(.2,.75,.25,1),height 1s cubic-bezier(.2,.75,.25,1);transform-box:fill-box;transform-origin:center bottom}#mastersChart text.chartValue{opacity:0;animation:chartLabelIn .45s ease .78s forwards}@keyframes chartLabelIn{to{opacity:1}}
.rankCard{position:relative;overflow:hidden;transition:transform .38s ease,border-color .38s ease,box-shadow .38s ease,background .38s ease}.rankCard:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 25%,rgba(255,255,255,.74) 48%,transparent 70%);transform:translateX(-140%)}.rankCard.spotlight{transform:translateY(-3px);border-color:rgba(35,138,88,.28);background:#fff;box-shadow:0 14px 32px rgba(31,78,50,.13)}.rankCard.spotlight:after{animation:rankSweep 1.15s ease}@keyframes rankSweep{to{transform:translateX(140%)}}
.statusBanner{transition:background .35s ease,color .35s ease,transform .35s ease}.statusBanner.is-updated{animation:statusPop .75s ease}@keyframes statusPop{0%{transform:scale(.97);opacity:.65}45%{transform:scale(1.025)}100%{transform:scale(1);opacity:1}}
.connectionBadge:not(.offline) span{animation:connectionPulse 2s ease-in-out infinite}@keyframes connectionPulse{50%{transform:scale(1.35);box-shadow:0 0 0 5px rgba(35,138,88,.12)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.dashboardIntro>*{opacity:1;transform:none}}

/* ===== Персональный результат каждой смены ===== */
.chartPanel{display:flex;flex-direction:column}.chartViewport{flex:1;min-height:210px;height:auto}.shiftResultsHead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:7px 1px 9px;padding-top:10px;border-top:1px solid var(--line)}.shiftResultsHead span{color:var(--green);font-size:11px;font-weight:950;letter-spacing:.13em}.shiftResultsHead small{color:var(--muted);font-size:11px}.shiftResultsGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.shiftResultCard{--shiftColor:var(--green);position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--shiftColor) 22%,var(--line));border-radius:17px;padding:12px 13px 11px;background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--shiftColor) 5%,#fff));box-shadow:0 8px 22px rgba(31,78,50,.06);animation:shiftCardIn .55s cubic-bezier(.2,.75,.25,1) both;animation-delay:var(--delay)}.shiftResultCard.bad{--shiftColor:var(--red)}.shiftResultCard.mid{--shiftColor:var(--yellow)}.shiftResultCard.good{--shiftColor:var(--green)}.shiftResultCard.over{--shiftColor:var(--blue)}.shiftResultCard:before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--shiftColor)}.shiftResultTop{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.shiftCrew{min-width:0;padding-left:2px}.shiftCrew span{display:block;color:var(--muted);font-size:9px;font-weight:950;letter-spacing:.11em}.shiftCrew strong{display:block;margin-top:4px;color:var(--ink);font-size:14px;line-height:1.18;white-space:normal;overflow-wrap:anywhere}.shiftPercent{flex:0 0 auto;color:var(--shiftColor);font-size:25px;line-height:1;font-weight:950;font-variant-numeric:tabular-nums}.shiftStatus{display:flex;align-items:center;gap:7px;margin-top:9px;padding:7px 9px;border-radius:11px;background:color-mix(in srgb,var(--shiftColor) 9%,#fff);color:var(--shiftColor);font-size:10px}.shiftStatus i{width:7px;height:7px;border-radius:50%;background:var(--shiftColor);box-shadow:0 0 0 4px color-mix(in srgb,var(--shiftColor) 14%,transparent)}.shiftStatus strong{font-size:11px;white-space:nowrap}.shiftStatus span{min-width:0;margin-left:auto;color:var(--text);font-weight:800;text-align:right}.shiftNumbers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:9px}.shiftNumbers div{min-width:0;padding:6px 7px;border-radius:9px;background:rgba(255,255,255,.72);border:1px solid rgba(39,82,55,.07)}.shiftNumbers span{display:block;color:var(--muted);font-size:8px}.shiftNumbers strong{display:block;margin-top:2px;color:var(--ink);font-size:11px;white-space:nowrap}.shiftProgress{height:5px;margin-top:9px;border-radius:999px;background:rgba(31,54,42,.08);overflow:hidden}.shiftProgress span{display:block;height:100%;border-radius:inherit;background:var(--shiftColor);transform-origin:left;animation:shiftProgressIn .9s cubic-bezier(.2,.75,.25,1) both}.shiftResultEmpty{grid-column:1/-1;padding:16px;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:12px;text-align:center}@keyframes shiftCardIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes shiftProgressIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:1450px){.shiftResultsGrid{grid-template-columns:1fr}.shiftResultCard:nth-child(n+3){display:none}}
@media(max-width:900px){.shiftResultsGrid{grid-template-columns:1fr}.shiftResultCard:nth-child(n){display:block}.shiftResultsHead{align-items:flex-start;flex-direction:column;gap:3px}}
@media(max-width:620px){.shiftNumbers{grid-template-columns:1fr 1fr}.shiftStatus{align-items:flex-start;flex-wrap:wrap}.shiftStatus span{width:100%;margin-left:14px;text-align:left}.shiftPercent{font-size:22px}}

/* ===== Исправление наложения блоков смен ===== */
.dashboardMain{overflow:hidden;align-items:stretch}
.chartPanel{
  display:grid;
  grid-template-rows:auto minmax(165px,1fr) auto auto;
  overflow:hidden;
  min-height:0;
}
.chartPanel .chartViewport{
  width:100%;
  height:auto;
  min-height:0;
  margin-top:6px;
  overflow:hidden;
}
.chartPanel .chartViewport svg{overflow:hidden}
.shiftResultsHead{margin:4px 1px 7px;padding-top:8px}
.shiftResultsGrid{min-height:0;align-self:end}
.shiftResultCard{padding:10px 12px 9px;border-radius:15px}
.shiftCrew strong{font-size:13px}
.shiftPercent{font-size:23px}
.shiftStatus{margin-top:7px;padding:6px 8px}
.shiftNumbers{margin-top:7px}
.shiftProgress{margin-top:7px}
.rankingPanel{position:relative;z-index:2}

@media(max-height:850px) and (min-width:901px){
  .dashboardShell{gap:10px;padding-top:12px;padding-bottom:12px}
  .dashboardHeader{min-height:58px}
  .logoFrame{width:62px;height:62px;border-radius:17px}
  .brandBlock h1{font-size:27px;margin:3px 0 5px}
  .clockBox strong{font-size:30px}
  .metricCard{min-height:82px;padding:11px 15px}
  .metricIcon{width:42px;height:42px}
  .metricCard strong{font-size:29px;margin:4px 0}
  .chartPanel,.progressPanel{padding:13px 16px}
  .panelHead h2{font-size:18px}
  .chartPanel{grid-template-rows:auto minmax(145px,1fr) auto auto}
  .shiftResultsHead{padding-top:6px;margin-bottom:6px}
  .shiftResultCard{padding:8px 10px 7px}
  .shiftCrew span{font-size:8px}
  .shiftCrew strong{font-size:12px;margin-top:2px}
  .shiftPercent{font-size:21px}
  .shiftStatus{margin-top:5px;padding:5px 7px}
  .shiftNumbers{margin-top:5px;gap:4px}
  .shiftNumbers div{padding:4px 6px}
  .shiftProgress{margin-top:5px}
  .gaugeWrap{min-height:145px}
  .gauge{width:min(176px,21vh)}
  .gaugeInner strong{font-size:36px}
  .progressDetails div{padding:8px 10px}
  .statusBanner{margin-top:7px;padding:8px 10px}
  .rankingPanel{padding:10px 15px 11px}
  .rankingGrid{margin-top:8px}
  .rankCard{padding:8px 10px}
}

@media(max-height:700px) and (min-width:901px){
  .dashboardShell{grid-template-rows:auto minmax(0,1fr) auto}
  .metricGrid{display:none}
  .chartPanel{grid-template-rows:auto minmax(130px,1fr) auto auto}
  .shiftNumbers{display:none}
  .shiftResultCard{padding-bottom:7px}
  .rankingPanel .panelKicker{display:none}
  .rankingPanel .panelHead h2{font-size:17px}
}

/* ===== Чистый компактный результат смен ===== */
.chartPanel{
  grid-template-rows:auto minmax(170px,1fr) auto auto;
}
.shiftResultsHead{
  position:relative;
  z-index:2;
  margin:0 1px 7px;
  padding-top:8px;
  background:transparent;
}
.shiftResultsGrid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  min-height:0;
}
.shiftResultCard{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  grid-template-rows:auto 5px;
  align-items:center;
  gap:8px 12px;
  min-height:64px;
  padding:9px 12px 8px 15px;
  border-radius:14px;
}
.shiftCrew{min-width:0;padding:0}
.shiftCrew span{font-size:8px;line-height:1}
.shiftCrew strong{
  margin-top:4px;
  font-size:12px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.shiftStatus{
  display:flex;
  align-items:center;
  gap:6px;
  min-width:0;
  margin:0;
  padding:6px 8px;
  white-space:nowrap;
}
.shiftStatus strong{font-size:10px}
.shiftStatus span{
  max-width:140px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.shiftPercent{font-size:22px}
.shiftProgress{
  grid-column:1/-1;
  width:100%;
  height:4px;
  margin:0;
}
.shiftNumbers,.shiftResultTop{display:contents}

@media(max-width:1200px){
  .shiftStatus span{display:none}
}
@media(max-width:900px){
  .shiftResultsGrid{grid-template-columns:1fr}
  .shiftResultCard{grid-template-columns:minmax(0,1fr) auto}
  .shiftStatus{grid-column:1/2;grid-row:2;margin-top:2px;justify-self:start}
  .shiftPercent{grid-column:2;grid-row:1/3}
  .shiftProgress{grid-row:3}
}
@media(max-height:700px) and (min-width:901px){
  .chartPanel{grid-template-rows:auto minmax(145px,1fr) auto auto}
  .shiftResultsHead small{display:none}
  .shiftResultCard{min-height:54px;padding-top:7px;padding-bottom:6px}
}


/* ===== V11: выразительный общий результат ===== */
.progressPanel{
  --resultColor:var(--yellow);
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 36%,color-mix(in srgb,var(--resultColor) 12%,transparent),transparent 38%),
    linear-gradient(145deg,#fff,rgba(248,252,249,.98));
}
.progressPanel::before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(130deg,transparent 15%,rgba(255,255,255,.9) 38%,transparent 58%);
  transform:translateX(-120%);
  animation:resultPanelShine 7s ease-in-out infinite;
  pointer-events:none;
}
.progressPanel::after{
  content:"";
  position:absolute;
  width:180px;height:180px;
  right:-80px;bottom:-100px;
  border-radius:50%;
  background:color-mix(in srgb,var(--resultColor) 12%,transparent);
  filter:blur(4px);
  pointer-events:none;
}
@keyframes resultPanelShine{0%,68%{transform:translateX(-130%)}86%,100%{transform:translateX(130%)}}
.resultPanelHead{position:relative;z-index:3;align-items:center}
.resultLive{display:flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.78);color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.03em}
.resultLive i{width:7px;height:7px;border-radius:50%;background:var(--green2);box-shadow:0 0 0 0 rgba(69,184,120,.35);animation:resultLivePulse 2s ease-out infinite}
@keyframes resultLivePulse{0%{box-shadow:0 0 0 0 rgba(69,184,120,.38)}70%{box-shadow:0 0 0 7px rgba(69,184,120,0)}100%{box-shadow:0 0 0 0 rgba(69,184,120,0)}}
.gaugeStage{position:relative;display:grid;place-items:center;min-height:215px;margin-top:2px}
.gaugeAura{position:absolute;width:205px;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--resultColor) 18%,transparent),transparent 66%);filter:blur(10px);animation:gaugeAura 3.6s ease-in-out infinite}
@keyframes gaugeAura{0%,100%{transform:scale(.92);opacity:.55}50%{transform:scale(1.08);opacity:1}}
.gaugeOrbit{position:absolute;width:205px;aspect-ratio:1;border:1px solid color-mix(in srgb,var(--resultColor) 22%,transparent);border-radius:50%;animation:orbitSpin 10s linear infinite}
.gaugeOrbit.orbitTwo{width:228px;border-style:dashed;opacity:.5;animation-duration:16s;animation-direction:reverse}
.gaugeOrbit i{position:absolute;width:8px;height:8px;border-radius:50%;top:12px;left:50%;background:var(--resultColor);box-shadow:0 0 14px color-mix(in srgb,var(--resultColor) 70%,transparent)}
.orbitTwo i{width:5px;height:5px;top:29px}
@keyframes orbitSpin{to{transform:rotate(360deg)}}
.gaugeStage .gauge{position:relative;z-index:2;width:178px;box-shadow:0 18px 42px color-mix(in srgb,var(--resultColor) 18%,transparent),inset 0 0 0 1px rgba(255,255,255,.8)}
.gaugeStage .gauge::before{width:76%;box-shadow:inset 0 0 0 1px var(--line),0 6px 20px rgba(31,78,50,.07)}
.gaugeStage .gauge::after{inset:-10px;border-color:color-mix(in srgb,var(--resultColor) 24%,transparent)}
.gaugeInner small{display:block;margin-bottom:7px;color:var(--muted);font-size:8px;font-weight:900;letter-spacing:.12em}
.gaugeInner strong{font-size:47px;letter-spacing:-.055em}
.gaugeInner span{font-weight:800}
.resultScale{margin:-2px 2px 12px}
.resultScaleTrack{height:8px;border-radius:999px;background:#e8efea;overflow:hidden;box-shadow:inset 0 1px 2px rgba(21,54,37,.08)}
.resultScaleTrack span{display:block;width:var(--scale,0%);height:100%;border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--resultColor) 70%,#fff),var(--resultColor));box-shadow:0 0 14px color-mix(in srgb,var(--resultColor) 35%,transparent);transition:width 1.15s cubic-bezier(.22,.8,.26,1)}
.resultScaleMarks{display:flex;justify-content:space-between;margin-top:5px;padding:0 1px;color:#8a9991;font-size:8px;font-weight:800}
.resultMetrics{gap:9px}
.resultMetric{position:relative;overflow:hidden;min-height:75px;padding:11px 12px!important;background:linear-gradient(145deg,#f7faf8,#fff)!important;transition:transform .25s ease,border-color .25s ease}
.resultMetric:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--resultColor) 30%,var(--line))}
.resultMetric>span{display:flex!important;align-items:center;gap:7px}
.resultMetricIcon{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;background:color-mix(in srgb,var(--resultColor) 13%,#fff);color:var(--resultColor);font-size:10px}
.resultMetric strong{font-size:20px!important;margin-top:7px!important}
.resultMetric small{display:block;margin-top:4px;color:var(--muted);font-size:9px}
.resultStatus{display:flex;align-items:center;gap:10px;text-align:left;padding:10px 12px!important;min-height:52px;border:1px solid color-mix(in srgb,var(--resultColor) 18%,transparent);background:color-mix(in srgb,var(--resultColor) 10%,#fff)!important;color:var(--resultColor)!important}
.resultStatusIcon{width:30px;height:30px;flex:0 0 auto;display:grid;place-items:center;border-radius:10px;background:var(--resultColor);color:#fff;font-size:15px;font-weight:900;box-shadow:0 8px 18px color-mix(in srgb,var(--resultColor) 24%,transparent)}
.resultStatus div{min-width:0}.resultStatus strong{display:block;font-size:12px}.resultStatus small{display:block;margin-top:2px;color:var(--text);font-size:9px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.progressPanel.is-updated{animation:resultPanelUpdate 1.05s ease}
@keyframes resultPanelUpdate{0%{box-shadow:var(--shadow)}35%{box-shadow:0 0 0 4px color-mix(in srgb,var(--resultColor) 14%,transparent),0 22px 55px color-mix(in srgb,var(--resultColor) 20%,transparent)}100%{box-shadow:var(--shadow)}}
@media(max-height:850px) and (min-width:901px){
  .gaugeStage{min-height:165px}
  .gaugeStage .gauge{width:145px}
  .gaugeOrbit{width:168px}.gaugeOrbit.orbitTwo{width:188px}.gaugeAura{width:175px}
  .gaugeInner strong{font-size:37px}.gaugeInner small{display:none}
  .resultMetric{min-height:62px}.resultMetric small{display:none}
  .resultScale{margin-bottom:8px}
  .resultStatus{min-height:45px;padding:8px 10px!important}
}
@media(max-width:900px){
  .gaugeStage{min-height:245px}.gaugeStage .gauge{width:190px}.gaugeOrbit{width:220px}.gaugeOrbit.orbitTwo{width:245px}
}
@media(max-width:520px){
  .resultLive span{display:none}.resultLive{padding:8px}
  .gaugeStage{min-height:220px}.gaugeStage .gauge{width:168px}.gaugeOrbit{width:195px}.gaugeOrbit.orbitTwo{width:216px}
  .resultMetrics{grid-template-columns:1fr 1fr}
  .resultStatus small{white-space:normal}
}
@media(prefers-reduced-motion:reduce){.progressPanel::before,.resultLive i,.gaugeAura,.gaugeOrbit{animation:none!important}}

/* V12: общий результат без кольца */
.progressPanel{--resultColor:var(--yellow);position:relative;overflow:hidden;isolation:isolate}
.progressPanel::before{content:"";position:absolute;inset:auto -90px -110px auto;width:260px;height:260px;border-radius:50%;background:color-mix(in srgb,var(--resultColor) 12%,transparent);filter:blur(10px);z-index:-1;animation:resultBlob 8s ease-in-out infinite alternate}
.progressPanel::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 0 42%,rgba(255,255,255,.62) 49%,transparent 56%);transform:translateX(-120%);pointer-events:none;z-index:3;animation:resultSheen 8s ease-in-out infinite}
.resultPanelHead{align-items:center}.resultLive{display:flex;align-items:center;gap:7px;border:1px solid var(--line);background:rgba(255,255,255,.75);border-radius:999px;padding:8px 11px;color:var(--muted);font-size:10px;font-weight:800}.resultLive i{width:7px;height:7px;border-radius:50%;background:var(--green2);box-shadow:0 0 0 5px rgba(69,184,120,.12);animation:livePulse 1.8s ease-in-out infinite}
.resultHero{display:grid;gap:12px;margin-top:14px}
.resultScoreBlock{position:relative;overflow:hidden;border:1px solid color-mix(in srgb,var(--resultColor) 22%,var(--line));border-radius:22px;padding:18px 18px 15px;background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--resultColor) 5%,#fff));box-shadow:0 16px 36px color-mix(in srgb,var(--resultColor) 10%,transparent)}
.resultScoreBlock::after{content:"%";position:absolute;right:-8px;top:-34px;font-size:150px;line-height:1;font-weight:950;color:color-mix(in srgb,var(--resultColor) 7%,transparent);letter-spacing:-.08em;pointer-events:none}
.resultScoreLabel{display:block;color:var(--muted);font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.resultScoreLine{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin:7px 0 17px}
.resultScoreLine strong{font-size:clamp(52px,5.2vw,82px);line-height:.9;letter-spacing:-.065em;font-weight:950;color:var(--text);font-variant-numeric:tabular-nums}
.resultTrend{max-width:140px;text-align:right;color:var(--resultColor);font-size:12px;font-weight:900;line-height:1.25}
.resultMeterTrack{position:relative;height:15px;border-radius:999px;background:#e9f0eb;box-shadow:inset 0 2px 4px rgba(23,48,37,.09);overflow:visible}
.resultMeterFill{position:absolute;left:0;top:0;bottom:0;width:var(--scale,0%);max-width:100%;border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--resultColor) 58%,#fff),var(--resultColor));box-shadow:0 8px 18px color-mix(in srgb,var(--resultColor) 25%,transparent);transition:width 1.15s cubic-bezier(.22,.8,.26,1)}
.resultMeterFill::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-120%);animation:meterShine 3.4s ease-in-out infinite}
.resultMeterMarker{position:absolute;top:-5px;width:1px;height:25px;background:rgba(24,48,37,.18)}.marker70{left:70%}.marker90{left:90%}
.resultMeterKnob{--position:0%;position:absolute;left:clamp(0%,var(--position),100%);top:50%;width:23px;height:23px;border:5px solid #fff;border-radius:50%;background:var(--resultColor);box-shadow:0 5px 14px color-mix(in srgb,var(--resultColor) 38%,transparent);transform:translate(-50%,-50%);transition:left 1.15s cubic-bezier(.22,.8,.26,1)}
.resultMeterMarks{display:flex;justify-content:space-between;margin-top:7px;color:#8a9991;font-size:8px;font-weight:800}
.resultStatusCard{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:11px;border:1px solid color-mix(in srgb,var(--resultColor) 20%,var(--line));border-radius:17px;padding:12px 13px;background:color-mix(in srgb,var(--resultColor) 7%,#fff)}
.resultStatusIcon{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:var(--resultColor);color:#fff;font-size:18px;font-weight:950;box-shadow:0 8px 20px color-mix(in srgb,var(--resultColor) 24%,transparent)}
.resultStatusCard strong{display:block;color:var(--resultColor);font-size:14px}.resultStatusCard small{display:block;margin-top:3px;color:var(--muted);font-size:10px;line-height:1.3}
.resultMetrics{margin-top:12px;gap:10px}.resultMetric{position:relative;overflow:hidden;min-height:82px;padding:12px 13px!important;background:linear-gradient(145deg,#f7faf8,#fff)!important}.resultMetric>span{display:flex!important;align-items:center;gap:7px}.resultMetricIcon{width:24px;height:24px;border-radius:8px;display:grid;place-items:center;background:color-mix(in srgb,var(--resultColor) 12%,#fff);color:var(--resultColor);font-size:10px}.resultMetric strong{font-size:22px!important;margin-top:7px!important}.resultMetric small{display:block;margin-top:4px;color:var(--muted);font-size:9px}
.progressPanel.is-updated .resultScoreBlock{animation:scoreUpdate .9s ease}
@keyframes resultBlob{to{transform:translate(-22px,-18px) scale(1.08)}}
@keyframes resultSheen{0%,72%{transform:translateX(-120%)}84%,100%{transform:translateX(120%)}}
@keyframes livePulse{50%{box-shadow:0 0 0 9px rgba(69,184,120,0)}}
@keyframes meterShine{0%,60%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes scoreUpdate{0%{transform:scale(.985);filter:saturate(.75)}55%{transform:scale(1.012)}100%{transform:scale(1)}}
@media(max-height:820px) and (min-width:901px){.resultScoreBlock{padding:14px 15px 12px}.resultScoreLine{margin:5px 0 12px}.resultScoreLine strong{font-size:50px}.resultStatusCard{padding:9px 11px}.resultMetrics{margin-top:9px}.resultMetric{min-height:66px}.resultMetric small{display:none}}
@media(max-width:900px){.resultScoreLine strong{font-size:64px}.resultTrend{max-width:none}.resultScoreBlock{padding:16px}.resultStatusCard small{font-size:11px}}
@media(max-width:520px){.resultScoreLine{align-items:flex-start;flex-direction:column}.resultTrend{text-align:left}.resultScoreLine strong{font-size:56px}.resultMetrics{grid-template-columns:1fr 1fr}.resultLive{display:none}}
@media(prefers-reduced-motion:reduce){.progressPanel::before,.progressPanel::after,.resultLive i,.resultMeterFill::after{animation:none!important}}

/* ===== V13: компактный общий результат без тяжёлых карточек ===== */
.progressPanel{
  display:flex;
  flex-direction:column;
  min-height:0;
  background:linear-gradient(145deg,#fff,#f8fbf9);
}
.progressPanel::before,
.progressPanel::after{display:none!important}
.resultPanelHead{flex:0 0 auto}
.resultCompact{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-rows:auto auto auto;
  gap:14px;
  margin-top:14px;
  padding:18px;
  border:1px solid color-mix(in srgb,var(--resultColor) 18%,var(--line));
  border-radius:22px;
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--resultColor) 3%,#fff));
  box-shadow:0 14px 34px rgba(31,78,50,.06);
}
.resultCompactTop{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(190px,.8fr);
  gap:16px;
  align-items:center;
}
.resultCompactScore{min-width:0}
.resultCompactScore .resultScoreLabel{
  display:block;
  margin-bottom:6px;
  color:var(--muted);
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.resultCompactScore strong{
  display:block;
  color:var(--text);
  font-size:clamp(50px,4.5vw,74px);
  line-height:.9;
  font-weight:950;
  letter-spacing:-.065em;
  font-variant-numeric:tabular-nums;
}
.resultStatusCard{
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  gap:10px;
  min-height:58px;
  padding:10px 11px;
  border:1px solid color-mix(in srgb,var(--resultColor) 20%,var(--line));
  border-radius:15px;
  background:color-mix(in srgb,var(--resultColor) 6%,#fff);
}
.resultStatusIcon{
  width:34px;height:34px;
  display:grid;place-items:center;
  border-radius:11px;
  background:var(--resultColor);
  color:#fff;
  font-size:15px;
  font-weight:950;
  box-shadow:0 7px 16px color-mix(in srgb,var(--resultColor) 20%,transparent);
}
.resultStatusCard strong{display:block;color:var(--resultColor);font-size:13px;line-height:1.15}
.resultStatusCard small{display:block;margin-top:3px;color:var(--muted);font-size:9px;line-height:1.25}
.resultMeter{min-width:0}
.resultMeterTrack{height:12px}
.resultMeterKnob{width:20px;height:20px;border-width:4px}
.resultMeterMarker{top:-4px;height:20px}
.resultMeterMarks{margin-top:6px}
.resultCompactBottom{
  display:grid;
  grid-template-columns:minmax(120px,1fr) repeat(2,minmax(115px,.85fr));
  gap:8px;
  align-items:stretch;
}
.resultTrend,
.resultInlineMetric{
  min-width:0;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.72);
  padding:9px 10px;
}
.resultTrend{
  display:flex;
  align-items:center;
  color:var(--resultColor);
  font-size:11px;
  font-weight:900;
  line-height:1.25;
  text-align:left;
  max-width:none;
}
.resultInlineMetric span{display:block;color:var(--muted);font-size:9px;font-weight:800}
.resultInlineMetric strong{display:block;margin-top:3px;color:var(--text);font-size:18px;line-height:1;font-weight:950;font-variant-numeric:tabular-nums}
.resultInlineMetric small{display:block;margin-top:3px;color:var(--muted);font-size:8px;line-height:1.15}
.progressPanel.is-updated .resultCompact{animation:scoreUpdate .9s ease}
.resultMetrics,.resultScoreBlock,.resultHero{display:none!important}
@media(max-height:820px) and (min-width:901px){
  .resultCompact{gap:10px;margin-top:10px;padding:14px}
  .resultCompactScore strong{font-size:50px}
  .resultStatusCard{min-height:50px;padding:8px 9px}
  .resultCompactBottom{gap:6px}
  .resultTrend,.resultInlineMetric{padding:7px 8px}
  .resultInlineMetric strong{font-size:16px}
  .resultStatusCard small,.resultInlineMetric small{display:none}
}
@media(max-width:900px){
  .resultCompactTop{grid-template-columns:1fr}
  .resultCompactScore strong{font-size:58px}
  .resultCompactBottom{grid-template-columns:1fr 1fr}
  .resultTrend{grid-column:1/-1}
}
@media(max-width:520px){
  .resultCompact{padding:14px}
  .resultCompactScore strong{font-size:52px}
  .resultCompactBottom{grid-template-columns:1fr}
  .resultTrend{grid-column:auto}
  .resultLive{display:none}
}


/* ===== Overall result V14: cleaner, stronger typography ===== */
.progressPanel{
  --resultColor:var(--yellow);
}
.resultCompact{
  position:relative;
  overflow:hidden;
  gap:16px;
  padding:20px;
  border-color:color-mix(in srgb,var(--resultColor) 24%,var(--line));
  background:
    radial-gradient(circle at 92% 10%,color-mix(in srgb,var(--resultColor) 10%,transparent),transparent 34%),
    linear-gradient(145deg,#fff 0%,#fbfdfc 58%,color-mix(in srgb,var(--resultColor) 4%,#fff) 100%);
  box-shadow:0 16px 36px rgba(31,78,50,.075),inset 0 1px 0 rgba(255,255,255,.9);
}
.resultCompact::after{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  right:-78px;
  top:-82px;
  border-radius:50%;
  border:28px solid color-mix(in srgb,var(--resultColor) 6%,transparent);
  pointer-events:none;
}
.resultCompactScore .resultScoreLabel{
  margin-bottom:8px;
  color:#60736a;
  font-size:11px;
  font-weight:950;
  letter-spacing:.14em;
}
.resultCompactScore strong{
  font-size:clamp(54px,4.7vw,78px);
  font-weight:1000;
  letter-spacing:-.07em;
  text-shadow:0 1px 0 #fff;
}
.resultStatusCard{
  min-height:64px;
  padding:12px 13px;
  border-radius:17px;
  border-color:color-mix(in srgb,var(--resultColor) 28%,var(--line));
  background:linear-gradient(135deg,color-mix(in srgb,var(--resultColor) 10%,#fff),#fff);
  box-shadow:0 10px 24px color-mix(in srgb,var(--resultColor) 8%,transparent);
}
.resultStatusIcon{
  width:38px;
  height:38px;
  border-radius:12px;
  font-size:17px;
}
.resultStatusCard strong{
  font-size:15px;
  font-weight:950;
  letter-spacing:-.01em;
}
.resultStatusCard small{
  margin-top:4px;
  color:#52665c;
  font-size:10px;
  font-weight:750;
}
.resultMeterTrack{
  height:13px;
  background:#e7eee9;
  box-shadow:inset 0 1px 3px rgba(20,50,34,.11);
}
.resultMeterFill{
  background:linear-gradient(90deg,color-mix(in srgb,var(--resultColor) 66%,#efd178),var(--resultColor));
  box-shadow:0 4px 12px color-mix(in srgb,var(--resultColor) 22%,transparent);
}
.resultMeterKnob{
  width:22px;
  height:22px;
  border-width:4px;
  box-shadow:0 5px 14px color-mix(in srgb,var(--resultColor) 30%,transparent),0 0 0 4px rgba(255,255,255,.8);
}
.resultMeterMarks{
  color:#6b7d74;
  font-size:9px;
  font-weight:900;
}
.resultCompactBottom{
  grid-template-columns:1.08fr .92fr .92fr;
  gap:10px;
}
.resultTrend,
.resultInlineMetric{
  min-height:88px;
  padding:13px 14px;
  border-radius:16px;
  border-color:rgba(28,73,47,.13);
  background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(248,251,249,.94));
  box-shadow:inset 0 1px 0 #fff;
}
.resultTrend{
  display:block;
  color:var(--text);
  text-align:left;
}
.resultTrendLabel,
.resultInlineMetric span{
  display:block;
  color:#6a7b72;
  font-size:10px;
  font-weight:900;
  letter-spacing:.02em;
}
.resultTrend strong,
.resultInlineMetric strong{
  display:block;
  margin-top:7px;
  color:var(--text);
  font-size:22px;
  line-height:1;
  font-weight:1000;
  letter-spacing:-.025em;
  font-variant-numeric:tabular-nums;
}
.resultTrend strong{color:var(--resultColor)}
.resultTrend small,
.resultInlineMetric small{
  display:block;
  margin-top:6px;
  color:#718078;
  font-size:9px;
  line-height:1.2;
  font-weight:750;
}
.resultInlineMetric:first-of-type strong{color:var(--text)}
.resultInlineMetric:last-child strong{color:var(--resultColor)}
.resultLive{
  font-weight:900;
}
@media(max-height:820px) and (min-width:901px){
  .resultCompact{padding:15px;gap:11px}
  .resultCompactScore strong{font-size:52px}
  .resultStatusCard{min-height:54px;padding:9px 10px}
  .resultTrend,.resultInlineMetric{min-height:68px;padding:9px 10px}
  .resultTrend strong,.resultInlineMetric strong{font-size:18px;margin-top:4px}
  .resultTrend small,.resultInlineMetric small{display:none}
}
@media(max-width:900px){
  .resultCompactBottom{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:620px){
  .resultCompactBottom{grid-template-columns:1fr 1fr}
  .resultTrend{grid-column:1/-1}
  .resultTrend,.resultInlineMetric{min-height:76px}
}
@media(max-width:420px){
  .resultCompactBottom{grid-template-columns:1fr}
  .resultTrend{grid-column:auto}
}


/* ===== V15: увеличенный график смен ===== */
.chartPanel .chartViewport{
  min-height:250px;
  margin-top:10px;
}
.chartPanel .chartViewport svg{
  width:100%;
  height:100%;
}
#mastersChart text{
  font-family:Inter,Arial,sans-serif;
}
#mastersChart .chartValue{
  filter:drop-shadow(0 2px 3px rgba(255,255,255,.9));
}
@media(min-width:1200px){
  .chartPanel{grid-template-rows:auto minmax(245px,1fr) auto auto}
}
@media(max-height:760px) and (min-width:901px){
  .chartPanel{grid-template-rows:auto minmax(205px,1fr) auto auto}
  .chartPanel .chartViewport{min-height:205px}
}
@media(max-width:900px){
  .chartPanel .chartViewport{height:380px;min-height:380px}
}
@media(max-width:620px){
  .chartPanel .chartViewport{height:340px;min-height:340px}
}

/* ===== V16: ровная компоновка карточек смен ===== */
.shiftResultsHead{
  align-items:center;
  min-height:28px;
  margin:10px 0 10px;
  padding:10px 0 0;
}
.shiftResultsHead span{
  line-height:1.2;
  white-space:nowrap;
}
.shiftResultsHead small{
  line-height:1.25;
  text-align:right;
}
.shiftResultsGrid{
  gap:12px;
}
.shiftResultCard{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:
    "crew percent"
    "status status"
    "progress progress";
  grid-template-rows:auto auto 5px;
  align-items:center;
  column-gap:18px;
  row-gap:8px;
  min-height:0;
  padding:12px 14px 10px 17px;
}
.shiftCrew{
  grid-area:crew;
  min-width:0;
  align-self:center;
}
.shiftCrew span{
  font-size:9px;
  line-height:1.1;
  letter-spacing:.1em;
}
.shiftCrew strong{
  margin-top:5px;
  font-size:14px;
  line-height:1.2;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}
.shiftPercent{
  grid-area:percent;
  align-self:center;
  justify-self:end;
  min-width:82px;
  font-size:25px;
  line-height:1;
  text-align:right;
}
.shiftStatus{
  grid-area:status;
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr);
  align-items:center;
  gap:7px;
  width:100%;
  min-width:0;
  margin:0;
  padding:7px 9px;
}
.shiftStatus strong{
  font-size:11px;
  line-height:1.15;
  white-space:nowrap;
}
.shiftStatus span{
  display:block;
  max-width:none;
  min-width:0;
  margin-left:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  text-align:right;
}
.shiftProgress{
  grid-area:progress;
  width:100%;
  margin:0;
}
.shiftNumbers,.shiftResultTop{display:contents}

@media(max-width:1200px){
  .shiftStatus span{display:block}
}
@media(max-width:900px){
  .shiftResultsHead{
    align-items:flex-start;
    margin-top:12px;
  }
  .shiftResultsHead small{text-align:left}
  .shiftResultCard{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:
      "crew percent"
      "status status"
      "progress progress";
  }
  .shiftStatus{grid-column:auto;grid-row:auto;justify-self:stretch}
  .shiftPercent{grid-column:auto;grid-row:auto}
  .shiftProgress{grid-row:auto}
}
@media(max-width:560px){
  .shiftResultCard{
    column-gap:10px;
    padding:11px 12px 9px 15px;
  }
  .shiftCrew strong{font-size:13px}
  .shiftPercent{min-width:68px;font-size:22px}
  .shiftStatus{
    grid-template-columns:auto minmax(0,1fr);
  }
  .shiftStatus span{
    grid-column:1/-1;
    padding-left:14px;
    text-align:left;
    white-space:normal;
  }
}


/* ===== V17: финальная геометрия без наложений ===== */
.chartPanel{
  display:grid !important;
  grid-template-rows:auto minmax(190px,1fr) auto !important;
  gap:12px !important;
  overflow:hidden !important;
}
.chartPanel .panelHead{
  min-height:44px;
}
.chartPanel .chartViewport{
  min-height:190px !important;
  height:auto !important;
  margin:0 !important;
  overflow:hidden !important;
}
.shiftResultsHead{
  display:none !important;
}
.shiftResultsGrid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:12px !important;
  align-self:end !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
.shiftResultCard{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-areas:
    "crew percent"
    "status status"
    "progress progress" !important;
  grid-template-rows:auto auto 5px !important;
  column-gap:14px !important;
  row-gap:7px !important;
  min-height:92px !important;
  height:auto !important;
  margin:0 !important;
  padding:11px 14px 10px 17px !important;
  overflow:hidden !important;
}
.shiftCrew{
  grid-area:crew !important;
  min-width:0 !important;
}
.shiftCrew span{
  display:block !important;
  font-size:8px !important;
  line-height:1 !important;
  letter-spacing:.11em !important;
}
.shiftCrew strong{
  display:block !important;
  margin-top:5px !important;
  font-size:13px !important;
  line-height:1.18 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.shiftPercent{
  grid-area:percent !important;
  align-self:center !important;
  justify-self:end !important;
  min-width:76px !important;
  font-size:25px !important;
  line-height:1 !important;
  text-align:right !important;
}
.shiftStatus{
  grid-area:status !important;
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
  padding:6px 8px !important;
}
.shiftStatus strong{
  flex:0 0 auto !important;
  font-size:10px !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
.shiftStatus span{
  min-width:0 !important;
  margin-left:auto !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  text-align:right !important;
  font-size:10px !important;
}
.shiftProgress{
  grid-area:progress !important;
  width:100% !important;
  height:5px !important;
  margin:0 !important;
}
.shiftNumbers,.shiftResultTop{
  display:contents !important;
}
@media(max-height:720px) and (min-width:901px){
  .chartPanel{
    grid-template-rows:auto minmax(170px,1fr) auto !important;
    gap:9px !important;
  }
  .chartPanel .chartViewport{min-height:170px !important}
  .shiftResultCard{
    min-height:78px !important;
    padding:8px 11px 8px 15px !important;
    row-gap:5px !important;
  }
  .shiftCrew strong{font-size:12px !important}
  .shiftPercent{font-size:22px !important}
  .shiftStatus{padding:5px 7px !important}
}
@media(max-width:900px){
  .chartPanel{
    grid-template-rows:auto 340px auto !important;
    overflow:visible !important;
  }
  .shiftResultsGrid{
    grid-template-columns:1fr !important;
  }
}
@media(max-width:560px){
  .chartPanel{grid-template-rows:auto 310px auto !important}
  .shiftResultCard{
    min-height:88px !important;
    grid-template-columns:minmax(0,1fr) auto !important;
  }
  .shiftCrew strong{
    white-space:normal !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
  }
  .shiftStatus span{
    white-space:normal !important;
    text-align:left !important;
  }
}

/* ===== V18: телевизионные слайды и сезонный отчёт ===== */
.dashboardCarousel{position:relative;width:100%;height:100vh;overflow:hidden}
.dashboardSlide{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;transform:translateX(4%);transition:opacity .7s ease,transform .85s cubic-bezier(.22,.8,.24,1),visibility .7s}
.dashboardSlide.is-active{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(0);z-index:2}
.dashboardSlide .dashboardShell{height:100%;width:100%}
.slideNavigator{position:fixed;z-index:45;left:50%;bottom:14px;transform:translateX(-50%);display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid rgba(28,73,47,.12);border-radius:999px;background:rgba(255,255,255,.78);box-shadow:0 10px 28px rgba(31,78,50,.11);backdrop-filter:blur(14px)}
.slideDot{width:10px;height:10px;padding:0;border:0;border-radius:50%;background:#c8d7ce;cursor:pointer;transition:width .28s ease,background .28s ease,transform .2s ease}
.slideDot:hover{transform:scale(1.15)}
.slideDot.is-active{width:31px;border-radius:999px;background:var(--green)}
.slideEdgeArrow{position:fixed;z-index:50;top:50%;width:52px;height:96px;padding:0;border:1px solid rgba(28,73,47,.12);border-radius:18px;background:rgba(255,255,255,.72);color:#1e5035;box-shadow:0 12px 34px rgba(31,78,50,.13);backdrop-filter:blur(14px);cursor:pointer;transform:translateY(-50%);transition:background .2s ease,transform .2s ease,box-shadow .2s ease,opacity .2s ease}
.slideEdgeArrow span{display:block;font-size:54px;line-height:.8;font-weight:300;transform:translateY(-2px)}
.slideEdgeArrow--prev{left:10px}
.slideEdgeArrow--next{right:10px}
.slideEdgeArrow:hover{background:rgba(255,255,255,.96);box-shadow:0 17px 42px rgba(31,78,50,.18)}
.slideEdgeArrow--prev:hover{transform:translateY(-50%) translateX(-2px)}
.slideEdgeArrow--next:hover{transform:translateY(-50%) translateX(2px)}
.slideEdgeArrow:active{transform:translateY(-50%) scale(.96)}
@media(max-width:900px){.slideEdgeArrow{width:42px;height:76px;border-radius:15px;opacity:.9}.slideEdgeArrow span{font-size:44px}.slideEdgeArrow--prev{left:5px}.slideEdgeArrow--next{right:5px}}

.seasonShell{position:relative;z-index:1;width:100%;height:100vh;max-width:1920px;margin:0 auto;padding:22px 28px 34px;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:16px}
.seasonHeader{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px}
.seasonBrand{display:flex;align-items:center;gap:18px;min-width:0}
.seasonLogo{width:78px;height:78px;display:grid;place-items:center;flex:0 0 auto;padding:9px;border:1px solid var(--line);border-radius:21px;background:#fff;box-shadow:var(--shadow)}
.seasonLogo img{width:100%;height:100%;object-fit:contain}
.seasonBrand h2{margin:5px 0 4px;font-size:clamp(29px,2.5vw,46px);line-height:1.02;letter-spacing:-.035em}
.seasonBrand p{margin:0;color:var(--muted);font-size:15px;font-weight:750}
.seasonTotalCard{min-width:285px;padding:15px 20px;border:1px solid rgba(224,165,26,.24);border-radius:21px;background:linear-gradient(135deg,#fff9e7,#fff);box-shadow:0 15px 36px rgba(160,112,12,.10);text-align:right}
.seasonTotalCard span,.seasonTotalCard small{display:block;color:#7c6d49;font-size:11px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.seasonTotalCard strong{display:block;margin:5px 0 3px;color:#a96f00;font-size:clamp(30px,2.8vw,48px);line-height:1;font-weight:1000;font-variant-numeric:tabular-nums}
.seasonTotalCard small{text-transform:none;letter-spacing:0}
.seasonReportPanel{min-height:0;display:flex;flex-direction:column;padding:20px 22px 18px;border:1px solid var(--line);border-radius:25px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(248,252,249,.96));box-shadow:var(--shadow);overflow:hidden}
.seasonPanelHead{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.seasonPanelHead h3{margin:4px 0 0;font-size:24px;letter-spacing:-.02em}
.seasonReportNote{max-width:360px;padding:9px 12px;border-radius:12px;background:#f2f7f4;color:var(--muted);font-size:11px;font-weight:750;text-align:right}
.seasonBars{flex:1;min-height:0;display:grid;align-content:center;gap:clamp(10px,1.5vh,18px);padding:12px 4px 4px}
.seasonBarRow{display:grid;grid-template-columns:minmax(240px,29%) minmax(0,1fr) 62px;align-items:center;gap:18px;opacity:0;transform:translateY(12px);animation:seasonRowIn .55s ease forwards;animation-delay:var(--rowDelay)}
.seasonMasterInfo{min-width:0;display:grid;grid-template-columns:36px minmax(0,1fr);align-items:center;gap:11px}
.seasonMasterInfo>span{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:color-mix(in srgb,var(--barColor) 13%,#fff);color:var(--barColor);font-size:14px;font-weight:1000}
.seasonMasterInfo strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:clamp(14px,1.12vw,20px);font-weight:950}
.seasonMasterInfo small{display:block;margin-top:3px;color:var(--muted);font-size:10px;font-weight:750}
.seasonBarTrack{height:clamp(44px,6vh,70px);overflow:hidden;border-radius:0 13px 13px 0;background:linear-gradient(90deg,rgba(28,73,47,.045),rgba(28,73,47,.015));box-shadow:inset 0 0 0 1px rgba(28,73,47,.07);position:relative}
.seasonBarTrack::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(20% - 1px),rgba(28,73,47,.09) calc(20% - 1px),rgba(28,73,47,.09) 20%);pointer-events:none}
.seasonBarFill{position:relative;width:0;height:100%;min-width:7%;display:flex;align-items:center;justify-content:flex-end;padding:0 16px;border-radius:0 12px 12px 0;background:linear-gradient(90deg,color-mix(in srgb,var(--barColor) 88%,#fff),var(--barColor));box-shadow:0 8px 20px color-mix(in srgb,var(--barColor) 22%,transparent);transition:width 1.1s cubic-bezier(.2,.8,.25,1)}
.seasonBarFill::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 0,rgba(255,255,255,.22) 48%,transparent 58%);transform:translateX(-120%);animation:seasonBarShine 4s ease-in-out infinite}
.seasonBarValue{position:relative;z-index:1;color:#fff;font-size:clamp(15px,1.35vw,25px);font-weight:1000;font-variant-numeric:tabular-nums;text-shadow:0 1px 3px rgba(0,0,0,.18)}
.seasonShare{color:var(--barColor);font-size:clamp(15px,1.2vw,22px);font-weight:1000;text-align:right;font-variant-numeric:tabular-nums}
.seasonEmpty{margin:auto;padding:24px;color:var(--muted);font-size:18px;font-weight:850;text-align:center}
.seasonFooter{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 4px;color:var(--muted);font-size:12px;font-weight:750}
@keyframes seasonRowIn{to{opacity:1;transform:none}}
@keyframes seasonBarShine{0%,65%{transform:translateX(-120%)}100%{transform:translateX(120%)}}

@media(max-height:800px) and (min-width:901px){
  .seasonShell{padding-top:14px;gap:10px}
  .seasonLogo{width:64px;height:64px}
  .seasonBrand h2{font-size:32px}
  .seasonTotalCard{padding:10px 16px}
  .seasonReportPanel{padding:14px 18px}
  .seasonPanelHead{padding-bottom:9px}
  .seasonBars{gap:8px;padding-top:8px}
  .seasonBarTrack{height:42px}
}
@media(max-width:900px){
  body{overflow:auto}
  .dashboardCarousel{height:auto;min-height:100vh;overflow:visible}
  .dashboardSlide{position:relative;display:none;transform:none}
  .dashboardSlide.is-active{display:block}
  .seasonShell{height:auto;min-height:100vh;padding:15px 14px 70px}
  .seasonHeader{grid-template-columns:1fr}
  .seasonTotalCard{text-align:left;min-width:0}
  .seasonPanelHead{display:block}
  .seasonReportNote{margin-top:10px;max-width:none;text-align:left}
  .seasonBarRow{grid-template-columns:1fr 58px;gap:8px 12px}
  .seasonMasterInfo{grid-column:1/-1}
  .seasonBarTrack{height:46px}
  .slideNavigator{bottom:10px}
}
@media(max-width:520px){
  .seasonBrand{align-items:flex-start}
  .seasonLogo{width:62px;height:62px}
  .seasonBrand h2{font-size:26px}
  .seasonReportPanel{padding:15px 13px}
  .seasonPanelHead h3{font-size:20px}
  .seasonMasterInfo strong{font-size:14px}
}
@media(prefers-reduced-motion:reduce){
  .dashboardSlide,.seasonBarRow,.seasonBarFill{transition:none!important;animation:none!important}
  .seasonBarRow{opacity:1;transform:none}
  .seasonBarFill::after{display:none}
}


/* ===== V21: компактные боковые стрелки без нижнего переключателя ===== */
.slideNavigator{display:none!important}
.slideEdgeArrow{
  top:50%;
  width:34px;
  height:68px;
  border-color:rgba(28,73,47,.10);
  background:rgba(255,255,255,.82);
  color:#245c3d;
  box-shadow:0 8px 24px rgba(31,78,50,.11);
  backdrop-filter:blur(12px);
  opacity:.82;
}
.slideEdgeArrow span{font-size:38px;line-height:1;font-weight:500;transform:translateY(-1px)}
.slideEdgeArrow--prev{left:0;border-radius:0 14px 14px 0;border-left:0}
.slideEdgeArrow--next{right:0;border-radius:14px 0 0 14px;border-right:0}
.slideEdgeArrow:hover{opacity:1;background:#fff;box-shadow:0 11px 30px rgba(31,78,50,.16)}
.slideEdgeArrow--prev:hover{transform:translateY(-50%) translateX(1px)}
.slideEdgeArrow--next:hover{transform:translateY(-50%) translateX(-1px)}
@media(max-width:900px){
  .slideEdgeArrow{width:30px;height:58px;opacity:.76}
  .slideEdgeArrow span{font-size:33px}
  .slideEdgeArrow--prev{left:0}
  .slideEdgeArrow--next{right:0}
}

/* ===== V28: отдельные полноэкранные дашборды подразделений ===== */
.departmentDynamicSlide{background:linear-gradient(135deg,#edf7f0 0%,#f8fbf9 54%,#fbf6e7 100%)}
.departmentDashboardShell{width:100%;height:100vh;min-height:680px;padding:clamp(16px,1.4vw,28px);display:grid;grid-template-rows:auto auto minmax(0,1fr) auto;gap:clamp(12px,1.2vw,20px);overflow:hidden}
.departmentDashboardHeader{display:flex;align-items:center;justify-content:space-between;gap:24px}
.departmentBrand{display:flex;align-items:center;gap:18px;min-width:0}
.departmentLogo{width:clamp(64px,5.2vw,92px);height:clamp(64px,5.2vw,92px);padding:10px;border-radius:22px;background:#fff;box-shadow:0 14px 36px rgba(27,76,47,.12);display:grid;place-items:center;flex:0 0 auto}
.departmentLogo img{max-width:100%;max-height:100%;display:block}
.departmentBrand h2{margin:3px 0 4px;font-size:clamp(30px,2.65vw,54px);line-height:1;font-weight:1000;color:#153426;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.departmentBrand p{margin:0;color:#6c7d74;font-size:clamp(13px,1vw,18px);font-weight:750}
.departmentOnline{display:flex;align-items:center;gap:8px;padding:10px 15px;border:1px solid rgba(31,114,70,.12);border-radius:999px;background:rgba(255,255,255,.86);color:#476459;font-weight:900;box-shadow:0 8px 22px rgba(28,73,47,.08)}
.departmentOnline i{width:9px;height:9px;border-radius:50%;background:#41bb78;box-shadow:0 0 0 6px rgba(65,187,120,.12)}
.departmentMetricGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(10px,1vw,16px)}
.departmentMetricGrid article{min-width:0;padding:clamp(14px,1.2vw,22px);border:1px solid rgba(30,76,48,.1);border-radius:22px;background:rgba(255,255,255,.88);box-shadow:0 14px 34px rgba(27,76,47,.08);position:relative;overflow:hidden}
.departmentMetricGrid article::after{content:"";position:absolute;right:-25px;top:-35px;width:100px;height:100px;border-radius:50%;background:color-mix(in srgb,var(--departmentAccent) 9%,transparent)}
.departmentMetricGrid span{display:block;color:#718078;font-size:clamp(11px,.8vw,14px);font-weight:900}
.departmentMetricGrid strong{display:block;margin-top:5px;color:#173629;font-size:clamp(30px,2.3vw,48px);line-height:1;font-weight:1000;font-variant-numeric:tabular-nums}
.departmentMetricGrid small{display:block;margin-top:7px;color:#75857d;font-size:clamp(10px,.7vw,13px);font-weight:750}
.departmentMetricGrid article.bad strong{color:#d74f48}.departmentMetricGrid article.mid strong{color:#c78905}.departmentMetricGrid article.good strong{color:#248a57}.departmentMetricGrid article.over strong{color:#286bb4}
.departmentMainGrid{min-height:0;display:grid;grid-template-columns:minmax(0,2.35fr) minmax(310px,.95fr);gap:clamp(12px,1.1vw,20px)}
.departmentPanel{min-height:0;border:1px solid rgba(30,76,48,.1);border-radius:24px;background:rgba(255,255,255,.9);box-shadow:0 16px 40px rgba(27,76,47,.09);overflow:hidden}
.departmentChartPanel{padding:clamp(15px,1.25vw,23px);display:grid;grid-template-rows:auto minmax(180px,1fr) auto;gap:12px}
.departmentPanelHead{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.departmentPanelHead h3{margin:3px 0 0;font-size:clamp(20px,1.5vw,30px);line-height:1.1;font-weight:1000;color:#173629}
.departmentLegend{display:flex;align-items:center;gap:16px;color:#718078;font-size:12px;font-weight:850}.departmentLegend span{display:flex;align-items:center;gap:7px}.departmentLegend i{width:11px;height:11px;border-radius:3px;background:#d7e2dc}.departmentLegend span:last-child i{background:var(--departmentAccent)}
.departmentChart{min-height:0;display:flex;align-items:flex-end;justify-content:space-around;gap:20px;padding:20px 16px 0;border-bottom:1px solid rgba(29,75,47,.11);background:repeating-linear-gradient(to top,transparent 0,transparent calc(25% - 1px),rgba(29,75,47,.075) calc(25% - 1px),rgba(29,75,47,.075) 25%)}
.departmentChartGroup{height:100%;min-width:100px;flex:1;max-width:210px;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:8px;text-align:center}
.departmentBars{height:100%;min-height:150px;display:flex;align-items:flex-end;justify-content:center;gap:8px;position:relative}.departmentBars i{width:min(34%,52px);min-height:3px;border-radius:10px 10px 3px 3px;display:block}.departmentBars .plan{background:#d7e2dc}.departmentBars .fact{background:linear-gradient(180deg,color-mix(in srgb,var(--departmentAccent) 80%,#fff),var(--departmentAccent))}.departmentBars b{position:absolute;top:4px;left:50%;transform:translateX(-50%);font-size:clamp(13px,1vw,18px);font-weight:1000;color:#274537}
.departmentChartGroup>span{min-height:34px;color:#294438;font-size:clamp(11px,.78vw,14px);line-height:1.2;font-weight:900;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.departmentShiftGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.departmentShiftCard{padding:11px 13px;border:1px solid rgba(29,75,47,.1);border-left:4px solid #d3a023;border-radius:15px;background:#fffdf8}.departmentShiftCard.bad{border-left-color:#df5149;background:#fffafa}.departmentShiftCard.good{border-left-color:#2eaf68;background:#f9fffb}.departmentShiftCard.over{border-left-color:#2468b2;background:#f8fbff}
.departmentShiftTop,.departmentShiftMeta{display:flex;align-items:center;justify-content:space-between;gap:12px}.departmentShiftTop span{display:block;color:#849189;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.departmentShiftTop strong{display:block;margin-top:2px;font-size:12px;font-weight:950;color:#203a2f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.departmentShiftTop b{font-size:22px;font-weight:1000;color:#c68b0c}.departmentShiftCard.bad .departmentShiftTop b{color:#dc514a}.departmentShiftCard.good .departmentShiftTop b{color:#278e5a}.departmentShiftCard.over .departmentShiftTop b{color:#286fb8}
.departmentShiftMeta{margin-top:7px;color:#66786f;font-size:10px;font-weight:850}.departmentShiftBar{height:5px;margin-top:8px;border-radius:999px;background:#edf1ef;overflow:hidden}.departmentShiftBar i{height:100%;display:block;border-radius:inherit;background:#d09a18}.departmentShiftCard.bad .departmentShiftBar i{background:#dd544d}.departmentShiftCard.good .departmentShiftBar i{background:#2da966}.departmentShiftCard.over .departmentShiftBar i{background:#2f75bd}
.departmentResultPanel{padding:clamp(17px,1.5vw,28px);display:flex;flex-direction:column;justify-content:space-between;--result:#d45149;background:linear-gradient(145deg,#fff,rgba(255,247,246,.95))}.departmentResultPanel.mid{--result:#cd900b;background:linear-gradient(145deg,#fff,#fffaf0)}.departmentResultPanel.good{--result:#278f59;background:linear-gradient(145deg,#fff,#f5fff9)}.departmentResultPanel.over{--result:#286eb7;background:linear-gradient(145deg,#fff,#f4f8ff)}
.departmentBigPercent{display:block;margin:clamp(18px,3vh,38px) 0 12px;color:#173629;font-size:clamp(72px,7vw,138px);line-height:.8;font-weight:1000;letter-spacing:-.07em;font-variant-numeric:tabular-nums}
.departmentScale{height:14px;border-radius:999px;background:#e8efeb;overflow:hidden}.departmentScale i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--result) 55%,#fff),var(--result));box-shadow:0 5px 15px color-mix(in srgb,var(--result) 25%,transparent)}
.departmentResultStats{display:grid;grid-template-columns:1fr;gap:9px;margin-top:20px}.departmentResultStats div{padding:12px 14px;border:1px solid rgba(29,75,47,.1);border-radius:14px;background:rgba(255,255,255,.76)}.departmentResultStats span{display:block;color:#7a8981;font-size:10px;font-weight:900}.departmentResultStats b{display:block;margin-top:3px;color:#203a2f;font-size:clamp(18px,1.35vw,25px);font-weight:1000}
.departmentEmpty{width:100%;display:grid;place-items:center;color:#7b8b82;font-size:15px;font-weight:850;text-align:center}
.departmentFooter{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 4px;color:#6d7e75;font-size:12px;font-weight:800}
@media(max-height:820px) and (min-width:901px){.departmentDashboardShell{padding:14px 20px;gap:10px}.departmentLogo{width:62px;height:62px}.departmentBrand h2{font-size:34px}.departmentMetricGrid article{padding:12px 16px}.departmentMetricGrid strong{font-size:32px}.departmentChartPanel{padding:13px 16px}.departmentBigPercent{font-size:78px;margin:14px 0 8px}.departmentShiftCard{padding:8px 10px}.departmentShiftTop b{font-size:18px}}
@media(max-width:900px){.departmentDashboardShell{height:auto;min-height:100vh;padding:15px 14px 70px;overflow:visible}.departmentDashboardHeader{align-items:flex-start}.departmentBrand h2{white-space:normal}.departmentMetricGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.departmentMainGrid{grid-template-columns:1fr}.departmentChart{min-height:300px}.departmentShiftGrid{grid-template-columns:1fr}.departmentResultStats{grid-template-columns:repeat(3,minmax(0,1fr))}.departmentFooter{flex-wrap:wrap}}
@media(max-width:560px){.departmentDashboardHeader{display:block}.departmentOnline{margin-top:12px;width:max-content}.departmentBrand{align-items:flex-start}.departmentLogo{width:58px;height:58px;border-radius:16px}.departmentBrand h2{font-size:25px}.departmentMetricGrid{grid-template-columns:1fr 1fr}.departmentMetricGrid article{padding:13px}.departmentMetricGrid strong{font-size:28px}.departmentChart{overflow-x:auto;justify-content:flex-start}.departmentChartGroup{min-width:130px}.departmentResultStats{grid-template-columns:1fr}.departmentBigPercent{font-size:72px}}
.dashboardSlide.is-monitor-disabled{display:none!important}

/* ===== V29: устойчивый вертикальный layout без наложений ===== */
@media (min-width: 901px){
  .dashboardShell{
    height:100dvh !important;
    min-height:680px;
    display:flex !important;
    flex-direction:column;
    gap:clamp(9px,1.05vh,15px) !important;
    padding:clamp(14px,1.25vw,22px) clamp(18px,1.5vw,28px) clamp(13px,1.1vw,20px) !important;
    overflow:hidden;
  }
  .dashboardHeader,
  .dataNotice,
  .metricGrid,
  .rankingPanel{
    flex:0 0 auto;
  }
  .dashboardMain{
    flex:1 1 auto;
    min-height:300px !important;
    height:auto !important;
    overflow:hidden;
  }
  .metricCard{
    min-height:clamp(82px,9.6vh,106px) !important;
    padding:clamp(12px,1.15vh,17px) 18px !important;
  }
  .metricCard strong{
    font-size:clamp(28px,2.05vw,40px) !important;
  }
  .dataNotice{
    min-height:0;
    padding:9px 15px !important;
  }
  .chartPanel,
  .progressPanel{
    height:100%;
    min-height:0 !important;
  }
  .chartPanel{
    display:grid !important;
    grid-template-rows:auto minmax(150px,1fr) auto !important;
    gap:9px !important;
    overflow:hidden !important;
  }
  .chartPanel .chartViewport{
    min-height:150px !important;
    height:auto !important;
    margin:0 !important;
    overflow:hidden !important;
  }
  .shiftResultsGrid{
    min-height:0 !important;
    margin:0 !important;
  }
  .rankingPanel{
    min-height:96px;
    padding:11px 16px 13px !important;
    overflow:hidden;
  }
  .rankingGrid{
    margin-top:8px !important;
  }

  .departmentDashboardShell{
    height:100dvh !important;
    min-height:680px;
    display:flex !important;
    flex-direction:column;
    gap:clamp(9px,1.05vh,15px) !important;
    padding:clamp(14px,1.25vw,22px) clamp(18px,1.5vw,28px) clamp(13px,1.1vw,20px) !important;
    overflow:hidden !important;
  }
  .departmentDashboardHeader,
  .departmentMetricGrid,
  .departmentFooter{
    flex:0 0 auto;
  }
  .departmentMainGrid{
    flex:1 1 auto;
    height:auto !important;
    min-height:300px !important;
    overflow:hidden;
  }
  .departmentChartPanel,
  .departmentResultPanel{
    height:100%;
    min-height:0 !important;
  }
  .departmentChartPanel{
    grid-template-rows:auto minmax(150px,1fr) auto !important;
    gap:9px !important;
    overflow:hidden !important;
  }
  .departmentChart{
    min-height:150px !important;
    overflow:hidden;
  }
}

@media (min-width:901px) and (max-height:900px){
  .dashboardShell,
  .departmentDashboardShell{
    gap:8px !important;
    padding-top:11px !important;
    padding-bottom:10px !important;
  }
  .dashboardHeader .logoFrame{width:62px;height:62px;border-radius:17px}
  .brandBlock h1{font-size:30px !important;margin:3px 0 4px}
  .clockBox strong{font-size:30px}
  .dataNotice{padding:7px 13px !important}
  .metricCard{min-height:76px !important;padding:10px 15px !important}
  .metricIcon{width:40px;height:40px;border-radius:12px}
  .metricCard strong{font-size:30px !important;margin:4px 0 3px}
  .metricCard small{font-size:10px}
  .dashboardMain{min-height:270px !important}
  .chartPanel,.progressPanel{padding:13px 15px !important}
  .panelHead h2{font-size:18px}
  .shiftResultCard{min-height:70px !important}
  .rankingPanel{min-height:82px;padding:8px 14px 10px !important}
  .rankingPanel .panelHead h2{font-size:18px}
  .rankCard{padding:7px 10px}

  .departmentLogo{width:58px !important;height:58px !important;border-radius:16px}
  .departmentBrand h2{font-size:32px !important}
  .departmentMetricGrid article{padding:10px 14px !important;border-radius:17px}
  .departmentMetricGrid strong{font-size:30px !important}
  .departmentMainGrid{min-height:270px !important}
  .departmentChartPanel,.departmentResultPanel{padding:12px 15px !important}
  .departmentBigPercent{font-size:72px !important;margin:10px 0 7px !important}
  .departmentShiftCard{padding:7px 9px !important}
}

@media (min-width:901px) and (max-height:740px){
  .dataNotice span,
  .metricCard small,
  .rankingPanel .updatedText,
  .departmentMetricGrid small{
    display:none !important;
  }
  .dataNotice{padding:6px 12px !important}
  .metricCard{min-height:66px !important}
  .dashboardMain,.departmentMainGrid{min-height:235px !important}
  .rankingPanel{min-height:70px}
  .rankingGrid{margin-top:5px !important}
  .rankCard{min-height:42px}
}

/* ===== V37: точные данные монитора и читаемые сезонные слайды ===== */
.departmentBars i{
  transition:height 1.05s cubic-bezier(.2,.82,.22,1);
}
.departmentShiftCard{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .45s ease,transform .55s cubic-bezier(.2,.82,.22,1),box-shadow .25s ease;
}
.departmentShiftCard.is-in{opacity:1;transform:none}
.departmentShiftCard.is-in:hover{box-shadow:0 10px 26px rgba(28,73,47,.10)}
.departmentScale i{transition:width 1.05s cubic-bezier(.2,.82,.22,1)}
.departmentResultStats{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.departmentResultStats div{min-width:0}
.departmentResultStats b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Подпись сезонной строки теперь всегда находится над полосой и не может
   уехать за левую границу экрана. */
.seasonBars{
  align-content:start;
  overflow:hidden;
  padding:14px 2px 4px;
}
.seasonBarRow{
  display:grid;
  grid-template-columns:minmax(0,1fr) 78px;
  grid-template-areas:
    "info share"
    "track track";
  gap:8px 16px;
  min-width:0;
  padding:10px 12px 12px;
  border:1px solid rgba(28,73,47,.08);
  border-radius:16px;
  background:rgba(255,255,255,.76);
  box-shadow:0 8px 22px rgba(28,73,47,.055);
}
.seasonMasterInfo{
  grid-area:info;
  min-width:0;
  display:flex;
  align-items:center;
  gap:11px;
}
.seasonMasterInfo>span{flex:0 0 34px}
.seasonMasterInfo>div{min-width:0}
.seasonMasterInfo strong{
  display:block;
  max-width:100%;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  font-size:clamp(14px,1.1vw,20px);
  line-height:1.15;
}
.seasonMasterInfo small{
  display:block;
  margin-top:3px;
  white-space:normal;
  overflow-wrap:anywhere;
}
.seasonShare{
  grid-area:share;
  align-self:center;
  text-align:right;
}
.seasonBarTrack{
  grid-area:track;
  width:100%;
  min-width:0;
  height:clamp(38px,5.4vh,58px);
  border-radius:12px;
}
.seasonBarFill{border-radius:12px}

@media (min-width:901px) and (max-height:820px){
  .seasonBarRow{padding:7px 10px 9px;gap:6px 12px}
  .seasonBarTrack{height:38px}
  .seasonMasterInfo>span{width:30px;height:30px;flex-basis:30px}
  .seasonMasterInfo strong{font-size:14px}
  .seasonMasterInfo small{font-size:9px}
  .departmentResultStats{gap:7px;margin-top:10px}
  .departmentResultStats div{padding:8px 10px}
}
@media(max-width:900px){
  .seasonBarRow{
    grid-template-columns:minmax(0,1fr) 62px;
    grid-template-areas:"info share" "track track";
    padding:10px;
  }
  .seasonMasterInfo{grid-column:auto}
  .departmentResultStats{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){
  .seasonBarRow{grid-template-columns:minmax(0,1fr) 52px;gap:7px 9px}
  .seasonMasterInfo>span{display:none}
  .seasonShare{font-size:14px}
  .departmentResultStats{grid-template-columns:1fr}
}

/* ===== V41: Birthday celebration slide ===== */
.birthdayDynamicSlide{overflow:hidden;background:#fff7ef;color:#2a2030}
.birthdaySlideShell{position:relative;width:100%;height:100%;min-height:100vh;padding:clamp(22px,2.2vw,44px);overflow:hidden;background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.9),transparent 28%),linear-gradient(135deg,#fff6e9 0%,#ffe6ee 45%,#ecf6ff 100%);isolation:isolate}
.birthdayTheme-gold .birthdaySlideShell{background:radial-gradient(circle at 20% 20%,rgba(255,255,255,.94),transparent 30%),linear-gradient(135deg,#fff8df,#f8e5ad 52%,#fff8e7)}
.birthdayTheme-sky .birthdaySlideShell{background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.94),transparent 30%),linear-gradient(135deg,#eff8ff,#d9edff 55%,#eef4ff)}
.birthdayTheme-berry .birthdaySlideShell{background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.86),transparent 28%),linear-gradient(135deg,#fff1f7,#f8d8e8 52%,#eee4ff)}
.birthdayTheme-mint .birthdaySlideShell{background:radial-gradient(circle at 18% 20%,rgba(255,255,255,.92),transparent 30%),linear-gradient(135deg,#effbf5,#d7f3e4 54%,#f5fff9)}
.birthdayAura{position:absolute;border-radius:50%;filter:blur(2px);opacity:.5;z-index:-1;animation:birthdayFloat 8s ease-in-out infinite}
.birthdayAuraOne{width:42vw;height:42vw;left:-12vw;bottom:-20vw;background:radial-gradient(circle,rgba(255,153,91,.38),transparent 67%)}
.birthdayAuraTwo{width:38vw;height:38vw;right:-10vw;top:-17vw;background:radial-gradient(circle,rgba(126,147,255,.3),transparent 68%);animation-delay:-3s}
.birthdaySlideHeader{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:3}
.birthdaySlideHeader>span{padding:10px 16px;border:1px solid rgba(83,59,70,.13);border-radius:999px;background:rgba(255,255,255,.55);backdrop-filter:blur(10px);font-size:clamp(12px,1vw,17px);font-weight:900;color:#67505f}
.birthdayCompanyLogo{width:clamp(150px,13vw,250px);height:clamp(52px,5vw,82px);display:flex;align-items:center}.birthdayCompanyLogo img{width:100%;height:100%;object-fit:contain;object-position:left center}
.birthdayHero{position:relative;z-index:2;display:grid;grid-template-columns:minmax(350px,.9fr) minmax(520px,1.2fr);gap:clamp(36px,5vw,100px);align-items:center;max-width:1680px;height:calc(100vh - clamp(150px,14vw,225px));margin:0 auto;padding:clamp(10px,2vw,36px) 2vw}
.birthdayPhotoStage{position:relative;display:grid;place-items:center;min-width:0;transform:translateY(24px) scale(.94);opacity:0;transition:1s cubic-bezier(.2,.8,.2,1)}
.birthdayPhotoRing{position:absolute;width:min(37vw,620px);aspect-ratio:1;border-radius:48% 52% 45% 55% / 54% 44% 56% 46%;background:linear-gradient(135deg,#ff9d6c,#e76ca8 45%,#6c93ef);filter:drop-shadow(0 28px 50px rgba(107,63,91,.2));animation:birthdayBlob 9s ease-in-out infinite}
.birthdayPhoto{position:relative;width:min(33vw,560px);aspect-ratio:4/5;border:10px solid rgba(255,255,255,.85);border-radius:44% 44% 34% 34% / 28% 28% 18% 18%;overflow:hidden;background:linear-gradient(145deg,#fff,#f6dfea);box-shadow:0 30px 70px rgba(75,45,65,.22);display:grid;place-items:center}
.birthdayPhoto img{width:100%;height:100%;object-fit:cover;object-position:center}
.birthdayInitials{font-size:clamp(80px,10vw,180px);font-weight:950;color:#d96b95;text-shadow:0 8px 0 rgba(255,255,255,.8)}
.birthdaySpark{position:absolute;font-size:clamp(25px,3vw,55px);color:#f4a72e;text-shadow:0 0 20px rgba(255,188,62,.55);animation:birthdayTwinkle 2.4s ease-in-out infinite}.sparkOne{left:5%;top:11%}.sparkTwo{right:4%;top:27%;animation-delay:-.8s}.sparkThree{left:12%;bottom:8%;animation-delay:-1.4s}
.birthdayCopy{min-width:0;opacity:0;transform:translateX(40px);transition:1s .18s cubic-bezier(.2,.8,.2,1)}
.birthdayKicker{display:inline-flex;padding:9px 15px;border-radius:999px;background:#fff;color:#d75883;font-size:clamp(11px,.9vw,15px);font-weight:950;letter-spacing:.16em;box-shadow:0 8px 30px rgba(88,55,75,.1)}
.birthdayCopy h2{margin:20px 0 0;font-size:clamp(45px,5.5vw,100px);line-height:.92;letter-spacing:-.055em;color:#3c2433;font-weight:950}
.birthdayCopy h3{margin:18px 0 0;max-width:950px;font-size:clamp(34px,4vw,74px);line-height:1.02;letter-spacing:-.035em;color:#d75583;font-weight:950;text-wrap:balance}
.birthdayMeta{margin:18px 0 0;font-size:clamp(15px,1.35vw,24px);font-weight:850;color:#725767}
.birthdayMessage{margin-top:clamp(20px,2vw,34px);max-width:930px;padding:clamp(20px,2vw,34px);border:1px solid rgba(99,64,84,.11);border-radius:28px;background:rgba(255,255,255,.62);backdrop-filter:blur(16px);font-size:clamp(18px,1.7vw,30px);line-height:1.45;font-weight:760;color:#4e3847;box-shadow:0 20px 54px rgba(85,51,72,.1)}
.birthdayWishLine{display:flex;align-items:center;gap:14px;margin-top:24px;color:#765969;font-size:clamp(12px,1vw,17px);font-weight:900}.birthdayWishLine span{height:2px;flex:1;background:linear-gradient(90deg,transparent,#db88a8)}.birthdayWishLine span:last-child{background:linear-gradient(90deg,#db88a8,transparent)}
.birthdayFooter{position:relative;z-index:3;width:min(100%,930px);margin-top:clamp(18px,1.7vw,28px);display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px;padding:clamp(13px,1.15vw,18px) clamp(16px,1.45vw,24px);border:1px solid var(--bd-border);border-radius:22px;background:rgba(255,255,255,.68);backdrop-filter:blur(16px);box-shadow:0 16px 40px rgba(74,50,65,.08);color:var(--bd-soft);overflow:hidden}.birthdayFooter::after{content:"";position:absolute;right:-34px;bottom:-48px;width:130px;height:130px;border-radius:50%;background:radial-gradient(circle,var(--bd-accent-2),transparent 68%);opacity:.13;pointer-events:none}.birthdayFooterIcon{position:relative;z-index:1;width:clamp(42px,3.5vw,58px);height:clamp(42px,3.5vw,58px);display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,var(--bd-accent),var(--bd-accent-2));color:#fff;font-size:clamp(22px,2vw,32px);box-shadow:0 10px 24px color-mix(in srgb,var(--bd-accent) 26%,transparent)}.birthdayFooterText{position:relative;z-index:1;min-width:0;display:grid;gap:3px}.birthdayFooterText b{font-size:clamp(14px,1.12vw,20px);line-height:1.2;color:var(--bd-ink);font-weight:950}.birthdayFooterText small{font-size:clamp(11px,.88vw,15px);line-height:1.35;color:var(--bd-soft);font-weight:800}
.birthdayConfetti{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:1}.birthdayConfetti i{position:absolute;left:calc(var(--x)*1%);top:-5%;width:9px;height:18px;border-radius:4px;background:hsl(calc(var(--i)*47deg) 78% 63%);transform:rotate(var(--r));opacity:.68;animation:birthdayConfetti 9s calc(var(--d)*-1) linear infinite}
.birthdayDynamicSlide.birthdayAnimate .birthdayPhotoStage{opacity:1;transform:translateY(0) scale(1)}.birthdayDynamicSlide.birthdayAnimate .birthdayCopy{opacity:1;transform:translateX(0)}
@keyframes birthdayFloat{50%{transform:translateY(28px) scale(1.05)}}@keyframes birthdayBlob{50%{border-radius:55% 45% 58% 42% / 42% 58% 44% 56%;transform:rotate(4deg)}}@keyframes birthdayTwinkle{50%{transform:scale(1.35) rotate(18deg);opacity:.45}}@keyframes birthdayConfetti{0%{transform:translateY(-8vh) rotate(var(--r))}100%{transform:translateY(112vh) rotate(calc(var(--r) + 720deg))}}
@media(max-width:1000px){.birthdayHero{grid-template-columns:1fr;gap:22px;height:auto;padding-top:15px;text-align:center}.birthdayPhoto{width:min(55vw,440px)}.birthdayPhotoRing{width:min(61vw,490px)}.birthdayCopy{display:grid;justify-items:center}.birthdayWishLine{width:100%}.birthdaySlideShell{min-height:100vh;overflow:auto;padding-bottom:90px}.birthdayFooter{position:relative}.birthdayCompanyLogo{width:145px}}
@media(max-width:560px){.birthdaySlideHeader>span{font-size:11px;padding:7px 10px}.birthdayHero{padding-left:0;padding-right:0}.birthdayPhoto{width:min(72vw,350px);border-width:7px}.birthdayPhotoRing{width:min(80vw,390px)}.birthdayCopy h2{font-size:42px}.birthdayCopy h3{font-size:34px}.birthdayMessage{font-size:17px;border-radius:20px;padding:18px}.birthdayWishLine{display:none}.birthdayFooter{width:100%;text-align:left}.birthdayFooterText b{font-size:13px}.birthdayFooterText small{font-size:11px}}
@media(prefers-reduced-motion:reduce){.birthdayAura,.birthdayPhotoRing,.birthdaySpark,.birthdayConfetti i{animation:none!important}.birthdayPhotoStage,.birthdayCopy{transition:none!important;opacity:1!important;transform:none!important}}

/* V43: expanded birthday theme system */
.birthdayDynamicSlide{
  --bd-accent:#d75583;
  --bd-accent-2:#ff9d6c;
  --bd-ink:#3c2433;
  --bd-text:#4e3847;
  --bd-soft:#765969;
  --bd-panel:rgba(255,255,255,.62);
  --bd-border:rgba(99,64,84,.11);
  --bd-ring:linear-gradient(135deg,#ff9d6c,#e76ca8 45%,#6c93ef);
  --bd-kicker-bg:#fff;
  --bd-kicker-text:#d75883;
  --bd-line:#db88a8;
}
.birthdayTheme-gold{--bd-accent:#aa7207;--bd-accent-2:#e8b63b;--bd-ink:#3d2f16;--bd-text:#544426;--bd-soft:#77643a;--bd-ring:linear-gradient(135deg,#f6d66e,#c99114 48%,#7d5511);--bd-kicker-text:#986406;--bd-line:#d6ae4c}
.birthdayTheme-sky{--bd-accent:#246db2;--bd-accent-2:#65aee9;--bd-ink:#15344d;--bd-text:#2c4b64;--bd-soft:#527087;--bd-ring:linear-gradient(135deg,#78c7f4,#2b79c4 50%,#495bba);--bd-kicker-text:#246db2;--bd-line:#79b5df}
.birthdayTheme-berry{--bd-accent:#a63f79;--bd-accent-2:#e16fa9;--bd-ink:#46243a;--bd-text:#5d3a50;--bd-soft:#7d5970;--bd-ring:linear-gradient(135deg,#ed8fba,#ac4482 48%,#7860ba);--bd-kicker-text:#a63f79;--bd-line:#ce7aa6}
.birthdayTheme-mint{--bd-accent:#198b5b;--bd-accent-2:#59bd8d;--bd-ink:#153b2b;--bd-text:#315646;--bd-soft:#587769;--bd-ring:linear-gradient(135deg,#80d6ac,#239365 50%,#3d7695);--bd-kicker-text:#198b5b;--bd-line:#76bfa0}
.birthdayTheme-navy{--bd-accent:#1d5b91;--bd-accent-2:#4b8fc5;--bd-ink:#102b42;--bd-text:#28465e;--bd-soft:#526b7f;--bd-panel:rgba(255,255,255,.7);--bd-border:rgba(20,62,94,.14);--bd-ring:linear-gradient(135deg,#5fa9da,#1d5b91 48%,#162f5e);--bd-kicker-bg:#eaf5ff;--bd-kicker-text:#174f80;--bd-line:#5c91b8}
.birthdayTheme-graphite{--bd-accent:#46515a;--bd-accent-2:#7f8d98;--bd-ink:#202a31;--bd-text:#39464f;--bd-soft:#64717a;--bd-panel:rgba(255,255,255,.72);--bd-border:rgba(39,52,61,.14);--bd-ring:linear-gradient(135deg,#adb8c0,#53616b 48%,#232e36);--bd-kicker-bg:#edf1f3;--bd-kicker-text:#35434d;--bd-line:#84939d}
.birthdayTheme-emerald{--bd-accent:#0f7651;--bd-accent-2:#3aaf79;--bd-ink:#10392b;--bd-text:#2d5143;--bd-soft:#577467;--bd-panel:rgba(255,255,255,.69);--bd-border:rgba(15,105,73,.14);--bd-ring:linear-gradient(135deg,#62c99a,#117553 48%,#174c49);--bd-kicker-bg:#e8f8f0;--bd-kicker-text:#0f7651;--bd-line:#5bab88}
.birthdayTheme-royal{--bd-accent:#2f54b5;--bd-accent-2:#6789e6;--bd-ink:#182a57;--bd-text:#354a76;--bd-soft:#5d6f96;--bd-panel:rgba(255,255,255,.7);--bd-border:rgba(48,81,174,.14);--bd-ring:linear-gradient(135deg,#84a4fa,#345ac0 48%,#252b72);--bd-kicker-bg:#edf1ff;--bd-kicker-text:#2f54b5;--bd-line:#718bd1}
.birthdayTheme-bronze{--bd-accent:#9b5b24;--bd-accent-2:#c58b4f;--bd-ink:#442c1a;--bd-text:#5a402e;--bd-soft:#786250;--bd-panel:rgba(255,255,255,.69);--bd-border:rgba(132,77,33,.14);--bd-ring:linear-gradient(135deg,#d7aa75,#9c5d27 48%,#53361f);--bd-kicker-bg:#fff2e5;--bd-kicker-text:#94551f;--bd-line:#b78355}
.birthdayTheme-navy .birthdaySlideShell{background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.94),transparent 29%),linear-gradient(135deg,#edf7fd,#dcebf6 52%,#e8edf8)}
.birthdayTheme-graphite .birthdaySlideShell{background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.94),transparent 29%),linear-gradient(135deg,#f4f6f7,#e2e7ea 52%,#edf0f2)}
.birthdayTheme-emerald .birthdaySlideShell{background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.94),transparent 29%),linear-gradient(135deg,#eefaf4,#d9f0e4 52%,#eaf5f1)}
.birthdayTheme-royal .birthdaySlideShell{background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.94),transparent 29%),linear-gradient(135deg,#f0f4ff,#dfe7fb 52%,#edf0fa)}
.birthdayTheme-bronze .birthdaySlideShell{background:radial-gradient(circle at 18% 18%,rgba(255,255,255,.94),transparent 29%),linear-gradient(135deg,#fff7ef,#eddcc9 52%,#f8eee4)}
.birthdayPhotoRing{background:var(--bd-ring)}
.birthdayInitials{color:var(--bd-accent)}
.birthdaySpark{color:var(--bd-accent-2)}
.birthdayKicker{background:var(--bd-kicker-bg);color:var(--bd-kicker-text)}
.birthdayCopy h2{color:var(--bd-ink)}
.birthdayCopy h3{color:var(--bd-accent)}
.birthdayMeta{color:var(--bd-soft)}
.birthdayMessage{background:var(--bd-panel);border-color:var(--bd-border);color:var(--bd-text)}
.birthdayWishLine{color:var(--bd-soft)}
.birthdayWishLine span{background:linear-gradient(90deg,transparent,var(--bd-line))}.birthdayWishLine span:last-child{background:linear-gradient(90deg,var(--bd-line),transparent)}
.birthdayFooter{color:var(--bd-soft)}
.birthdayTheme-navy .birthdayConfetti i,.birthdayTheme-graphite .birthdayConfetti i,.birthdayTheme-emerald .birthdayConfetti i,.birthdayTheme-royal .birthdayConfetti i,.birthdayTheme-bronze .birthdayConfetti i{background:var(--bd-accent-2);opacity:.38}

/* V44: birthday footer is part of content flow and never overlaps the photo */
@media(max-width:1000px){.birthdayFooter{margin-inline:auto;max-width:760px}.birthdayCopy{padding-bottom:18px}}
@media(max-width:560px){.birthdayFooter{grid-template-columns:40px minmax(0,1fr);gap:10px;padding:12px 13px;border-radius:18px}.birthdayFooterIcon{width:40px;height:40px;border-radius:13px;font-size:21px}}

/* V45: Full HD birthday slide fit. Keep the whole composition inside 100vh. */
@media (min-width: 1100px) and (min-height: 760px) {
  .birthdayDynamicSlide,
  .birthdaySlideShell {
    height: 100vh;
    min-height: 0;
  }

  .birthdaySlideShell {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    padding: clamp(16px, 1.35vw, 26px) clamp(24px, 2vw, 38px);
    overflow: hidden;
  }

  .birthdaySlideHeader {
    min-height: 54px;
  }

  .birthdayCompanyLogo {
    width: clamp(128px, 10vw, 190px);
    height: clamp(44px, 4vw, 64px);
  }

  .birthdaySlideHeader > span {
    padding: 8px 14px;
    font-size: clamp(11px, .82vw, 15px);
  }

  .birthdayHero {
    width: 100%;
    max-width: 1760px;
    height: auto;
    min-height: 0;
    margin: 0 auto;
    padding: clamp(6px, .8vh, 12px) clamp(8px, 1vw, 18px) 0;
    grid-template-columns: minmax(330px, .82fr) minmax(0, 1.18fr);
    gap: clamp(28px, 3.2vw, 58px);
    align-items: center;
  }

  .birthdayPhotoStage {
    height: 100%;
    min-height: 0;
  }

  .birthdayPhotoRing {
    width: min(31vw, 500px, 66vh);
  }

  .birthdayPhoto {
    width: min(27.5vw, 445px, 59vh);
    max-height: 72vh;
    border-width: 8px;
  }

  .birthdayCopy {
    align-self: center;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 0;
  }

  .birthdayKicker {
    align-self: flex-start;
    padding: 7px 13px;
    font-size: clamp(10px, .72vw, 13px);
  }

  .birthdayCopy h2 {
    margin-top: clamp(10px, 1.1vh, 16px);
    font-size: clamp(42px, 4.25vw, 76px);
    line-height: .94;
  }

  .birthdayCopy h3 {
    margin-top: clamp(8px, .9vh, 14px);
    font-size: clamp(31px, 3.15vw, 58px);
    line-height: 1;
  }

  .birthdayMeta {
    margin-top: clamp(8px, .9vh, 13px);
    font-size: clamp(14px, 1.05vw, 20px);
  }

  .birthdayMessage {
    margin-top: clamp(12px, 1.2vh, 18px);
    padding: clamp(15px, 1.25vw, 22px);
    border-radius: 22px;
    font-size: clamp(16px, 1.22vw, 23px);
    line-height: 1.32;
  }

  .birthdayWishLine {
    margin-top: clamp(10px, 1vh, 15px);
    font-size: clamp(11px, .78vw, 14px);
  }

  .birthdayFooter {
    margin-top: clamp(10px, 1vh, 15px);
    padding: 11px 15px;
    border-radius: 18px;
    gap: 11px;
  }

  .birthdayFooterIcon {
    width: 42px;
    height: 42px;
    border-radius: 13px;
    font-size: 22px;
  }

  .birthdayFooterText b {
    font-size: clamp(13px, .92vw, 17px);
  }

  .birthdayFooterText small {
    font-size: clamp(10px, .7vw, 13px);
  }
}

/* Compact Full HD / browser UI visible: 1920x900, 1600x900, etc. */
@media (min-width: 1100px) and (max-height: 900px) {
  .birthdaySlideShell {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .birthdaySlideHeader {
    min-height: 44px;
  }
  .birthdayCompanyLogo {
    width: 125px;
    height: 44px;
  }
  .birthdayPhotoRing {
    width: min(29vw, 430px, 62vh);
  }
  .birthdayPhoto {
    width: min(25vw, 385px, 55vh);
    max-height: 64vh;
  }
  .birthdayCopy h2 {
    font-size: clamp(38px, 3.7vw, 64px);
    margin-top: 8px;
  }
  .birthdayCopy h3 {
    font-size: clamp(28px, 2.75vw, 48px);
    margin-top: 7px;
  }
  .birthdayMeta { margin-top: 7px; }
  .birthdayMessage {
    margin-top: 9px;
    padding: 13px 16px;
    font-size: clamp(15px, 1.05vw, 19px);
    line-height: 1.25;
  }
  .birthdayWishLine { margin-top: 8px; }
  .birthdayFooter {
    margin-top: 8px;
    padding: 9px 12px;
  }
  .birthdayFooterIcon {
    width: 36px;
    height: 36px;
    font-size: 19px;
  }
}