.ops-page { padding: 0; }
.ops-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.ops-head h1 { margin: 0; font-size: 2rem; }
.ops-head p { margin: 6px 0 0; color: var(--muted); }
.ops-grid { display: grid; grid-template-columns: minmax(0,1fr) 340px; gap: 16px; }
.ops-card { border: 1px solid var(--border); border-radius: 14px; background: var(--panel); padding: 18px; }
.ops-card h3 { margin: 0 0 16px; }
.ops-form { display: grid; gap: 12px; }
.ops-form label { display: grid; gap: 6px; font-size: .85rem; }
.ops-form input, .ops-form select, .ops-form textarea { width: 100%; box-sizing: border-box; background: var(--input); border: 1px solid var(--border); border-radius: 8px; color: var(--text); padding: 10px; }
.ops-form textarea { min-height: 80px; resize: vertical; }
.ops-actions { display: flex; justify-content: flex-end; gap: 8px; }
.ops-button { border: 1px solid var(--border); border-radius: 8px; padding: 9px 13px; background: transparent; color: var(--text); cursor: pointer; }
.ops-button.primary { border-color: #ef3340; background: #d51f32; color: #fff; }
.ops-button:disabled { opacity: .5; cursor: not-allowed; }
.ops-table-wrap { overflow: auto; }
.ops-table { width: 100%; border-collapse: collapse; }
.ops-table th, .ops-table td { text-align: left; padding: 12px; border-bottom: 1px solid var(--border); white-space: nowrap; }
.ops-table th { color: var(--muted); font-size: .78rem; }
.ops-muted { color: var(--muted); }
.ops-badge { display: inline-flex; padding: 4px 9px; border-radius: 999px; background: rgba(26,188,116,.14); color: #3ee08e; font-size: .78rem; }
.ops-badge.off { background: rgba(148,163,184,.12); color: var(--muted); }
.ops-inline { display: flex; gap: 8px; align-items: center; }
.ops-error { padding: 10px 12px; border: 1px solid rgba(239,51,64,.45); border-radius: 8px; background: rgba(239,51,64,.09); color: #ff7480; }
.ops-success { padding: 10px 12px; border: 1px solid rgba(26,188,116,.4); border-radius: 8px; background: rgba(26,188,116,.08); color: #50e39a; }
.ops-days { display: flex; flex-wrap: wrap; gap: 6px; }
.ops-days label { display: flex; align-items: center; gap: 4px; padding: 5px 8px; border: 1px solid var(--border); border-radius: 7px; }
.ops-select-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ops-check { width: 18px; height: 18px; }
.ops-assignment-card { margin-top: 16px; padding: 0; overflow: hidden; }
.ops-assignment-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 22px; border-bottom: 1px solid var(--border); }
.ops-assignment-title { display: flex; align-items: center; gap: 13px; min-width: 0; }
.ops-assignment-title h3 { margin: 0 0 4px; }
.ops-assignment-title p { margin: 0; color: var(--muted); font-size: .86rem; }
.ops-assignment-icon { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border: 1px solid rgba(239,51,64,.35); border-radius: 11px; background: rgba(239,51,64,.09); color: #ff5361; font-size: 1.25rem; }
.ops-selection-count { flex: 0 0 auto; padding: 7px 11px; border: 1px solid var(--border); border-radius: 999px; color: var(--muted); font-size: .78rem; }
.ops-selection-count strong { color: var(--text); }
.ops-selection-count.has-selection { border-color: rgba(239,51,64,.4); background: rgba(239,51,64,.09); color: #ff7b86; }
.ops-assignment-summary { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin: 18px 22px 0; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; background: var(--border); }
.ops-assignment-summary > div { display: flex; align-items: center; gap: 10px; padding: 13px 15px; background: color-mix(in srgb,var(--panel) 95%,var(--input)); }
.ops-assignment-summary i { color: #ff5361; font-size: 1.15rem; }
.ops-assignment-summary span { display: grid; gap: 1px; }
.ops-assignment-summary strong { line-height: 1; }
.ops-assignment-summary small { color: var(--muted); font-size: .7rem; }
.ops-assignment-controls { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; padding: 18px 22px; }
.ops-assignment-controls label { display: grid; gap: 6px; min-width: 0; color: var(--text); font-size: .8rem; }
.ops-assignment-controls label > span { display: flex; align-items: center; justify-content: space-between; }
.ops-assignment-controls em { color: var(--muted); font-size: .68rem; font-style: normal; text-transform: uppercase; letter-spacing: .05em; }
.ops-assignment-controls .text-input { width: 100%; min-width: 0; margin: 0; }
.ops-assignment-controls small { color: var(--muted); font-size: .7rem; }
.ops-assignment-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 22px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: color-mix(in srgb,var(--input) 30%,transparent); }
.ops-assignment-toolbar > div { display: flex; gap: 8px; }
.ops-assignment-toolbar .ops-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; }
.ops-apply-button { min-width: 190px; }
.ops-assignment-empty { min-height: 210px; display: grid; place-items: center; align-content: center; gap: 7px; padding: 24px; text-align: center; }
.ops-assignment-empty i { color: var(--muted); font-size: 2rem; }
.ops-assignment-empty span { color: var(--muted); font-size: .82rem; }
.ops-user-list { max-height: 480px; overflow: auto; padding: 8px; }
.ops-user { display: grid; grid-template-columns: auto auto minmax(170px,1.25fr) minmax(180px,1fr) minmax(105px,auto) auto; gap: 12px; align-items: center; min-width: 720px; padding: 11px 12px; border: 1px solid transparent; border-radius: 9px; transition: border-color .15s ease,background .15s ease; }
.ops-user + .ops-user { border-top-color: var(--border); border-radius: 0 0 9px 9px; }
.ops-user:hover { background: color-mix(in srgb,var(--input) 38%,transparent); }
.ops-user.selected { border-color: rgba(239,51,64,.38); background: rgba(239,51,64,.07); border-radius: 9px; }
.ops-user-selector { position: relative; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 7px; cursor: pointer; }
.ops-user-selector:hover { background: rgba(148,163,184,.09); }
.ops-user-selector .ops-check { position: absolute; opacity: 0; pointer-events: none; }
.ops-user-selector .ops-checkbox-visual { width: 20px; height: 20px; display: grid; place-items: center; box-sizing: border-box; border: 2px solid #8290a8; border-radius: 5px; background: color-mix(in srgb,var(--input) 82%,#fff 4%); box-shadow: inset 0 0 0 1px rgba(255,255,255,.04); transition: border-color .15s ease,background .15s ease,box-shadow .15s ease; }
.ops-user-selector .ops-checkbox-visual i { opacity: 0; color: #fff; font-size: .9rem; font-weight: 800; line-height: 1; }
.ops-user-selector .ops-check:checked + .ops-checkbox-visual { border-color: #ff4655; background: #ef3340; box-shadow: 0 0 0 3px rgba(239,51,64,.15); }
.ops-user-selector .ops-check:checked + .ops-checkbox-visual i { opacity: 1; }
.ops-user-selector .ops-check:focus-visible + .ops-checkbox-visual { outline: 2px solid #ff6975; outline-offset: 3px; }
.ops-user-avatar { width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid var(--border); border-radius: 50%; background: var(--input); color: var(--text); font-size: .75rem; font-weight: 700; }
.ops-user-info,.ops-current-shift span:not(.ops-shift-dot) { display: grid; gap: 2px; min-width: 0; }
.ops-user-info strong,.ops-user-info small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ops-user-info small,.ops-current-shift small { color: var(--muted); font-size: .72rem; }
.ops-current-shift { display: flex; align-items: center; gap: 9px; min-width: 0; }
.ops-shift-dot { width: 9px; height: 9px; flex: 0 0 9px; border-radius: 50%; box-shadow: 0 0 0 4px color-mix(in srgb,currentColor 10%,transparent); }
.ops-no-shift { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: .78rem; }
.ops-user-status { min-width: 0; }
.ops-user-status .ops-badge { gap: 5px; white-space: nowrap; }
.ops-history-button { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }

.ops-company-modal.wide { width: min(720px,100%); }
.ops-company-modal-body > label, .ops-company-modal-body .ops-select-row > label { display: grid; min-width: 0; }
.ops-company-modal-body .text-input { min-width: 0; margin: .35rem 0 0; }
.ops-company-modal-body textarea.text-input { min-height: 90px; resize: vertical; }
.ops-company-modal-body .danger-text { margin: 0 0 .35rem; }
.ops-company-modal-body .andon-check-row { display: flex; }
.ops-company-modal-body .ops-color-input { min-height: 42px; padding: .25rem; }

@media(max-width:900px) {
    .ops-grid { grid-template-columns: 1fr; }
    .ops-head { flex-direction: column; }
    .ops-select-row { grid-template-columns: 1fr; }
    .ops-assignment-controls { grid-template-columns: 1fr; }
    .ops-assignment-toolbar { align-items: stretch; flex-direction: column; }
    .ops-assignment-toolbar > div { display: grid; grid-template-columns: 1fr 1fr; }
    .ops-apply-button { width: 100%; }
}

@media(max-width:560px) {
    .ops-company-modal.wide { width: 100%; }
    .ops-assignment-head { align-items: flex-start; padding: 16px; }
    .ops-assignment-icon { display: none; }
    .ops-selection-count { padding: 6px 8px; }
    .ops-assignment-summary { grid-template-columns: 1fr; margin: 14px 16px 0; }
    .ops-assignment-controls { padding: 16px; }
    .ops-assignment-toolbar { padding: 12px 16px; }
    .ops-assignment-toolbar > div { grid-template-columns: 1fr; }
}