.schedule-page { position: relative; display: flex; min-height: 0; flex: 1; flex-direction: column; gap: 10px; padding: 10px; overflow: hidden; } .schedule-toolbar { display: flex; min-height: 56px; align-items: center; justify-content: space-between; padding: 0 14px; border: 1px solid #dce4ec; border-radius: 7px; background: #fff; box-shadow: 0 2px 7px rgb(25 46 73 / 3%); } .schedule-toolbar > div:first-child { display: flex; align-items: baseline; gap: 10px; } .schedule-toolbar strong { color: #1c2d42; font-size: 16px; } .schedule-toolbar > div:first-child span { color: #8b99a9; font-size: 11px; } .schedule-toolbar__actions { display: flex; align-items: center; gap: 8px; } .schedule-toolbar__actions button, .schedule-canvas-title button, .schedule-canvas-status button { display: inline-flex; min-height: 32px; align-items: center; justify-content: center; gap: 5px; padding: 0 12px; border: 1px solid #dce5ee; border-radius: 6px; color: #526477; background: #fff; cursor: pointer; font-size: 12px; font-weight: 600; } .schedule-toolbar__actions button:hover:not(:disabled), .schedule-canvas-title button:hover, .schedule-canvas-status button:hover { border-color: #aac6e5; color: #126aca; background: #f6faff; } .schedule-toolbar__actions button:disabled { cursor: not-allowed; opacity: .5; } .schedule-toolbar__actions .schedule-action--primary { border-color: #126fd4; color: #fff; background: #126fd4; } .schedule-toolbar__actions .schedule-action--primary:hover:not(:disabled) { border-color: #0e5fb9; color: #fff; background: #0e5fb9; } .schedule-toolbar__actions .schedule-action--danger { border-color: #f1cccc; color: #c14c4c; } .schedule-toolbar__actions .schedule-action--run { border-color: #159466; color: #fff; background: #159466; } .schedule-toolbar__actions .schedule-action--run:hover:not(:disabled) { border-color: #0f7d55; color: #fff; background: #0f7d55; } .schedule-workbench { display: grid; min-height: 0; flex: 1; grid-template-columns: 278px minmax(420px, 1fr) 316px; gap: 10px; } .schedule-left, .schedule-center, .schedule-right { min-height: 0; border: 1px solid #dce4ec; border-radius: 7px; background: #fff; box-shadow: 0 2px 7px rgb(25 46 73 / 3%); } .schedule-left { display: grid; overflow: hidden; grid-template-rows: minmax(210px, 42%) minmax(260px, 58%); } .schedule-panel { display: flex; min-height: 0; flex-direction: column; overflow: hidden; } .schedule-list-panel { border-bottom: 1px solid #e3e9ef; } .schedule-panel__title { display: flex; min-height: 48px; align-items: center; justify-content: space-between; padding: 0 12px; } .schedule-panel__title > div { display: flex; align-items: center; gap: 7px; } .schedule-panel__title strong { color: #223247; font-size: 14px; } .schedule-panel__title span { display: inline-grid; min-width: 20px; height: 20px; place-items: center; padding: 0 5px; border-radius: 10px; color: #718195; background: #eef3f8; font-size: 10px; } .schedule-search { display: flex; min-height: 35px; align-items: center; gap: 7px; margin: 0 10px 7px; padding: 0 9px; border: 1px solid #dce5ed; border-radius: 6px; color: #95a3b2; background: #fff; } .schedule-search:focus-within { border-color: #8db9e8; box-shadow: 0 0 0 3px rgb(38 124 216 / 8%); } .schedule-search input { min-width: 0; flex: 1; border: 0; outline: 0; color: #33475d; background: transparent; font-size: 12px; } .schedule-search input::placeholder { color: #a6b2be; } .schedule-list, .artifact-list { min-height: 0; padding: 0 8px 9px; overflow: auto; } .schedule-card { position: relative; display: flex; width: 100%; min-height: 62px; align-items: center; gap: 9px; margin-bottom: 6px; padding: 8px 10px; border: 1px solid #e1e8ef; border-radius: 6px; color: #526276; background: #fff; cursor: pointer; text-align: left; } .schedule-card:hover { border-color: #b9cfe7; background: #f8fbff; } .schedule-card--active { border-color: #89b8ec; color: #1c64b1; background: #edf6ff; box-shadow: inset 3px 0 #247fdc; } .schedule-card > span:last-child { display: flex; min-width: 0; flex-direction: column; gap: 4px; } .schedule-card strong { max-width: 205px; overflow: hidden; color: #283b50; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; } .schedule-card small { color: #8d9aab; font-size: 10px; } .schedule-status { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 50%; background: #aeb9c5; box-shadow: 0 0 0 3px rgb(142 156 171 / 11%); } .schedule-status.is-enabled { background: #18b979; box-shadow: 0 0 0 3px rgb(24 185 121 / 12%); } .artifact-tip { margin: 0 11px 8px; padding: 7px 8px; border-radius: 5px; color: #6f8297; background: #f3f7fb; font-size: 10px; line-height: 1.45; } .artifact-card { display: flex; min-height: 58px; align-items: center; gap: 9px; margin-bottom: 6px; padding: 8px 9px; border: 1px solid #e2e9f0; border-radius: 6px; background: #fff; cursor: grab; user-select: none; } .artifact-card:hover { border-color: #98bee7; box-shadow: 0 3px 10px rgb(40 96 155 / 8%); transform: translateY(-1px); } .artifact-card:active { cursor: grabbing; } .artifact-card__icon { display: grid; width: 31px; height: 31px; flex: 0 0 auto; place-items: center; border-radius: 6px; } .artifact-card__icon--notebook { color: #e05e53; background: #fff0ee; } .artifact-card__icon--python { color: #326fc1; background: #eaf3ff; } .artifact-card > span:last-child { display: flex; min-width: 0; flex-direction: column; gap: 4px; } .artifact-card strong { max-width: 190px; overflow: hidden; color: #2f4257; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; } .artifact-card small { color: #8e9bab; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; } .schedule-empty { margin: 18px 10px; color: #95a2b0; font-size: 11px; line-height: 1.6; text-align: center; } .schedule-center { display: flex; overflow: hidden; flex-direction: column; } .schedule-canvas-title { display: flex; min-height: 53px; align-items: center; justify-content: space-between; padding: 0 12px; border-bottom: 1px solid #e4eaf0; } .schedule-canvas-title > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; } .schedule-canvas-title strong { color: #27394d; font-size: 14px; } .schedule-canvas-title span { overflow: hidden; color: #93a0ae; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; } .schedule-canvas-title button { min-height: 28px; color: #b25a4f; } .schedule-canvas { position: relative; min-height: 0; flex: 1; overflow: auto; background-color: #f9fbfd; background-image: linear-gradient(#e7edf3 1px, transparent 1px), linear-gradient(90deg, #e7edf3 1px, transparent 1px), linear-gradient(#f1f4f7 1px, transparent 1px), linear-gradient(90deg, #f1f4f7 1px, transparent 1px); background-position: -1px -1px; background-size: 80px 80px, 80px 80px, 16px 16px, 16px 16px; } .schedule-canvas.is-linking { cursor: crosshair; } .schedule-canvas__surface { position: relative; } .schedule-edges { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; overflow: visible; } .schedule-edge-line { fill: none; stroke: #4e92db; stroke-width: 2.2; transition: stroke .15s, stroke-width .15s; } .schedule-edge-hit { fill: none; stroke: transparent; stroke-width: 14; cursor: pointer; pointer-events: stroke; } .schedule-edges g.is-selected .schedule-edge-line { stroke: #df8142; stroke-width: 3.4; } .schedule-node { position: absolute; z-index: 2; display: flex; flex-direction: column; padding: 11px 12px 9px; border: 1px solid #91b7de; border-radius: 8px; color: #34516f; background: #fff; box-shadow: 0 7px 18px rgb(36 75 117 / 11%); cursor: grab; touch-action: none; user-select: none; } .schedule-context-menu { position: fixed; z-index: 60; min-width: 168px; padding: 5px; border: 1px solid #d9e3ec; border-radius: 8px; background: #fff; box-shadow: 0 14px 36px rgb(14 35 57 / 22%); } .schedule-context-menu button { display: flex; width: 100%; align-items: center; gap: 9px; padding: 9px 10px; border: 0; border-radius: 5px; color: #c23b3b; background: transparent; font: inherit; font-size: 12px; text-align: left; cursor: pointer; } .schedule-context-menu button:hover { background: #fff0f0; } .schedule-context-menu button.schedule-context-menu__action { color: #173a5e; } .schedule-context-menu button.schedule-context-menu__action:hover { background: #eef6ff; } .schedule-node:active { cursor: grabbing; } .schedule-node.is-selected { border-color: #1978d4; box-shadow: 0 0 0 3px rgb(25 120 212 / 11%), 0 8px 22px rgb(36 75 117 / 13%); } .schedule-node__heading { display: flex; align-items: center; gap: 7px; } .schedule-node__heading strong { min-width: 0; flex: 1; overflow: hidden; color: #243b53; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; } .schedule-node__heading > button { display: grid; width: 23px; height: 23px; place-items: center; padding: 0; border: 0; border-radius: 4px; color: #8b99a7; background: transparent; cursor: pointer; } .schedule-node__heading > button:hover { color: #1978d4; background: #edf5fd; } .schedule-node__type { display: grid; width: 25px; height: 25px; flex: 0 0 auto; place-items: center; border-radius: 5px; } .schedule-node__type--notebook { color: #da5c52; background: #fff0ef; } .schedule-node__type--python { color: #316fbf; background: #eaf3ff; } .schedule-node > p { margin: 8px 0 6px; overflow: hidden; color: #7e8d9d; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; } .schedule-node footer { display: flex; align-items: center; justify-content: space-between; padding-top: 6px; border-top: 1px solid #edf1f5; } .schedule-node footer span { max-width: 145px; overflow: hidden; color: #8d9baa; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; } .schedule-node footer b { color: #1978d4; font-size: 10px; } .schedule-node__port { position: absolute; z-index: 4; top: calc(50% - 7px); width: 14px; height: 14px; padding: 0; border: 2px solid #4e92db; border-radius: 50%; background: #fff; cursor: crosshair; } .schedule-node__port:hover, .schedule-node__port.is-active { border-color: #176ec5; background: #4e92db; box-shadow: 0 0 0 4px rgb(45 124 207 / 16%); } .schedule-node__port--in { left: -8px; } .schedule-node__port--out { right: -8px; } .schedule-canvas-empty { position: sticky; z-index: 0; left: 50%; top: 46%; display: flex; width: 350px; margin: 190px auto 0; flex-direction: column; align-items: center; color: #9aa8b6; text-align: center; } .schedule-canvas-empty > svg { margin-bottom: 12px; color: #8cb4de; } .schedule-canvas-empty strong { color: #567089; font-size: 14px; } .schedule-canvas-empty p { margin: 7px 0 13px; font-size: 11px; } .schedule-canvas-empty button { display: inline-flex; min-height: 32px; align-items: center; gap: 4px; padding: 0 12px; border: 1px solid #2580da; border-radius: 6px; color: #fff; background: #2580da; cursor: pointer; font-size: 11px; } .schedule-canvas-status { display: flex; min-height: 35px; align-items: center; gap: 14px; padding: 0 12px; border-top: 1px solid #e4eaf0; color: #8b99a9; background: #fff; font-size: 10px; } .schedule-canvas-status span:first-child { color: #b17a48; } .schedule-canvas-status span.is-valid { color: #16875b; } .schedule-canvas-status button { min-height: 24px; margin-left: auto; padding: 0 8px; color: #bd504b; font-size: 10px; } .schedule-right { display: grid; overflow: hidden; grid-template-rows: repeat(2, minmax(0, 1fr)); } .schedule-inspector-scroll { min-height: 0; overflow: auto; } .schedule-inspector { display: flex; min-height: 100%; flex-direction: column; } .schedule-inspector > section { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-bottom: 1px solid #e7ecf1; } .schedule-inspector h3 { margin: 0 0 2px; color: #273b50; font-size: 13px; } .schedule-inspector label { display: flex; flex-direction: column; gap: 5px; } .schedule-inspector label > span { color: #758497; font-size: 10px; font-weight: 600; } .schedule-inspector input:not([type="checkbox"]), .schedule-inspector select, .schedule-inspector textarea { width: 100%; border: 1px solid #dce4ec; border-radius: 5px; outline: 0; color: #32475d; background: #fff; font-size: 11px; } .schedule-inspector input:not([type="checkbox"]), .schedule-inspector select { height: 33px; padding: 0 8px; } .schedule-inspector textarea { padding: 7px 8px; line-height: 1.5; resize: vertical; } .schedule-inspector input:focus, .schedule-inspector select:focus, .schedule-inspector textarea:focus { border-color: #81b2e7; box-shadow: 0 0 0 3px rgb(38 124 216 / 8%); } .schedule-switch-row { flex-direction: row !important; align-items: center; justify-content: space-between; padding: 8px 9px; border-radius: 6px; background: #f5f8fb; } .schedule-switch-row > span { display: flex; flex-direction: column; gap: 2px; } .schedule-switch-row b { color: #45596f; font-size: 11px; } .schedule-switch-row small { color: #94a1ae; font-size: 9px; font-weight: 400; } .schedule-switch-row input { width: 34px; height: 18px; accent-color: #1978d4; } .inspector-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; } .inspector-secondary-button, .inspector-primary-button, .inspector-danger-button { display: flex; min-height: 34px; align-items: center; justify-content: center; border-radius: 6px; cursor: pointer; font-size: 11px; font-weight: 650; } .inspector-secondary-button { border: 1px solid #bcd2e9; color: #2871bb; background: #f7fbff; } .inspector-primary-button { margin: 14px; border: 1px solid #1978d4; color: #fff; background: #1978d4; } .inspector-danger-button { border: 1px solid #efc6c6; color: #bd4f4f; background: #fff7f7; } .inspector-primary-button:disabled, .inspector-secondary-button:disabled, .inspector-danger-button:disabled { cursor: not-allowed; opacity: .55; } .cron-preview-list { margin: 0; padding: 8px 8px 8px 28px; border-radius: 5px; color: #5d7186; background: #f5f8fb; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; line-height: 1.7; } .schedule-next-run { display: flex; align-items: center; justify-content: space-between; padding: 8px 9px; border-radius: 5px; color: #8b99a8; background: #f5f8fb; font-size: 10px; } .schedule-next-run strong { color: #425970; font-size: 10px; } .schedule-inspector-empty { display: flex; min-height: 100%; flex-direction: column; align-items: center; justify-content: center; padding: 30px; color: #9aa8b6; text-align: center; } .schedule-inspector-empty svg { margin-bottom: 10px; color: #93b4d6; } .schedule-inspector-empty strong { color: #516a82; font-size: 14px; } .schedule-inspector-empty p { font-size: 11px; line-height: 1.6; } .schedule-run-history { display: flex; min-height: 0; flex-direction: column; border-top: 1px solid #e0e7ee; background: #fbfcfe; } .schedule-run-history > header { display: flex; min-height: 44px; align-items: center; justify-content: space-between; padding: 0 12px; border-bottom: 1px solid #e8edf2; background: #fff; } .schedule-run-history > header > div { display: flex; align-items: center; gap: 7px; } .schedule-run-history > header strong { color: #2b4056; font-size: 12px; } .schedule-run-history > header span { display: inline-grid; min-width: 18px; height: 18px; place-items: center; border-radius: 9px; color: #71849a; background: #edf2f7; font-size: 9px; } .schedule-run-history > header button { display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid #dce5ee; border-radius: 5px; color: #66809a; background: #fff; cursor: pointer; } .schedule-run-history > header button:disabled { cursor: not-allowed; opacity: .45; } .schedule-run-list { display: flex; min-height: 0; flex: 1; flex-direction: column; gap: 7px; padding: 9px; overflow: auto; } .schedule-run-list > p { margin: auto; padding: 12px; color: #929fac; font-size: 10px; line-height: 1.6; text-align: center; } .schedule-run-card { flex: 0 0 auto; overflow: hidden; border: 1px solid #e1e8ef; border-radius: 6px; background: #fff; } .schedule-run-card.is-expanded { border-color: #b9d6f1; box-shadow: 0 3px 10px rgb(38 117 185 / 8%); } .schedule-run-summary { display: grid; width: 100%; align-items: center; gap: 7px; padding: 8px; border: 0; color: inherit; background: #fff; grid-template-columns: 8px minmax(0, 1fr) auto auto; text-align: left; } .schedule-run-summary:hover { background: #f7fbff; } .schedule-run-summary-copy { display: flex; min-width: 0; flex-direction: column; gap: 2px; } .schedule-run-summary-copy strong { color: #425970; font-size: 10px; } .schedule-run-summary-copy small { color: #8b99a8; font-size: 8px; } .schedule-run-summary-copy > span { overflow: hidden; color: #b65353; font-size: 8px; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; } .schedule-run-summary code { color: #8b9bad; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 8px; } .schedule-run-result-button { min-height: 27px; padding: 0 9px; border: 1px solid #bcd4e9; border-radius: 5px; color: #2374ba; background: #f5faff; cursor: pointer; font-size: 9px; font-weight: 650; white-space: nowrap; } .schedule-run-result-button:hover { border-color: #7eafe0; background: #eaf5ff; } .schedule-run-chevron { display: grid; margin-top: 1px; place-items: center; color: #8092a5; transition: transform .16s ease; } .schedule-run-chevron.is-open { transform: rotate(90deg); } .schedule-run-detail { min-height: 0; padding: 18px; overflow: auto; background: #f8fbfe; } .schedule-run-result-backdrop { position: fixed; z-index: 40; inset: 0; border: 0; background: rgb(10 27 45 / 46%); cursor: default; backdrop-filter: blur(2px); } .schedule-run-result-modal { position: fixed; z-index: 41; top: 50%; left: 50%; display: grid; width: min(780px, calc(100vw - 48px)); max-height: min(760px, calc(100vh - 64px)); overflow: hidden; border: 1px solid #d8e2eb; border-radius: 12px; background: #fff; box-shadow: 0 24px 80px rgb(8 27 48 / 30%); grid-template-rows: auto minmax(0, 1fr); transform: translate(-50%, -50%); animation: modal-in .18s ease-out; } .schedule-run-result-modal__header { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 20px; border-bottom: 1px solid #e3eaf0; background: #fff; } .schedule-run-result-modal__header > div { display: grid; min-width: 0; align-items: center; gap: 5px 10px; grid-template-columns: auto auto; } .schedule-run-result-modal__header span { color: #1f344a; font-size: 17px; font-weight: 700; } .schedule-run-result-modal__header strong { justify-self: start; padding: 3px 8px; border-radius: 11px; color: #17805a; background: #e8f7f1; font-size: 10px; } .schedule-run-result-modal__header code { overflow: hidden; color: #8291a1; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; grid-column: 1 / -1; text-overflow: ellipsis; white-space: nowrap; } .schedule-run-result-modal .schedule-run-meta { margin-bottom: 14px; gap: 10px 18px; grid-template-columns: repeat(4, minmax(0, 1fr)); } .schedule-run-result-modal .schedule-run-meta dt { margin-bottom: 4px; font-size: 10px; } .schedule-run-result-modal .schedule-run-meta dd { font-size: 12px; } .schedule-run-result-modal .schedule-node-run-list { gap: 10px; } .schedule-run-result-modal .schedule-node-run { padding: 12px; border-radius: 7px; } .schedule-run-result-modal .schedule-node-run > header strong { font-size: 13px; } .schedule-run-result-modal .schedule-node-run > header > span:last-child, .schedule-run-result-modal .schedule-node-run-meta, .schedule-run-result-modal .schedule-node-run > p { font-size: 10px; } .schedule-run-result-modal .schedule-node-run-actions button { padding: 6px 10px; font-size: 10px; } .schedule-run-result-modal .schedule-node-log > header { padding: 8px 10px; font-size: 10px; } .schedule-run-result-modal .schedule-node-log pre, .schedule-run-result-modal .schedule-node-log > p { max-height: 260px; padding: 11px; font-size: 11px; } .run-detail-message { margin: 0; padding: 8px 4px; color: #8796a6; font-size: 9px; line-height: 1.5; text-align: center; } .run-detail-message.is-error { color: #bf5656; } .schedule-run-meta { display: grid; margin: 0 0 8px; gap: 6px 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); } .schedule-run-meta > div { min-width: 0; } .schedule-run-meta dt { margin-bottom: 1px; color: #95a2af; font-size: 8px; } .schedule-run-meta dd { margin: 0; overflow: hidden; color: #41566c; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; } .schedule-run-error { margin-bottom: 8px; padding: 7px; border: 1px solid #f0cece; border-radius: 5px; color: #a94f4f; background: #fff6f6; } .schedule-run-error code { font-size: 8px; font-weight: 700; } .schedule-run-error p { margin: 3px 0 0; font-size: 8px; line-height: 1.45; } .schedule-node-run-list { display: flex; flex-direction: column; gap: 7px; } .schedule-node-run { padding: 7px; border: 1px solid #dde7f0; border-radius: 5px; background: #fff; } .schedule-node-run > header { display: grid; align-items: start; gap: 6px; grid-template-columns: 8px minmax(0, 1fr) auto; } .schedule-node-run > header strong { overflow: hidden; color: #40566c; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; } .schedule-node-run > header > span:last-child { color: #71869a; font-size: 8px; } .schedule-node-run-meta { display: flex; flex-wrap: wrap; gap: 3px 8px; margin: 5px 0 0 14px; color: #8a98a7; font-size: 8px; } .schedule-node-run > p { margin: 5px 0 0 14px; color: #6c7e90; font-size: 8px; line-height: 1.45; } .schedule-node-run-actions { display: flex; gap: 6px; margin: 7px 0 0 14px; } .schedule-node-run-actions button { padding: 4px 7px; border: 1px solid #cbddeb; border-radius: 4px; color: #2878bd; background: #f5faff; cursor: pointer; font-size: 8px; } .schedule-node-run-actions button:disabled { cursor: not-allowed; opacity: .45; } .schedule-artifact-error { color: #b65353 !important; } .schedule-node-log { margin: 7px 0 0 14px; overflow: hidden; border: 1px solid #dce5ed; border-radius: 4px; background: #17212b; } .schedule-node-log > header { display: flex; align-items: center; justify-content: space-between; padding: 5px 7px; border-bottom: 1px solid #33414e; color: #c8d2dc; font-size: 8px; } .schedule-node-log > header small { color: #8292a1; } .schedule-node-log pre, .schedule-node-log > p { max-height: 210px; margin: 0; padding: 7px; overflow: auto; color: #d9e2ea; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 8px; line-height: 1.55; white-space: pre-wrap; word-break: break-word; } .run-status-dot { width: 7px; height: 7px; margin-top: 3px; border-radius: 50%; background: #9aa8b6; } .run-status-dot.is-queued { background: #e6a33c; } .run-status-dot.is-running { background: #2788dc; box-shadow: 0 0 0 3px rgb(39 136 220 / 12%); } .run-status-dot.is-succeeded { background: #25a46f; } .run-status-dot.is-failed, .run-status-dot.is-cancelled, .run-status-dot.is-timed_out { background: #d75b5b; } .run-status-dot.is-skipped { background: #a9b4bf; } .node-inspector-title { flex-direction: row !important; align-items: center; } .node-inspector-title > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; } .node-inspector-title small { color: #96a2af; font-size: 9px; } .node-inspector-title strong { overflow: hidden; color: #30465d; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; } .version-readonly { display: flex; flex-direction: column; gap: 5px; padding: 9px; border: 1px solid #dae6f2; border-radius: 6px; background: #f6faff; } .version-readonly strong { color: #35516e; font-size: 11px; } .version-readonly span { width: fit-content; padding: 2px 6px; border-radius: 8px; color: #176ec5; background: #e3f0fd; font-size: 9px; font-weight: 700; } .version-readonly small { overflow: hidden; color: #8190a0; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; } .json-editor { color: #37516a !important; background: #f8fafc !important; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px !important; } .node-inspector-actions { display: grid; grid-template-columns: 1fr 90px; gap: 7px; margin-top: auto; padding: 14px; } .node-inspector-actions .inspector-primary-button { margin: 0; } .schedule-busy { position: absolute; z-index: 20; right: 22px; bottom: 22px; display: flex; min-height: 38px; align-items: center; gap: 8px; padding: 0 13px; border: 1px solid #c9dcee; border-radius: 7px; color: #4e657d; background: #fff; box-shadow: 0 8px 25px rgb(28 56 86 / 15%); font-size: 11px; } .schedule-busy span { width: 15px; height: 15px; border: 2px solid #b9d4ef; border-top-color: #1978d4; border-radius: 50%; animation: spin .7s linear infinite; } @media (max-width: 1500px) { .schedule-workbench { grid-template-columns: 250px minmax(380px, 1fr) 292px; } .schedule-toolbar > div:first-child span, .schedule-canvas-title span { display: none; } } @media (max-width: 1280px) { .schedule-workbench { grid-template-columns: 225px minmax(360px, 1fr) 270px; } .schedule-toolbar__actions button { padding: 0 8px; } }