/* Модуль «Секции»: симулятор абонемента по расписанию и мини-виджеты особенностей.
   Разметка — resources/views/site/modules/sections.blade.php, сценарий — sections.js */
.sc, .scf {
    --sc-done: #3a5fd6; --sc-done-bg: linear-gradient(135deg, #dfe7fd, #ebe3fd);
    --sc-miss: #a8650b; --sc-miss-bg: #fdf1dc;
    --sc-frz: #2a72b5; --sc-frz-bg: #e6f2fc; --sc-frz-line: #b9d8f2;
    --sc-end: #1f7a45;
    --sc-ease: cubic-bezier(.2, .7, .2, 1);
}
.sc-head { max-width: 780px; }
.sc-head .lead { margin-top: 18px; }

/* ── Окно симулятора ── */
.sc-app {
    position: relative; margin-top: 44px; display: grid; grid-template-columns: minmax(0, 1fr) 420px;
    background: #fff; border: 1px solid var(--line-card); border-radius: 18px; overflow: hidden;
    box-shadow: 0 1px 2px rgba(20, 20, 19, .04), 0 30px 80px rgba(20, 20, 19, .10); font-size: 13px; user-select: none;
}
.sc-cal { padding: 22px 24px 20px; min-width: 0; }
.sc-cal-top { display: flex; align-items: center; gap: 12px; }
.sc-sec-ico { width: 42px; height: 42px; flex: none; border-radius: 12px; display: grid; place-items: center; color: #b4452f; background: linear-gradient(135deg, #ffe3d3, #ffd0dc); }
.sc-sec { min-width: 0; flex: 1; }
.sc-sec b { display: block; font-size: 17px; font-weight: 600; letter-spacing: -.01em; }
.sc-sec span { display: block; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sc-coach { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px 0 4px; border-radius: 999px; background: var(--panel); color: var(--ink-2); white-space: nowrap; font-weight: 500; }
.sc-coach i { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-style: normal; font-size: 10px; font-weight: 700; color: #fff; background: linear-gradient(135deg, #7aa2f7, #8f6be8); }

.sc-cal-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 18px 0 10px; min-height: 28px; }
.sc-cal-bar > b { font-size: 14px; font-weight: 600; }
.sc-night {
    display: inline-flex; align-items: center; gap: 7px; height: 28px; padding: 0 12px; border-radius: 999px;
    background: #1d2340; color: #dfe4ff; font-size: 12px; font-weight: 500; white-space: nowrap; opacity: 0; transform: translateY(-4px); transition: opacity .3s, transform .3s;
}
.sc-night.is-on { opacity: 1; transform: none; }
.sc-night .i { color: #ffd98a; }

.sc-grid { display: flex; flex-direction: column; gap: 6px; }
.sc-dow, .sc-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.sc-dow span { font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ph); padding-left: 8px; }
.sc-dow span.is-sched { color: var(--ink-2); }
.sc-week { position: relative; width: 100%; padding: 4px; margin: -4px 0; border-radius: 14px; text-align: left; transition: background .35s; }
.sc-week:not([disabled]) { cursor: pointer; }
.sc-week:not([disabled]):hover { background: var(--hover-soft); }
.sc-week.is-frz { background: var(--sc-frz-bg); box-shadow: inset 0 0 0 1px var(--sc-frz-line); }
.sc-week.is-frz:hover { background: #dcecfa; }
.sc-week[disabled] { cursor: default; }
.sc-wk-flag {
    position: absolute; right: 8px; top: 50%; translate: 0 -50%; z-index: 2; display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 10px;
    border-radius: 999px; background: #fff; border: 1px solid var(--sc-frz-line); color: var(--sc-frz); font-size: 12px; font-weight: 600; white-space: nowrap;
    opacity: 0; transform: scale(.9); transition: opacity .2s, transform .2s; pointer-events: none; box-shadow: 0 4px 14px rgba(42, 114, 181, .15);
}
.sc-week:not([disabled]):hover .sc-wk-flag, .sc-week:focus-visible .sc-wk-flag, .sc-week.is-frz .sc-wk-flag { opacity: 1; transform: none; }
.sc-week.is-frz .sc-wk-flag { background: var(--sc-frz); border-color: var(--sc-frz); color: #fff; }
.sc-week.is-frz:not(:hover) .sc-wk-flag span { display: none; }
.sc-week.is-frz:not(:hover) .sc-wk-flag { padding: 0 7px; }

.sc-day {
    position: relative; height: 64px; border-radius: 10px; padding: 7px 8px; background: #fafaf9; border: 1px solid transparent;
    display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; transition: background .35s, border-color .35s, opacity .35s;
}
.sc-dn { font-style: normal; font-size: 13px; font-weight: 500; color: var(--ink-2); font-variant-numeric: tabular-nums; line-height: 1; }
.sc-no { font-style: normal; font-size: 11px; font-weight: 700; color: var(--sc-done); font-variant-numeric: tabular-nums; line-height: 1; }
.sc-tag { position: absolute; right: 6px; top: 6px; font-size: 10px; font-weight: 600; line-height: 1; padding: 3px 6px; border-radius: 999px; background: var(--ink); color: #fff; white-space: nowrap; }
.sc-tag:empty { display: none; }
.sc-day.is-before { opacity: .4; }
.sc-day.is-sched { background: #fff; border: 1px dashed var(--line-strong); }
.sc-day.is-sched::after { content: '18:00'; position: absolute; left: 8px; bottom: 7px; font-size: 10.5px; color: var(--ph); font-variant-numeric: tabular-nums; }
.sc-day.is-sub { border: 1px solid #cbd8fb; }
.sc-day.is-sub::after { display: none; }
.sc-day.is-done { background: var(--sc-done-bg); border-color: transparent; }
.sc-day.is-done .sc-dn { color: var(--sc-done); font-weight: 700; }
.sc-day.is-done .sc-no::before { content: '✓ '; }
.sc-day.is-missed.is-done { background: repeating-linear-gradient(135deg, #fdf1dc 0 7px, #fbe7c4 7px 9px); }
.sc-day.is-missed .sc-no { color: var(--sc-miss); }
.sc-day.is-missed .sc-tag { background: var(--sc-miss); }
.sc-day.is-buy .sc-tag { background: var(--accent); }
.sc-day.is-end { box-shadow: inset 0 0 0 2px var(--sc-end); }
.sc-day.is-end .sc-tag { background: var(--sc-end); }
.sc-week.is-frz .sc-day { background: rgba(255, 255, 255, .55); border-color: transparent; }
.sc-week.is-frz .sc-day.is-sched::after { content: '❄'; color: var(--sc-frz); font-size: 12px; }
.sc-week.is-frz .sc-day.is-sched .sc-dn { color: var(--sc-frz); text-decoration: line-through; text-decoration-thickness: 1.5px; }
.sc-day.is-today { box-shadow: 0 0 0 2px var(--ink); z-index: 1; }
.sc-day.is-today.is-end { box-shadow: 0 0 0 2px var(--ink), inset 0 0 0 2px var(--sc-end); }
.sc-day.is-pop { animation: sc-pop .55s cubic-bezier(.3, 1.6, .5, 1); }
.sc-day.is-shift { animation: sc-shift 1.4s var(--sc-ease); }
@keyframes sc-pop { 0% { transform: scale(.8); } 100% { transform: none; } }
@keyframes sc-shift { 0% { background: #d4f0de; transform: scale(.85); } 100% { transform: none; } }

.sc-cal-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px 20px; flex-wrap: wrap; margin-top: 16px; }
.sc-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; color: var(--muted); font-size: 12px; }
.sc-legend li { display: inline-flex; align-items: center; gap: 6px; }
.sc-legend i { width: 14px; height: 14px; border-radius: 4px; }
.sc-legend [data-k='counted'] i { background: var(--sc-done-bg); box-shadow: inset 0 0 0 1px #cbd8fb; }
.sc-legend [data-k='missed'] i { background: repeating-linear-gradient(135deg, #fdf1dc 0 3px, #f5d79f 3px 5px); }
.sc-legend [data-k='frozen'] i { background: var(--sc-frz-bg); box-shadow: inset 0 0 0 1px var(--sc-frz-line); }
.sc-legend [data-k='next'] i { background: #fff; border: 1px solid #cbd8fb; }
.sc-hint { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--sc-frz); font-weight: 500; }
.sc-hint.is-warn { color: var(--warn); }

/* ── Абонемент справа ── */
.sc-side { border-left: 1px solid var(--line); background: #fafaf9; padding: 22px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.sc-ticket { position: relative; background: #fff; border: 1px solid var(--line-card); border-radius: 14px; padding: 16px; }
.sc-ticket::before, .sc-ticket::after { content: ''; position: absolute; top: 74px; width: 16px; height: 16px; border-radius: 50%; background: #fafaf9; border: 1px solid var(--line-card); }
.sc-ticket::before { left: -9px; clip-path: inset(0 0 0 50%); }
.sc-ticket::after { right: -9px; clip-path: inset(0 50% 0 0); }
.sc-tk-top { display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px dashed var(--line-strong); }
.sc-tk-ico { width: 36px; height: 36px; flex: none; border-radius: 10px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.sc-tk-t { min-width: 0; flex: 1; }
.sc-tk-t small { display: block; font-size: 11.5px; color: var(--muted); }
.sc-tk-t b { display: block; font-size: 14.5px; font-weight: 600; line-height: 1.25; }
.sc-st { display: inline-flex; align-items: center; height: 24px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; transition: background .3s, color .3s; }
.sc-st[data-st='active'] { background: var(--ok-soft); color: var(--ok); }
.sc-st[data-st='frozen'] { background: var(--sc-frz-bg); color: var(--sc-frz); }
.sc-st[data-st='ended'] { background: var(--chip); color: var(--muted); }
.sc-st[data-st='plan'] { background: #f1edfd; color: #6a4fd0; }
.sc-st.is-flash { animation: sc-pop .5s cubic-bezier(.3, 1.6, .5, 1); }

.sc-big { display: flex; align-items: baseline; justify-content: space-between; margin-top: 14px; }
.sc-big > span { color: var(--muted); font-size: 13px; }
.sc-big b { font-size: 34px; font-weight: 650; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1; }
.sc-big small { font-size: 14px; font-weight: 500; color: var(--muted); letter-spacing: 0; }

.sc-ribbon { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 5px; margin-top: 12px; }
.sc-ribbon li { height: 44px; border-radius: 8px; border: 1px dashed #cbd8fb; background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; transition: background .35s, border-color .35s; }
.sc-ribbon li i { font-style: normal; font-size: 13px; font-weight: 700; color: var(--sc-done); line-height: 1.1; }
.sc-ribbon li span { font-size: 10px; color: var(--muted); white-space: nowrap; line-height: 1.1; }
.sc-ribbon li.is-done { background: var(--sc-done-bg); border: 1px solid transparent; }
.sc-ribbon li.is-done i::before { content: '✓'; margin-right: 2px; font-size: 11px; }
.sc-ribbon li.is-missed.is-done { background: repeating-linear-gradient(135deg, #fdf1dc 0 6px, #fbe7c4 6px 8px); }
.sc-ribbon li.is-missed i { color: var(--sc-miss); }
.sc-ribbon li.is-pop { animation: sc-pop .5s cubic-bezier(.3, 1.6, .5, 1); }
.sc-ribbon li.is-moved { animation: sc-shift 1.4s var(--sc-ease); }

.sc-rows { margin: 12px 0 0; }
.sc-rows div { display: flex; justify-content: space-between; gap: 12px; padding: 8px 2px; border-bottom: 1px solid var(--row); }
.sc-rows div:last-child { border-bottom: 0; }
.sc-rows dt { color: var(--muted); }
.sc-rows dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; border-radius: 6px; padding: 0 4px; }
.sc-rows dd.is-flash { animation: sc-tflash 1.6s; }
@keyframes sc-tflash { 0%, 40% { background: #d4f0de; color: var(--sc-end); } 100% { background: transparent; } }
.sc-renew {
    display: flex; align-items: center; justify-content: center; gap: 7px; height: 0; margin-top: 0; border-radius: 10px; background: var(--ink); color: #fff;
    font-weight: 500; overflow: hidden; opacity: 0; transition: height .4s var(--sc-ease), margin-top .4s var(--sc-ease), opacity .3s;
}
.sc-renew.is-on { height: 40px; margin-top: 10px; opacity: 1; }
.sc-renew.is-on.is-new { animation: sc-glow 1.6s 2; }
@keyframes sc-glow { 0%, 100% { box-shadow: 0 0 0 0 rgba(20, 20, 19, .35); } 50% { box-shadow: 0 0 0 7px rgba(20, 20, 19, 0); } }

.sc-note { display: flex; gap: 12px; padding: 14px; border-radius: 14px; background: #fff; border: 1px solid var(--line-card); min-height: 96px; }
.sc-note.is-new { animation: sc-in .5s var(--sc-ease); }
@keyframes sc-in { 0% { opacity: 0; transform: translateY(10px); } 100% { opacity: 1; transform: none; } }
.sc-note-ico { width: 36px; height: 36px; flex: none; border-radius: 10px; display: grid; place-items: center; background: #f1edfd; color: #6a4fd0; }
.sc-note[data-k='2'] .sc-note-ico { background: var(--sc-miss-bg); color: var(--sc-miss); }
.sc-note[data-k='3'] .sc-note-ico, .sc-note[data-k='plan'] .sc-note-ico { background: var(--sc-frz-bg); color: var(--sc-frz); }
.sc-note[data-k='4'] .sc-note-ico { background: var(--ok-soft); color: var(--ok); }
.sc-note[data-k='0'] .sc-note-ico { background: var(--accent-soft); color: var(--accent); }
.sc-note b { display: block; font-size: 14px; font-weight: 600; line-height: 1.3; }
.sc-note p { margin-top: 3px; color: var(--ink-2); line-height: 1.45; }

/* ── Шаги ── */
.sc-ctl { display: flex; align-items: flex-start; gap: 24px; margin-top: 22px; }
.sc-steps { flex: 1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; min-width: 0; }
.sc-steps li { position: relative; }
.sc-steps li:not(:last-child)::after { content: ''; position: absolute; left: 40px; right: -4px; top: 17px; height: 2px; border-radius: 2px; background: var(--line); }
.sc-steps button { position: relative; z-index: 1; display: flex; align-items: flex-start; gap: 10px; width: 100%; text-align: left; padding: 2px 8px 2px 2px; border-radius: 10px; }
.sc-st-dot { width: 34px; height: 34px; flex: none; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 1px solid var(--line-strong); color: var(--faint); transition: background .3s, color .3s, border-color .3s; }
.sc-st-t { min-width: 0; padding-top: 1px; background: #fff; padding-right: 6px; }
.sc-st-t b { display: block; font-size: 14px; font-weight: 600; color: var(--muted); line-height: 1.25; }
.sc-st-t small { display: block; font-size: 12.5px; color: var(--faint); line-height: 1.3; }
.sc-steps [data-st='done'] .sc-st-dot { background: var(--sc-done-bg); border-color: transparent; color: var(--sc-done); }
.sc-steps [data-st='done'] b, .sc-steps [data-st='now'] b { color: var(--ink); }
.sc-steps [data-st='now'] .sc-st-dot { background: var(--ink); border-color: var(--ink); color: #fff; box-shadow: 0 0 0 5px rgba(20, 20, 19, .08); }
.sc-steps button:hover .sc-st-dot { border-color: var(--ink-2); }
.sc-ctl-btns { display: flex; gap: 8px; flex: none; }

/* ── Виджеты ── */
.scf-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 16px; margin-top: 40px; }
.scf-card { grid-column: span 4; border: 1px solid var(--line-card); border-radius: 18px; background: #fff; overflow: hidden; padding-bottom: 22px; }
.scf-wait { grid-column: span 7; }
.scf-age { grid-column: span 5; }
.scf-card h3 { display: flex; align-items: center; gap: 8px; margin: 20px 22px 6px; font-size: 17px; font-weight: 600; letter-spacing: -.01em; }
.scf-card h3 .i { color: var(--accent); }
.scf-card > p { margin: 0 22px; font-size: 14.5px; line-height: 1.5; color: var(--ink-2); }
.scf-vis { position: relative; height: 236px; padding: 20px 22px; overflow: hidden; font-size: 13px; background: linear-gradient(180deg, #f7f7fb, #fbfaf7); border-bottom: 1px solid var(--line); }
.scf-wait .scf-vis { background: linear-gradient(135deg, #f3f0ff, #fff3ea); }
.scf-age .scf-vis { background: linear-gradient(135deg, #eef7f1, #f5f2ff); }
.scf-consent .scf-vis { background: linear-gradient(135deg, #fff6e8, #f6f1ff); }
.scf-pass .scf-vis { background: linear-gradient(135deg, #eaf3ff, #f3fbf4); }
.scf-win .scf-vis { background: linear-gradient(135deg, #f1fbf4, #eef3ff); }
.scf-prog .scf-vis { background: linear-gradient(135deg, #fff0f3, #f1f0ff); }
.scf-move .scf-vis { background: linear-gradient(135deg, #f0f6ff, #fff6ee); }
.scf-chk .scf-vis { background: linear-gradient(135deg, #fbf4ee, #f0f4ff); }
.scf-av { --h: 220; }
/* монограмма */
.scf-seats li, .scf-queue li, .scf-kids li > i, .scf-chip i {
    display: grid; place-items: center; border-radius: 50%; font-style: normal; font-weight: 700; color: #fff;
    background: linear-gradient(135deg, hsl(var(--h) 75% 74%), hsl(calc(var(--h) + 40) 70% 64%));
}

/* Лист ожидания */
.scf-wait-top { display: flex; align-items: baseline; gap: 8px; }
.scf-wait-top b { font-size: 26px; font-weight: 650; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.scf-wait-top > span { color: var(--muted); }
.scf-toast { margin-left: auto; align-self: center; font-style: normal; font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: #fff; color: var(--ok); box-shadow: 0 4px 14px rgba(20, 20, 19, .08); opacity: 0; transition: opacity .3s; white-space: nowrap; }
.scf-toast.is-on { opacity: 1; }
.scf-toast[data-k='freed'] { color: var(--warn); }
.scf-seats { display: grid; grid-template-columns: repeat(12, 34px); gap: 8px; margin-top: 14px; }
.scf-seats li { width: 34px; height: 34px; font-size: 11px; transition: transform .45s var(--sc-ease), opacity .45s; }
.scf-seats li.is-empty { background: transparent; box-shadow: inset 0 0 0 2px #fff, inset 0 0 0 3px var(--line-strong); color: transparent; }
.scf-seats li.is-gone { transform: translateY(-14px) scale(.6); opacity: 0; }
.scf-seats li.is-new { animation: scf-drop .7s cubic-bezier(.3, 1.4, .5, 1); }
@keyframes scf-drop { 0% { transform: translateY(70px) scale(.7); } 100% { transform: none; } }
.scf-queue { margin-top: 20px; padding: 12px 14px; border-radius: 12px; background: rgba(255, 255, 255, .75); display: flex; align-items: center; gap: 14px; }
.scf-queue > span { display: inline-flex; align-items: center; gap: 6px; color: var(--ink-2); font-weight: 500; white-space: nowrap; }
.scf-queue ol { display: flex; gap: 10px; }
.scf-queue li { position: relative; width: 34px; height: 34px; font-size: 11px; transition: transform .5s var(--sc-ease), opacity .4s; }
.scf-queue li em { position: absolute; right: -4px; top: -4px; width: 16px; height: 16px; border-radius: 50%; background: var(--ink); color: #fff; font-size: 9.5px; font-style: normal; display: grid; place-items: center; }
.scf-queue li.is-out { transform: translateY(-50px) scale(.6); opacity: 0; }

/* Цена по возрасту */
.scf-age-top { display: flex; align-items: baseline; justify-content: space-between; }
.scf-age-top span { color: var(--muted); }
.scf-age-top b { font-size: 22px; font-weight: 650; font-variant-numeric: tabular-nums; }
.scf-track { position: relative; height: 6px; margin: 12px 4px 16px; border-radius: 6px; background: linear-gradient(90deg, #c9ecd6, #cfd9fb, #e2d6fb, #f6d3df); }
.scf-track i { position: absolute; top: 50%; left: calc(var(--p) * 100%); width: 20px; height: 20px; margin: -10px 0 0 -10px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 2px var(--ink), 0 4px 10px rgba(20, 20, 19, .15); transition: left .7s var(--sc-ease); }
.scf-prices { display: flex; flex-direction: column; gap: 5px; }
.scf-prices li { position: relative; display: flex; justify-content: space-between; align-items: center; height: 32px; padding: 0 12px; border-radius: 9px; background: rgba(255, 255, 255, .6); color: var(--muted); transition: background .3s, color .3s, box-shadow .3s; }
.scf-prices li b { font-weight: 600; font-variant-numeric: tabular-nums; }
.scf-prices li em { display: none; font-style: normal; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 600; color: var(--bad); }
.scf-prices li.is-on { background: #fff; color: var(--ink); box-shadow: 0 0 0 1.5px var(--ink), 0 6px 16px rgba(20, 20, 19, .08); }
.scf-prices li.is-lock { color: var(--ph); }
.scf-prices li.is-lock b { display: none; }
.scf-prices li.is-lock em { display: inline-flex; }

/* Согласие */
.scf-consent .scf-vis { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; }
.scf-doc { position: relative; width: 230px; padding: 14px 16px 16px; border-radius: 12px; background: #fff; box-shadow: 0 10px 30px rgba(20, 20, 19, .08); }
.scf-doc-ico { width: 30px; height: 30px; border-radius: 9px; display: grid; place-items: center; background: #fff1d9; color: var(--warn); }
.scf-doc b { display: block; margin-top: 8px; font-size: 13px; font-weight: 600; line-height: 1.25; }
.scf-doc small { display: block; color: var(--muted); font-size: 11.5px; }
.scf-line { display: block; height: 5px; border-radius: 3px; background: var(--chip); margin-top: 7px; }
.scf-line.s { width: 60%; }
.scf-sign { display: inline-flex; align-items: center; gap: 5px; margin-top: 10px; height: 26px; padding: 0 10px; border-radius: 8px; background: var(--ink); color: #fff; font-size: 11.5px; font-weight: 500; animation: scf-sign 6s infinite; }
.scf-stamp {
    position: absolute; right: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: 5px; padding: 5px 9px; border-radius: 8px;
    border: 2px solid var(--ok); color: var(--ok); font-size: 11.5px; font-weight: 700; background: rgba(231, 245, 236, .9); transform: rotate(-8deg); animation: scf-stamp 6s infinite;
}
.scf-lockrow { position: relative; height: 26px; width: 200px; }
.scf-lockrow span { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 6px; border-radius: 999px; font-size: 12px; font-weight: 600; }
.scf-lk-off { background: var(--chip); color: var(--muted); animation: scf-off 6s infinite; }
.scf-lk-on { background: var(--ok-soft); color: var(--ok); animation: scf-on 6s infinite; }
@keyframes scf-sign { 0%, 30% { opacity: 1; transform: none; } 34% { transform: scale(.92); } 40%, 92% { opacity: 0; } 100% { opacity: 1; } }
@keyframes scf-stamp { 0%, 38% { opacity: 0; transform: rotate(-8deg) scale(1.8); } 44% { opacity: 1; transform: rotate(-8deg) scale(.95); } 48%, 92% { opacity: 1; transform: rotate(-8deg); } 100% { opacity: 0; } }
@keyframes scf-off { 0%, 44% { opacity: 1; } 48%, 94% { opacity: 0; } 100% { opacity: 1; } }
@keyframes scf-on { 0%, 44% { opacity: 0; transform: scale(.9); } 50%, 94% { opacity: 1; transform: none; } 100% { opacity: 0; } }

/* Проход через тренера */
.scf-pass-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.scf-pass-top span { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.scf-pass-top b { font-weight: 600; color: var(--ok); font-variant-numeric: tabular-nums; }
.scf-pass-body { display: flex; gap: 12px; margin-top: 12px; }
.scf-kids { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.scf-kids li { display: flex; align-items: center; gap: 8px; height: 36px; padding: 0 8px 0 4px; border-radius: 10px; background: rgba(255, 255, 255, .8); transition: background .3s; }
.scf-kids li > i { width: 28px; height: 28px; flex: none; font-size: 10px; }
.scf-kids li > span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-weight: 500; }
.scf-kids em { display: none; align-items: center; gap: 3px; font-style: normal; font-size: 11px; font-weight: 600; white-space: nowrap; padding: 2px 7px; border-radius: 999px; }
.scf-kids .scf-key { background: #fff1d9; color: var(--warn); }
.scf-kids .scf-ok { background: var(--ok-soft); color: var(--ok); }
.scf-kids li.is-key .scf-key, .scf-kids li.is-in .scf-ok { display: inline-flex; }
.scf-kids li.is-key { background: #fff; box-shadow: 0 0 0 1.5px #f1d9a8; }
.scf-gate { position: relative; width: 56px; flex: none; border-radius: 12px; background: rgba(255, 255, 255, .8); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.scf-gate-ring { position: relative; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: #fff; color: var(--ink-2); box-shadow: 0 0 0 2px var(--line-strong); transition: box-shadow .3s, color .3s, background .3s; }
.scf-gate-ring .i { grid-area: 1 / 1; transition: opacity .25s, transform .35s; }
.scf-gate-ring .i:last-child { opacity: 0; transform: scale(.6); }
.scf-gate small { width: 6px; height: 6px; border-radius: 50%; background: var(--bad); transition: background .3s; }
.scf-gate.is-open .scf-gate-ring { background: var(--ok-soft); color: var(--ok); box-shadow: 0 0 0 2px #43b26e, 0 0 0 8px rgba(67, 178, 110, .15); }
.scf-gate.is-open .scf-gate-ring .i:first-child { opacity: 0; transform: scale(.6); }
.scf-gate.is-open .scf-gate-ring .i:last-child { opacity: 1; transform: none; }
.scf-gate.is-open small { background: #43b26e; }

/* Окно прохода */
.scf-win .scf-vis { display: flex; align-items: center; gap: 18px; }
.scf-dial { width: 132px; height: 132px; flex: none; }
.scf-dial-bg { fill: #fff; stroke: var(--line-strong); stroke-width: 1; }
.scf-dial-arc { fill: none; stroke: #43b26e; stroke-width: 8; stroke-linecap: round; opacity: .85; }
.scf-tick { stroke: var(--ph); stroke-width: 1.5; stroke-linecap: round; }
.scf-hand { stroke: var(--ink); stroke-width: 3; stroke-linecap: round; transform-origin: 60px 60px; }
.scf-hand.is-min { stroke: var(--ink-2); stroke-width: 2; }
.scf-pin { fill: var(--ink); }
.scf-win-t { min-width: 0; }
.scf-win-t b { display: block; font-size: 28px; font-weight: 650; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.scf-win-t small { display: block; color: var(--muted); }
.scf-win-st { display: inline-flex; align-items: center; gap: 5px; margin-top: 10px; height: 26px; padding: 0 10px; border-radius: 999px; font-size: 12px; font-weight: 600; white-space: nowrap; background: var(--bad-soft); color: var(--bad); transition: background .3s, color .3s; }
.scf-win-st.is-open { background: var(--ok-soft); color: var(--ok); }

/* Групповые программы */
.scf-cover { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 14px; background: linear-gradient(120deg, #ffd9e2, #e4dcff 60%, #d6ecff); }
.scf-cover > span { width: 40px; height: 40px; flex: none; border-radius: 12px; display: grid; place-items: center; background: rgba(255, 255, 255, .7); color: #b0447a; }
.scf-cover b { display: block; font-size: 14px; font-weight: 600; }
.scf-cover small { display: block; color: var(--ink-2); font-size: 12px; }
.scf-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 12px; }
.scf-opt { padding: 12px; border-radius: 12px; background: #fff; box-shadow: 0 0 0 1px var(--line-card); }
.scf-opt span { display: block; font-size: 12px; color: var(--muted); }
.scf-opt b { display: block; margin-top: 2px; font-size: 18px; font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.scf-opt small { display: block; font-size: 11.5px; color: var(--muted); line-height: 1.3; }
.scf-opt.is-a { animation: scf-pick 6s infinite; }
.scf-opt.is-b { animation: scf-pick 6s -3s infinite; }
@keyframes scf-pick { 0%, 45% { box-shadow: 0 0 0 2px var(--ink), 0 8px 18px rgba(20, 20, 19, .08); } 50%, 100% { box-shadow: 0 0 0 1px var(--line-card); } }

/* Перевод */
.scf-move .scf-vis { display: flex; flex-direction: column; gap: 6px; }
.scf-cat { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; margin-bottom: 2px; }
.scf-grp { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 56px auto; grid-template-rows: auto auto; align-items: center; column-gap: 8px; padding: 8px 10px; border-radius: 10px; background: rgba(255, 255, 255, .8); }
.scf-grp-n { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.scf-grp b { font-size: 12px; font-variant-numeric: tabular-nums; text-align: right; }
.scf-grp em { grid-column: 1; font-style: normal; font-size: 11px; color: var(--muted); }
.scf-bar { grid-column: 2; grid-row: 1; height: 5px; border-radius: 3px; background: var(--chip); overflow: hidden; }
.scf-bar i { display: block; height: 100%; width: var(--w); background: var(--ph); border-radius: 3px; }
.scf-grp[data-g='free'] { box-shadow: 0 0 0 1.5px #9ed5b2; }
.scf-grp[data-g='free'] em { color: var(--ok); font-weight: 600; }
.scf-grp[data-g='free'] .scf-bar i { background: #43b26e; animation: scf-fill9 6s infinite; }
.scf-grp[data-g='full'] { opacity: .6; }
.scf-grp[data-g='current'] em { color: var(--accent); font-weight: 600; }
.scf-chip { position: absolute; right: 86px; top: 62px; display: inline-flex; align-items: center; gap: 4px; padding: 3px 8px 3px 3px; border-radius: 999px; background: #fff; box-shadow: 0 6px 16px rgba(20, 20, 19, .14); color: var(--accent); animation: scf-move 6s infinite; --h: 150; }
.scf-chip i { width: 22px; height: 22px; font-size: 9px; }
.scf-done { position: absolute; right: 22px; bottom: 14px; display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--ok); animation: scf-done 6s infinite; }
@keyframes scf-move { 0%, 20% { transform: none; opacity: 1; } 45%, 85% { transform: translateY(50px); opacity: 1; } 95%, 100% { transform: translateY(50px); opacity: 0; } }
@keyframes scf-done { 0%, 45% { opacity: 0; } 52%, 88% { opacity: 1; } 100% { opacity: 0; } }
@keyframes scf-fill9 { 0%, 45% { width: 75%; } 52%, 100% { width: 83%; } }

/* Проверки */
.scf-chk-h { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; margin-bottom: 8px; }
.scf-chk-list { position: relative; display: flex; flex-direction: column; gap: 5px; }
.scf-chk-r { display: flex; justify-content: space-between; align-items: center; height: 30px; padding: 0 10px; border-radius: 8px; background: rgba(255, 255, 255, .85); }
.scf-chk-r b { min-width: 24px; height: 20px; padding: 0 7px; border-radius: 999px; display: grid; place-items: center; font-size: 11.5px; font-variant-numeric: tabular-nums; animation: scf-badge 5s var(--d) infinite both; }
.scf-chk-r[data-s='bad'] b { background: var(--bad-soft); color: var(--bad); }
.scf-chk-r[data-s='warn'] b { background: var(--warn-soft); color: var(--warn); }
.scf-chk-r[data-s='ok'] b { background: var(--ok-soft); color: var(--ok); }
.scf-scan { position: absolute; left: -6px; right: -6px; top: 0; height: 30px; border-radius: 8px; border: 1.5px solid rgba(47, 91, 216, .45); background: rgba(47, 91, 216, .06); animation: scf-scan 5s infinite; pointer-events: none; }
@keyframes scf-scan { 0% { transform: translateY(0); opacity: 0; } 5% { opacity: 1; } 20% { transform: translateY(0); } 32% { transform: translateY(35px); } 44% { transform: translateY(35px); } 56% { transform: translateY(70px); } 70% { transform: translateY(70px); opacity: 1; } 80%, 100% { transform: translateY(70px); opacity: 0; } }
@keyframes scf-badge { 0%, 8% { transform: scale(.4); opacity: 0; } 16%, 100% { transform: none; opacity: 1; } }
.scf-fill { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.scf-fill div { display: grid; grid-template-columns: 96px minmax(0, 1fr) 36px; align-items: center; gap: 8px; font-size: 12px; color: var(--ink-2); }
.scf-fill div > i { height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .9); overflow: hidden; }
.scf-fill div > i > i { display: block; height: 100%; width: var(--w); border-radius: 3px; background: linear-gradient(90deg, #8fb0f7, #b49af0); animation: scf-grow 1.4s var(--d) var(--sc-ease) both; }
.scf-fill b { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
@keyframes scf-grow { from { width: 0; } }

/* Анимации виджетов — только когда блок виден */
.scf-card:not(.is-live) *, .scf-card:not(.is-live) { animation-play-state: paused !important; }

/* ── Адаптив ── */
@media (max-width: 1279px) {
    .sc-app { grid-template-columns: minmax(0, 1fr) 360px; }
    .sc-day { height: 56px; padding: 6px; }
    .sc-tag { font-size: 8.5px; padding: 2px 4px; right: 3px; top: 4px; letter-spacing: -.01em; }
    .sc-ctl { flex-direction: column; }
    .sc-steps { width: 100%; }
    .scf-wait, .scf-age { grid-column: span 6; }
    .scf-card { grid-column: span 6; }
    .scf-seats { grid-template-columns: repeat(6, 34px); }
    .scf-chk { grid-column: span 12; }
}
@media (max-width: 899px) {
    .sc-app { grid-template-columns: minmax(0, 1fr); }
    .sc-side { border-left: 0; border-top: 1px solid var(--line); }
}
@media (max-width: 767px) {
    .sc-app { margin-top: 28px; border-radius: 14px; }
    .sc-cal { padding: 16px 12px 14px; }
    .sc-coach { display: none; }
    .sc-cal-bar { flex-wrap: wrap; }
    .sc-dow, .sc-week { gap: 3px; }
    .sc-week { padding: 2px; margin: -2px 0; border-radius: 10px; }
    .sc-grid { gap: 4px; }
    .sc-dow span { padding-left: 2px; font-size: 10px; text-align: center; }
    .sc-day { height: 46px; padding: 4px; border-radius: 7px; align-items: center; }
    .sc-dn { font-size: 12px; }
    .sc-no { font-size: 9px; letter-spacing: -.02em; }
    .sc-day.is-done .sc-no::before { content: ''; }
    .sc-tag { display: none; }
    .sc-day.is-sched::after { display: none; }
    .sc-wk-flag { right: 3px; top: auto; bottom: 3px; translate: none; height: 20px; font-size: 11px; }
    .sc-week.is-frz:not(:hover) .sc-wk-flag { padding: 0 5px; }
    .sc-side { padding: 14px 12px; }
    .sc-ribbon li span { font-size: 9px; }
    .sc-steps { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .sc-steps li:not(:last-child)::after { left: 17px; right: auto; top: 34px; width: 2px; height: 8px; }
    .sc-st-t small { display: none; }
    .sc-st-t b { padding-top: 7px; }
    .sc-ctl-btns { width: 100%; }
    .sc-ctl-btns .btn { flex: 1; }
    .scf-grid { grid-template-columns: minmax(0, 1fr); margin-top: 28px; }
    .scf-card, .scf-wait, .scf-age, .scf-chk { grid-column: auto; }
    .scf-vis { padding: 16px; }
    .scf-seats { grid-template-columns: repeat(6, 32px); gap: 7px; }
    .scf-seats li, .scf-queue li { width: 32px; height: 32px; }
    .scf-queue { flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 12px; }
    .scf-wait .scf-vis { height: 262px; }
    .scf-dial { width: 112px; height: 112px; }
}
@media (prefers-reduced-motion: reduce) {
    .sc *, .scf * { animation: none !important; transition: none !important; }
    .scf-sign, .scf-lk-off, .scf-done { display: none; }
    .scf-chip { transform: translateY(50px); }
}