/* «Мои сценарии» (deploy107g-1, 11.10.2026): карточки, форма на странице ситуации */
.my-intro { margin: 4px 0 10px; font-size: 13px; }
.my-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; margin-bottom: 14px; }
.my-card { display: flex; flex-direction: column; gap: 4px; }
.my-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.my-px { margin-left: auto; font-variant-numeric: tabular-nums; font-weight: 600; }
.my-st { font-size: 12px; padding: 1px 8px; border-radius: 10px; background: var(--surface-2, rgba(0,0,0,.05)); }
.my-st-open { background: rgba(1,105,111,.12); color: #01696f; }
.my-st-target { background: rgba(67,122,34,.14); color: #437a22; }
.my-st-stop, .my-st-failed { background: rgba(161,44,123,.12); color: #a12c7b; }
.my-lv, .my-nums { font-variant-numeric: tabular-nums; }
.my-nums { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.my-sub { font-size: 12.5px; overflow-wrap: anywhere; }
.my-muted, .my-d { color: var(--text-muted); }
.my-d { font-size: 12px; margin-right: 4px; }
.my-over { color: #a12c7b; }
.my-msg { font-size: 13px; color: #01696f; margin-top: 4px; }
.my-form { display: flex; flex-direction: column; gap: 8px; padding: 10px; border: 1px solid var(--border, #d4d1ca); border-radius: 8px; margin-top: 6px; }
.my-t { font-weight: 600; }
.my-row { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.my-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.my-f { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; color: var(--text-muted); }
.my-f input, .my-f select { font: inherit; font-size: 14px; color: var(--text); min-height: 36px; padding: 4px 8px; border: 1px solid var(--border, #d4d1ca); border-radius: 6px; background: var(--surface, #fff); min-width: 0; width: 100%; box-sizing: border-box; }
.my-wide { max-width: 100%; }
.my-ck { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; cursor: pointer; }
.my-hist summary { cursor: pointer; font-size: 13px; color: var(--text-muted); }
.my-hist ol { margin: 4px 0 0; padding-left: 18px; font-size: 12.5px; }
.my-wi { overflow-x: auto; }
.my-tab { border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.my-tab th, .my-tab td { padding: 3px 8px; text-align: right; white-space: nowrap; }
.my-tab th:first-child, .my-tab td:first-child { text-align: left; }
@media (max-width: 600px) {
    .my-list { grid-template-columns: minmax(0, 1fr); }
    .my-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .my-px { margin-left: 0; }
}
.my-own .ov-h { overflow-wrap: anywhere; }
.my-own-acts { margin-bottom: 12px; }

/* 109 (11.10.2026): шаги вместо абзаца и шкала плана */
.my-steps { list-style: none; margin: 4px 0 12px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.my-steps li { display: flex; gap: 8px; align-items: flex-start; font-size: 12.5px; color: var(--text-muted); background: var(--surface); border: 1px solid var(--border); border-radius: 12px; padding: 8px 10px; }
.my-steps li b { flex: none; width: 22px; height: 22px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--accent, #3b82f6); color: #fff; font-size: 12px; }
.my-track { margin: 4px 0 2px; }
.my-track-l { position: relative; height: 8px; border-radius: 999px; background: var(--surface-2); }
.my-track-l > i { position: absolute; top: 0; bottom: 0; }
.my-tr-st { background: rgba(239, 83, 80, .45); border-radius: 999px 0 0 999px; }
.my-tr-tg { background: rgba(38, 166, 154, .5); border-radius: 0 999px 999px 0; }
.my-track.is-dn .my-tr-st { border-radius: 0 999px 999px 0; }
.my-track.is-dn .my-tr-tg { border-radius: 999px 0 0 999px; }
.my-tr-e { position: absolute; top: -3px; width: 2px; height: 14px; margin-left: -1px; background: var(--text); }
.my-tr-px { position: absolute; top: 50%; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: var(--accent, #3b82f6); border: 2px solid var(--surface); box-shadow: 0 0 0 1px var(--accent, #3b82f6); }
.my-track-k { display: flex; justify-content: space-between; font-size: 10.5px; color: var(--text-muted); margin-top: 3px; }
.my-track.is-dn .my-track-k { flex-direction: row-reverse; }
.my-tr-kst { color: #ef5350; }
.my-tr-ktg { color: #26a69a; }
.my-card { gap: 6px; }
.my-card .my-h b { font-size: 16px; }
.my-st-open { background: rgba(20, 184, 166, .14); color: #0f9d8f; }
.my-st-target, .hi-st-target { background: rgba(38, 166, 154, .15); color: #1f9d8f; }
.my-st-stop, .my-st-failed, .hi-st-stop, .hi-st-failed { background: rgba(239, 83, 80, .13); color: #e0524f; }
.my-over { color: #e0524f; }
@media (max-width: 700px) { .my-steps { grid-template-columns: minmax(0, 1fr); gap: 6px; } .my-steps li { padding: 6px 10px; } }

/* 114i (14.10.2026): «Мои сценарии» на всю ширину — список и выбранный сценарий.
   От 1200 px — две колонки (список ~360 px), 860–1200 px — сетка карточек, выбранная
   раскрывается на всю ширину над сеткой, на телефоне — экраны по очереди */
.my-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 2px 0 10px; }
.my-seg { display: inline-flex; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; background: var(--surface); }
.my-seg button { font: inherit; font-size: 13px; padding: 6px 12px; border: 0; background: none; color: var(--text-muted); cursor: pointer; white-space: nowrap; }
.my-seg button.is-on { background: rgba(20, 184, 166, .16); color: var(--text); }
.my-seg button:focus-visible, .my-it:focus-visible { outline: 2px solid #14b8a6; outline-offset: -2px; }
.my-sort { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--text-muted); }
.my-sort select { font: inherit; font-size: 13px; color: var(--text); min-height: 32px; padding: 2px 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); }
.my-md { display: grid; gap: 12px; margin-bottom: 14px; align-items: start; }
.my-side { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.my-main { min-width: 0; }
.my-it { display: flex; flex-direction: column; gap: 3px; width: 100%; text-align: left; font: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 9px 12px; cursor: pointer; }
.my-it:hover { border-color: rgba(20, 184, 166, .55); }
.my-it.is-on { border-color: #14b8a6; box-shadow: inset 3px 0 0 #14b8a6; background: color-mix(in srgb, #14b8a6 6%, var(--surface)); }
.my-it-h { display: flex; align-items: center; gap: 8px; }
.my-it-h b { font-size: 14.5px; }
.my-it-n { font-size: 12.5px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.my-it-r { font-size: 13px; font-variant-numeric: tabular-nums; min-height: 1em; }
.my-ev { margin-left: auto; font-size: 11px; padding: 1px 7px; border-radius: 10px; color: #b7791f; background: rgba(245, 158, 11, .14); border: 1px solid rgba(245, 158, 11, .5); }
.my-up { color: #1f9d8f; }
.my-dn { color: #e0524f; }
.my-back { display: none; margin-bottom: 8px; }
.my-main .my-card { margin: 0; }
@media (min-width: 1200px) {
    .my-md { grid-template-columns: 360px minmax(0, 1fr); }
    .my-side { position: sticky; top: 8px; max-height: calc(100vh - 140px); overflow: auto; padding-right: 2px; }
    .my-main .my-card .my-h b { font-size: 18px; }
}
@media (min-width: 861px) and (max-width: 1199.98px) {
    .my-side { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 8px; }
    .my-main { order: -1; }
    .my-main-empty { display: none; }
    .my-md.has-sel .my-back { display: inline-flex; }
}
@media (max-width: 860.98px) {
    .my-main-empty { display: none; }
    .my-md.has-sel .my-side { display: none; }
    .my-has-sel .my-steps, .my-has-sel .my-own-acts, .my-has-sel .my-own, .my-has-sel .my-bar { display: none; }
    .my-md.has-sel .my-back { display: inline-flex; }
    .my-bar { gap: 6px 10px; }
    .my-seg { width: 100%; }
    .my-seg button { flex: 1; padding: 7px 6px; font-size: 12.5px; }
}
