.motion-desk{margin:18px 0;background:#191624;border:1px solid #49394e;border-radius:12px;overflow:hidden}
.motion-desk-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 16px;flex-wrap:wrap}.motion-status{display:flex;align-items:center;gap:9px;font-size:13px;line-height:1.5;color:#c4e4da;min-width:0}.motion-status-dot{width:7px;height:7px;border-radius:50%;background:#71958a;flex:none}.is-processing .motion-status-dot{background:#63e5dc;animation:motion-breathe 1.5s ease-in-out infinite}.is-offline .motion-status-dot{background:#ffc38e}.is-offline .motion-status{color:#ffd0a2}
.motion-settings{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.motion-settings label{display:flex;gap:8px;align-items:center;color:#c2b7cd;font-size:12px}.motion-settings select{font-size:12px;min-height:38px;padding:6px 9px}.motion-settings button{font-size:12px;min-height:38px;padding:7px 11px}.motion-settings button[aria-pressed=true]{background:#334940;color:#d1fff0;border-color:#63b89b}
.motion-event-line{border-top:1px solid #393044;min-height:44px;padding:0 16px;position:relative}.motion-event-line>button,.motion-current-job{display:flex;align-items:baseline;gap:12px;width:100%;font-size:13px;line-height:1.6;min-height:46px;text-align:left;color:#ddd1e7;background:transparent;border:0;padding:10px 0;white-space:normal}.motion-event-line>button:hover{background:transparent;color:#f7effc}.motion-event-line>span{display:block;padding:12px 0;font-size:13px;color:#c2b7cd;line-height:1.6}.motion-event-line time{flex:none;color:#ac9cba;font-size:11px;font-variant-numeric:tabular-nums}.motion-event-line>button>span:nth-child(2),.motion-current-job>span{flex:1;min-width:0;overflow-wrap:anywhere}.is-processing .motion-event-line:before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#63e5dc,transparent);background-size:200% 100%;animation:motion-signal 2.4s linear infinite}
.motion-history{padding:0 16px;border-top:1px solid #393044}.motion-history summary{font-size:11px;color:#b9a9c9;cursor:pointer;min-height:34px;display:flex;align-items:center}.motion-history ol{list-style:none;padding:0;margin:0 0 10px}.motion-history li button{display:flex;align-items:baseline;gap:12px;text-align:left;font-size:12px;line-height:1.6;padding:8px 0;border:0;background:transparent;color:#ccbdd8;width:100%;white-space:normal}.motion-history time{font-size:11px;flex:none;color:#ac9cba}.motion-history li button:hover{background:transparent;color:#f4edf9}
.motion-observer{border-top:1px solid #4a5c55;padding:16px;background:#1e2928}.motion-observer[hidden]{display:none}.motion-observer>div{display:flex;justify-content:space-between;align-items:baseline;gap:15px;flex-wrap:wrap}.motion-observer h3{font-size:15px;line-height:1.5;margin:0}.motion-observer button{min-height:38px;font-size:12px}.motion-observer p{font-size:13px;line-height:1.6;color:#bce9de;margin:10px 0}.motion-observer ol{margin:10px 0;padding-left:18px;font-size:12px;line-height:1.8;color:#d0d9d4}.motion-observer time{color:#a9c4bb;font-variant-numeric:tabular-nums}.motion-observer small{display:block;font-size:11px;color:#b0c5bc;line-height:1.6}
.motion-job-badge{display:flex;align-items:center;gap:7px;font-size:11px;line-height:1.5;color:#b4eee5;padding:5px 0 9px;overflow-wrap:anywhere}.motion-job-badge:before{content:'';flex:none;width:6px;height:6px;border-radius:50%;background:#63e5dc;animation:motion-breathe 1.5s ease-in-out infinite}.motion-working{border-color:#537d76!important}.motion-new-label{display:inline-block;font-size:10px;line-height:1.5;color:#b9faea;background:#23433a;padding:2px 6px;border-radius:4px;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.motion-new{animation:motion-arrival 2.7s ease-out}.motion-assigned{animation:motion-assignment 2.5s ease-out}.motion-transit,.motion-resolved{animation:motion-resolved 2.5s ease-out}.motion-warning{animation:motion-attention 2.7s ease-out}.motion-warning .motion-new-label{background:#503b28;color:#ffe0bc}.motion-assigned .motion-new-label{background:#3c304e;color:#e5d5ff}.motion-observed{outline:1px solid #80cbb8;outline-offset:3px}
@keyframes motion-breathe{0%,100%{opacity:.4}50%{opacity:1}}
@keyframes motion-signal{from{background-position:200% 0}to{background-position:0 0}}
@keyframes motion-arrival{0%{border-color:#63e5dc;background-color:#25413b}100%{border-color:#49394e;background-color:#282033}}
@keyframes motion-assignment{0%{border-color:#b69aff;background-color:#3a2f4b}100%{border-color:#49394e;background-color:#282033}}
@keyframes motion-resolved{0%{border-color:#8fe2ba;background-color:#283f35}100%{border-color:#49394e;background-color:#282033}}
@keyframes motion-attention{0%{border-color:#ffc38e;background-color:#46372c}100%{border-color:#49394e;background-color:#282033}}
body[data-motion=calm] .motion-status-dot,body[data-motion=calm] .motion-job-badge:before,body[data-motion=calm] .is-processing .motion-event-line:before{animation:none}
body[data-motion=calm] .motion-new,body[data-motion=calm] .motion-assigned,body[data-motion=calm] .motion-transit,body[data-motion=calm] .motion-resolved,body[data-motion=calm] .motion-warning{animation-duration:1.6s}
body[data-motion=minimal] .motion-desk *,body[data-motion=minimal] .motion-new,body[data-motion=minimal] .motion-assigned,body[data-motion=minimal] .motion-transit,body[data-motion=minimal] .motion-resolved,body[data-motion=minimal] .motion-warning,body[data-motion=minimal] .motion-job-badge:before{animation:none!important;transition:none!important}
.motion-desk button:focus-visible,.motion-desk select:focus-visible,.motion-history summary:focus-visible{outline:2px solid #63e5dc;outline-offset:2px}
@media(max-width:700px){.motion-desk-toolbar{align-items:flex-start;flex-direction:column;gap:10px}.motion-settings{width:100%;justify-content:space-between}.motion-event-line>button,.motion-current-job{flex-wrap:wrap;gap:3px 9px}.motion-event-line>button>span:nth-child(2){flex-basis:85%}.motion-history li button{flex-direction:column;gap:2px}.motion-observer{padding:14px}}
@media(prefers-reduced-motion:reduce){.motion-desk *,.motion-job-badge:before,.motion-new,.motion-assigned,.motion-transit,.motion-resolved,.motion-warning{animation:none!important;transition:none!important}}
.completed-target{position:relative}.motion-completion-confirm{position:absolute;top:calc(100% + 6px);right:0;display:flex;align-items:center;gap:5px;white-space:nowrap;background:#284b38;color:#d9f7e3;border:1px solid #5c8f6c;padding:5px 8px;border-radius:6px;font-size:11px!important;line-height:1.5;z-index:9;pointer-events:none}
.dispatch-order-row.motion-working>td{background-color:#22332f}.dispatch-order-row .motion-job-badge{padding:0 0 7px}.dispatch-order-row .motion-new-label{margin-top:5px}
body[data-motion=minimal] .is-processing .motion-event-line:before{animation:none!important}
@media(prefers-reduced-motion:reduce){.is-processing .motion-event-line:before{animation:none!important}}
.motion-completion-confirm.cancelled{background:#493927;border-color:#9b7b50;color:#ffe0bc}
body[data-motion=minimal] .order-card{transition:none!important}body[data-motion=minimal] .order-card:hover{transform:none!important}

/* Live updates never change card geometry or take over the viewport. */
.motion-desk-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;min-height:64px;box-sizing:border-box}
.motion-status [data-motion-status]{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.motion-event-line{height:68px;box-sizing:border-box;overflow:hidden}
.motion-event-line>button,.motion-current-job{height:100%;box-sizing:border-box;align-items:center}
.motion-event-line>button>span:nth-child(2),.motion-current-job>span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.motion-observer{height:240px;box-sizing:border-box;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#82618f #1e2928}
.order-card .motion-job-badge{height:25px;box-sizing:border-box;padding:2px 0 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.order-card .motion-job-badge:before{display:inline-block;margin-right:7px;vertical-align:middle}
.order-card .motion-job-badge.is-idle{visibility:hidden}
.dispatch-order-row .motion-job-badge{height:24px;box-sizing:border-box;overflow:hidden;white-space:nowrap;padding:0 0 6px}
.dispatch-order-row .motion-job-badge.is-idle{visibility:hidden}
.dispatch-identity,.cdek-card-top{position:relative}
.motion-new-label{position:absolute;right:0;bottom:0;max-width:70%;pointer-events:none}
@media(max-width:700px){.motion-desk-toolbar{grid-template-columns:minmax(0,1fr);min-height:112px}.motion-event-line{height:88px}.motion-event-line>button,.motion-current-job{align-content:center}.motion-observer{height:260px}}

/* Completion feedback is visible even when the source card is below the fold. */
.motion-completion-receipt{position:fixed;z-index:95;pointer-events:none;max-width:min(288px,calc(100vw - 32px));padding:12px 16px;box-sizing:border-box;border:1px solid #5d9475;border-radius:10px;background:#1e382a;color:#c2f1d2;font-family:inherit;font-size:13px;font-weight:600;line-height:1.5;box-shadow:0 10px 28px #08051044;overflow-wrap:anywhere}
.motion-completion-receipt.is-cancelled{background:#3a2d30;border-color:#a27a87;color:#f2d0dc}

/* Soft mint contour signals unresolved work without moving card geometry. */
.order-card[data-attention]{position:relative;border-color:#5ba397}
.order-card[data-attention]:after{content:'';position:absolute;inset:0;border:2px solid #7ce8cf;border-radius:inherit;pointer-events:none;opacity:.35;animation:order-attention-breathe 3.2s ease-in-out infinite;z-index:1}
.order-card[data-attention=critical]:after{animation-duration:2.6s}
.dispatch-attention-note{display:inline-flex;align-items:center;gap:7px;padding:5px 0;margin:8px 0 4px;border:0;background:transparent;color:#a5edda;font-size:11px;line-height:1.5;text-align:left;min-height:28px;max-width:100%;cursor:pointer}
.dispatch-attention-note:hover{color:#d4fff0;background:transparent}
.dispatch-attention-note svg{flex:none}
@keyframes order-attention-breathe{0%,100%{opacity:.18}50%{opacity:.9}}
body[data-motion=calm] .order-card[data-attention]:after,body[data-motion=minimal] .order-card[data-attention]:after,body[data-motion=off] .order-card[data-attention]:after{animation:none;opacity:.55}
@media(prefers-reduced-motion:reduce){.order-card[data-attention]:after{animation:none;opacity:.55}}

.order-card[data-attention]:after{animation-play-state:paused}
.order-card.attention-visible[data-attention]:after{animation-play-state:running}
body[data-motion-visibility=hidden] .order-card[data-attention]:after{animation-play-state:paused}