/* Общие детали восьми функций. Внешняя сцена, плеер и карточки те же, что у расписания. */
.fx-app__steps{display:grid;padding:16px}
.fx-step{grid-area:1/1;display:flex;flex-direction:column;gap:12px;min-width:0;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .45s var(--ease),transform .6s var(--ease)}
.fx-step.is-on{opacity:1;transform:none;pointer-events:auto}
.fx-step .fapp__h{margin:0;font-size:15px}
.fx-step .fapp__h>span{flex:none;font:10px var(--mono)}
.fx-app .fapp__ls li{grid-template-columns:28px minmax(0,1fr) auto;min-height:48px;padding:7px 6px;gap:8px}
.fx-app .fapp__ls li>span:nth-child(2)>small{display:block;font-size:10px;line-height:1.35;color:var(--muted)}
.fx-app .fapp__ls b{white-space:normal;font-size:13px;line-height:1.25}
.fx-app .fapp__ls .chip{max-width:112px;white-space:normal;text-align:center;font-size:10px;line-height:1.25}
.fx-app__marker{display:grid;place-items:center;width:26px;height:26px;border-radius:var(--r-xs);background:var(--blue-50);color:var(--blue)}
.fx-app__metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.fx-app__metrics>p{padding:12px;border:1px solid var(--line);border-radius:var(--r-s);background:var(--bg-2);display:grid;gap:5px}
.fx-app__metrics>p:last-child{background:var(--yellow-50)}
.fx-app__metrics small{font-size:10px;line-height:1.3;color:var(--muted)}
.fx-app__metrics b{font:400 23px/1.1 var(--mono);letter-spacing:-.05em;color:var(--ink)}
.fx-app__note{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:var(--r-s);background:var(--blue-50);color:var(--blue-dd);font-size:11px;line-height:1.4;margin-top:auto}
.fx-app__note>.ic{width:16px;height:16px;flex:none}
.fx-app__board{display:flex;align-items:center;gap:20px;padding:10px 16px;background:var(--bg-2);border-radius:var(--r-s)}
.fx-app__board>span{font:italic 18px var(--serif);color:var(--blue-dd);white-space:nowrap}
.fx-app__board svg{height:40px;width:50%;fill:none;stroke:var(--blue);stroke-width:2;stroke-linecap:round}
.fx-app__bars{display:grid;gap:8px}
.fx-app__bars>span{height:6px;border-radius:var(--r-2xs);background:var(--bg-3);overflow:hidden}
.fx-app__bars i{display:block;width:calc(var(--v)*100%);height:100%;background:var(--blue);border-radius:inherit}
.fx-app__bars>span:last-child i{background:var(--yellow)}
.fx-film.is-cut .fx-step{transition:none!important}
.fx-film:not(.is-playing) .fx-step *,.fx-film:not(.is-app) .fx-step *{animation-play-state:paused!important}
.fx-film.is-poster .fx-step *,.fx-film:not(.is-ready) .fx-step *,html:not(.js) .fx-film .fx-step *{animation:none!important}
.fx-film .film__sub span{max-width:100%;text-wrap:pretty;line-height:1.35}
@media(max-width:720px){
  .fx-app__steps{padding:12px}
  .fx-step{gap:10px}
  .fx-step .fapp__h{font-size:12px;align-items:center}
  .fx-app .fapp__ls li{grid-template-columns:24px minmax(0,1fr) auto;gap:5px;padding:7px 3px;min-height:50px}
  .fx-app .fapp__ls li>span:nth-child(2)>b{font-size:11px}
  .fx-app .fapp__ls li>span:nth-child(2)>small{font-size:9px}
  .fx-app .fapp__ls .chip{max-width:84px;font-size:8px;padding:4px 5px}
  .fx-app__marker{width:22px;height:22px;border-radius:var(--r-xs)}
  .fx-app__metrics{gap:7px}
  .fx-app__metrics>p{padding:10px}
  .fx-app__metrics b{font-size:19px}
  .fx-app__note{padding:9px;font-size:10px}
  .fx-app__board{padding:8px;gap:8px}
  .fx-app__board>span{font-size:15px}
  .fx-film .win__crumb{overflow:hidden;white-space:nowrap;min-width:0}
  .fx-film .win__crumb>b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .fx-film .film__sub span{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.fx-step{animation:none!important;transition:none!important}}
/* Телефон: ролик функции укладывается в экран, как ролик главной. Второстепенные строки и плашки скрыты. */
@media(max-width:520px){
  .sc-film .film__bens li:nth-child(n+3){display:none}
  .fx-film .fx-step :is(.fx-work-pay__notice,.fx-work-journal__detail,.pd-cab__deck,.fx-people-progress,.fx-board-resources,.fx-work-report__comment){display:none}
  .fx-film .fx-step :is(.fapp__ls,.fai__bot ol,.fai__bot ul)>li:nth-child(n+4),.fx-film .fx-step :is(.pay__rows,.pd-jr__rows)>li:nth-child(n+3){display:none}
}
/* Внутри окна экран без своей рамки: один уровень, как в кабинете. */
.fx-step>:is(.pay,.rep,.log){padding:0;border-radius:0;background:none;box-shadow:none}
.fx-step .fx-work-journal{padding-top:0}