.screen-program__header { scroll-margin-top:90px; }
.screen-program__edit-banner { display:flex; align-items:flex-start; gap:14px; padding:18px 20px; margin-bottom:22px; border:1px solid var(--md-sys-color-primary); border-radius:16px; background:var(--md-sys-color-primary-container); color:var(--md-sys-color-on-primary-container); }
.screen-program__edit-banner[hidden] { display:none; }
.screen-program__edit-banner > .icon { flex:none; margin-top:2px; }
.screen-program__edit-copy { min-width:0; overflow-wrap:anywhere; }
.screen-program__edit-copy p { margin:0; }
.screen-program__edit-copy .md-body-small { margin-top:6px; line-height:1.6; }
.screen-program__preview { padding: 22px 26px; margin-bottom: 24px; border-radius: 22px; background: #182e38; color: #e1f3fb; border: 1px solid #294653; }
.screen-program__preview-head { display:flex; justify-content:space-between; gap:12px; margin-bottom:18px; }
.screen-program__preview > p { margin:14px 0 0; color:#a9c1ce; }
.screen-program__wall { display:grid; grid-template-columns:repeat(var(--screen-count,3),minmax(0,1fr)); gap:7px; max-width:1080px; margin:auto; }
.screen-program__wall-screen { position:relative; min-width:0; aspect-ratio:16 / 9; background:#071016; border:3px solid #617785; border-radius:7px; overflow:hidden; box-shadow:0 6px 15px #0004; }
.screen-program__wall-media { width:100%; height:100%; display:block; }
.screen-program__wall-media.screen-program__source-preview--empty { display:grid; place-items:center; color:#688999; }
.screen-program__wall-number { position:absolute; left:6px; bottom:6px; min-width:24px; height:24px; display:grid; place-items:center; border-radius:6px; background:#142b37dd; font-size:12px; font-weight:700; }
.screen-program__editor { display:grid; grid-template-columns:minmax(0,1fr) 320px; align-items:start; gap:22px; margin-bottom:24px; }
.screen-program__main { display:grid; gap:22px; min-width:0; }
.screen-program__section { overflow:hidden; }
.screen-program__section-head { padding:20px 22px; display:flex; gap:13px; align-items:flex-start; border-bottom:1px solid var(--md-sys-color-outline-variant); }
.screen-program__section-head h2,.screen-program__section-head p { margin:0; }
.screen-program__section-head p { margin-top:4px; }
.screen-program__step { display:grid; place-items:center; flex:none; width:30px; height:30px; border-radius:9px; color:var(--md-sys-color-primary); background:var(--md-sys-color-primary-container); font-weight:700; }
.screen-program__section-body { padding:22px; display:grid; gap:20px; }
.screen-program__section .md-segmented { display:flex; width:100%; }
.screen-program__section .md-segmented__option { flex:1; min-width:0; min-height:44px; height:auto; padding:10px; white-space:normal; }
.screen-program__section .md-segmented__option > .icon { flex:none; }
.screen-program__setting,.screen-program__hardware { display:grid; gap:10px; }
.screen-program__setting > p,.screen-program__hardware > p { margin:0; }
.screen-program__installation { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.screen-program__installation-option { display:grid; grid-template-columns:26px 1fr; gap:8px 10px; text-align:left; padding:17px; border:1px solid var(--md-sys-color-outline-variant); border-radius:14px; background:var(--md-sys-color-surface-container-lowest); color:var(--md-sys-color-on-surface); cursor:pointer; font:inherit; }
.screen-program__installation-option > .md-body-small { grid-column:2; line-height:1.55; }
.screen-program__installation-option.is-selected { border-color:var(--md-sys-color-primary); box-shadow:inset 0 0 0 1px var(--md-sys-color-primary); background:#f0fbff; }
.screen-program__installation-option > .icon { color:var(--md-sys-color-primary); }
.screen-program__sources { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; }
.screen-program__source { min-width:0; border:1px solid var(--md-sys-color-outline-variant); border-radius:14px; overflow:hidden; background:var(--md-sys-color-surface-container-lowest); }
.screen-program__source:only-child { grid-column:1 / -1; }
.screen-program__source-head { display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; align-items:center; padding:15px 16px; border-bottom:1px solid var(--md-sys-color-outline-variant); background:#f5fafb; }
.screen-program__source-head h3 { margin:0; }
.screen-program__source-button { display:block; width:100%; padding:0; text-align:left; border:0; border-top:1px solid var(--md-sys-color-outline-variant); border-bottom:1px solid var(--md-sys-color-outline-variant); background:var(--md-sys-color-surface-container-low); color:inherit; cursor:pointer; font:inherit; }
.screen-program__source-preview { width:100%; aspect-ratio:16 / 9; display:block; object-fit:contain; background:#14232c; }
.screen-program__source-preview--empty { display:grid; place-items:center; color:#95b2c0; }
.screen-program__source-preview--empty > .icon { width:32px; height:32px; }
.screen-program__source-name { display:block; padding:11px 14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.screen-program__fit { display:block; width:100%; min-width:0; min-height:38px; padding:8px; border:1px solid var(--md-sys-color-outline-variant); border-radius:8px; background:var(--md-sys-color-surface-container-lowest); color:inherit; font:inherit; font-size:12px; }
.screen-program__queue-total { flex:none; color:#00687e; background:#e5f3f6; padding:5px 9px; border-radius:8px; }
.screen-program__queue { margin:0; padding:0 16px; list-style:none; max-height:650px; overflow-y:auto; overscroll-behavior:contain; }
.screen-program__queue-item { display:grid; grid-template-columns:72px minmax(0,1fr) auto; gap:10px; padding:16px 0; border-bottom:1px solid var(--md-sys-color-outline-variant); }
.screen-program__queue-item:last-child { border-bottom:0; }
.screen-program__queue-item:focus { outline:2px solid var(--md-sys-color-primary); outline-offset:-2px; border-radius:8px; }
.screen-program__queue-item.is-missing { color:var(--md-sys-color-error); }
.screen-program__queue-thumb { position:relative; align-self:start; border-radius:7px; overflow:hidden; }
.screen-program__queue-thumb .screen-program__source-preview { min-height:44px; }
.screen-program__queue-order { position:absolute; bottom:3px; left:3px; min-width:20px; height:20px; display:grid; place-items:center; border-radius:5px; background:#173844ed; color:white; font-size:11px; font-weight:700; }
.screen-program__queue-info { min-width:0; align-self:center; }
.screen-program__queue-info p { margin:0; overflow-wrap:anywhere; }
.screen-program__queue-info .md-body-small { margin-top:5px; line-height:1.5; }
.screen-program__queue-controls { display:flex; align-items:start; gap:2px; }
.screen-program__queue-controls .md-icon-button { width:34px; height:36px; }
.screen-program__item-settings { grid-column:2 / -1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.screen-program__fit-label,.screen-program__image-duration { display:grid; gap:5px; min-width:0; font-size:11px; color:var(--md-sys-color-on-surface-variant); }
.screen-program__image-duration { grid-template-columns:minmax(0,1fr) auto; align-items:center; column-gap:6px; }
.screen-program__image-duration > span:first-child { grid-column:1 / -1; }
.screen-program__image-duration input { width:100%; min-width:0; min-height:38px; padding:8px; border:1px solid var(--md-sys-color-outline-variant); border-radius:8px; color:var(--md-sys-color-on-surface); background:var(--md-sys-color-surface-container-lowest); font:inherit; font-size:13px; }
.screen-program__image-duration input[aria-invalid="true"] { border-color:var(--md-sys-color-error); }
.screen-program__queue-footer { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; padding:14px 16px; border-top:1px solid var(--md-sys-color-outline-variant); }
.screen-program__queue-empty,.screen-program__queue-note,.screen-program__queue-error { margin:0; padding:14px 16px; line-height:1.6; }
.screen-program__queue-empty { text-align:center; padding:28px 20px; }
.screen-program__queue-error { color:var(--md-sys-color-error); }
.screen-program__aside { position:sticky; top:88px; }
.screen-program__summary { margin:0; display:grid; gap:11px; padding:16px; border-radius:12px; background:var(--md-sys-color-surface-container-low); font-size:13px; }
.screen-program__summary > div { display:flex; justify-content:space-between; gap:14px; }
.screen-program__summary dt { color:var(--md-sys-color-on-surface-variant); }
.screen-program__summary dd { text-align:right; margin:0; font-weight:600; }
.screen-program__error { color:var(--md-sys-color-error); }
.screen-program__picker { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; max-height:55vh; overflow:auto; }
.screen-program__pick { position:relative; display:grid; gap:7px; padding:0 0 10px; overflow:hidden; border:1px solid var(--md-sys-color-outline-variant); border-radius:12px; text-align:left; color:inherit; background:var(--md-sys-color-surface-container-lowest); cursor:pointer; font:inherit; }
.screen-program__pick.is-selected { border-color:var(--md-sys-color-primary); box-shadow:inset 0 0 0 1px var(--md-sys-color-primary); background:#edf9fb; }
.screen-program__pick:disabled { cursor:default; opacity:.45; }
.screen-program__pick-order { position:absolute; top:8px; right:8px; display:grid; place-items:center; min-width:28px; height:28px; padding:0 5px; background:#00687e; color:#fff; border:2px solid #fff; border-radius:50%; font-size:13px; font-weight:700; }
.screen-program__selection-order { display:flex; flex-wrap:wrap; gap:6px; padding:0; margin:0; max-height:100px; overflow:auto; list-style:none; }
.screen-program__selection-order > li { max-width:100%; padding:5px 9px; border-radius:7px; background:#e8f4f6; color:#295b67; font-size:12px; overflow-wrap:anywhere; }
.screen-program__selection-order[hidden] { display:none; }
.screen-program__pick-name { padding:0 10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; }
.screen-program__pick > .md-body-small { padding:0 10px; }
.screen-program__pick:hover,.screen-program__source-button:hover { background:var(--md-sys-color-primary-container); }
.screen-program__job { margin-bottom:24px; border-color:var(--md-sys-color-primary); }
.screen-program__job[data-status="ready"] { border-color:var(--md-sys-color-success); }
.screen-program__job[data-status="failed"] { border-color:var(--md-sys-color-error); }
.screen-program__job-body { padding:24px; display:grid; gap:15px; }
.screen-program__job-body p,.screen-program__job-body h2 { margin:0; }
.screen-program__job-status { display:flex; align-items:center; gap:12px; }
.screen-program__job-status > .icon { width:30px; height:30px; color:var(--md-sys-color-primary); }
.screen-program__jobs { display:grid; gap:8px; }
.screen-program__history-row { display:flex; gap:14px; width:100%; align-items:center; padding:14px; border:1px solid var(--md-sys-color-outline-variant); border-radius:12px; background:var(--md-sys-color-surface-container-lowest); color:inherit; cursor:pointer; text-align:left; font:inherit; }
.screen-program__history-icon { padding:10px; background:var(--md-sys-color-surface-container); border-radius:10px; }
.screen-program__history-name { display:grid; gap:3px; flex:1; min-width:0; }
.screen-program__history-name > span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.screen-program__history-row:hover { border-color:var(--md-sys-color-primary); }
@media (min-width:1600px) { .screen-program__sources { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start; } }
@media (max-width:1100px) { .screen-program__editor { grid-template-columns:minmax(0,1fr); } .screen-program__aside { position:static; } }
@media (max-width:640px) { .screen-program__installation { grid-template-columns:1fr; } .screen-program__sources { grid-template-columns:1fr; } .screen-program__preview { padding:16px 12px; } .screen-program__preview-head { flex-direction:column; gap:3px; } .screen-program__wall { gap:3px; } .screen-program__wall-screen { border-width:1px; border-radius:3px; } .screen-program__wall-number { min-width:16px; height:16px; left:2px; bottom:2px; font-size:10px; } .screen-program__section-head,.screen-program__section-body { padding:16px; } .screen-program__picker { grid-template-columns:repeat(2,minmax(0,1fr)); } .screen-program__history-row { flex-wrap:wrap; } }
@media (max-width:640px) { .screen-program__queue { padding:0 12px; max-height:none; overflow:visible; } .screen-program__queue-item { grid-template-columns:56px minmax(0,1fr); } .screen-program__queue-controls { grid-column:2; justify-content:flex-end; } .screen-program__item-settings { grid-column:1 / -1; } .screen-program__queue-controls .md-icon-button { width:38px; height:38px; } .screen-program__source-head,.screen-program__queue-footer { padding:12px; } }