[hidden] { display: none !important; }
.ops-workspace { background: transparent; min-height: 72vh; }
.ops-topbar { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; justify-content: space-between; padding: .8rem 0 1.1rem; border-bottom: 1px solid var(--border-light); margin-bottom: 1.75rem; }
#opsNav { display: flex; flex-wrap: wrap; gap: .4rem; }
#opsNav a { text-decoration: none; color: var(--text-secondary); font-size: .85rem; font-weight: 700; border: 1px solid transparent; padding: .7rem 1rem; border-radius: 10px; }
#opsNav a[aria-current="page"] { color: var(--gold); background: var(--gold-light); border-color: #f3d8d9; }
#opsNav a:hover { background: var(--bg-subtle); }
.ops-session { font-size: .65rem; color: var(--text-muted); text-align: end; }
.ops-session small { display: block; margin-top: .25rem; overflow-wrap: anywhere; }
.ops-online { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--green); margin-inline-end: .35rem; }
.ops-content { min-width: 0; }
.ops-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.ops-head h2 { font-size: 1.65rem; letter-spacing: -.04em; }
.ops-head > div, .ops-record > div { min-width: 0; max-width: 100%; }
.ops-head h2 { overflow-wrap: anywhere; }
.ops-head p, .ops-muted { color: var(--text-muted); font-size: .85rem; }
.ops-head .stock-eyebrow { margin-bottom: .4rem; }
.ops-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; margin: .75rem 0; }
.ops-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.ops-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.5rem; }
.ops-kpi { display: block; border: 1px solid var(--border-light); padding: 1.25rem; border-radius: 12px; text-decoration: none; color: inherit; }
.ops-kpi span { color: var(--text-muted); font-size: .75rem; }
.ops-kpi strong { display: block; font-size: 2rem; font-weight: 800; margin-top: .5rem; }
.ops-kpi:first-child { background: var(--gold-light); border-color: #f1d7d7; }
.ops-card { border: 1px solid var(--border-light); border-radius: 12px; padding: 1.25rem; margin-bottom: 1rem; min-width: 0; background: var(--bg-card); }
.ops-card h3 { font-size: .95rem; margin-bottom: 1rem; }
.ops-list { display: grid; gap: .75rem; }
.ops-record { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: 1rem; border: 1px solid var(--border-light); border-radius: 10px; text-decoration: none; color: inherit; }
.ops-record:hover { border-color: var(--gold); background: #fffcfa; }
.ops-record strong { display: block; font-size: .9rem; overflow-wrap: anywhere; }
.ops-record small { color: var(--text-muted); font-size: .75rem; }
.ops-badge { display: inline-block; border: 1px solid var(--border-light); background: var(--bg-subtle); padding: .25rem .55rem; border-radius: 6px; font-size: .7rem; font-weight: 700; white-space: nowrap; }
.ops-badge[data-stage="completed"], .ops-badge[data-stage="active"], .ops-badge[data-stage="partner"] { color: var(--green); background: var(--green-light); border-color: var(--green-border); }
.ops-badge[data-stage="on_hold"], .ops-badge[data-stage="approval"] { color: var(--amber); background: var(--amber-light); border-color: var(--amber-border); }
.ops-filter { display: flex; flex-wrap: wrap; gap: .75rem; align-items: end; margin-bottom: 1.25rem; padding: 1rem; background: var(--bg-subtle); border-radius: 10px; }
.ops-filter .ops-field { flex: 1 1 160px; margin: 0; }
.ops-field { display: flex; flex-direction: column; gap: .4rem; margin-bottom: 1rem; font-size: .78rem; font-weight: 600; min-width: 0; }
.ops-field textarea { min-height: 95px; resize: vertical; }
.ops-wide { grid-column: 1 / -1; }
.ops-tabs { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--border-light); gap: .35rem; margin: 1rem 0 1.5rem; }
.ops-tabs a { display: inline-block; padding: .7rem .8rem; text-decoration: none; color: var(--text-muted); font-size: .8rem; font-weight: 700; border-bottom: 2px solid transparent; }
.ops-tabs a[aria-current="page"] { color: var(--gold); border-color: var(--gold); }
.ops-detail { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: .65rem 1rem; font-size: .83rem; }
.ops-detail dt { color: var(--text-muted); }
.ops-detail dd { overflow-wrap: anywhere; white-space: pre-wrap; }
.ops-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.7; font-size: .85rem; }
.ops-note { padding: 1rem 0; border-bottom: 1px solid var(--border-light); }
.ops-note:last-child { border-bottom: 0; }
.ops-note small { display: block; color: var(--text-muted); margin-top: .6rem; }
.ops-empty { padding: 2rem 1rem; text-align: center; background: #fcfaf7; border: 1px dashed var(--border-medium); border-radius: 10px; color: var(--text-muted); }
.ops-empty strong { display: block; color: var(--text-main); font-size: 1rem; margin-bottom: .4rem; }
.ops-message { margin-bottom: 1rem; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--green); }
.ops-message:empty { display: none; }
.ops-message[data-error="true"], #opsFormMessage[data-error="true"] { color: var(--red); }
.ops-login { max-width: 490px; background: white; border: 1px solid var(--border-light); padding: 2rem; border-radius: 16px; margin: 3rem auto; box-shadow: var(--shadow-md); }
.ops-login form { margin-top: 1.75rem; }
#opsDialog { position: fixed; inset: 0; margin: auto; width: min(850px, 95vw); max-height: 92vh; overflow: auto; padding: 1.5rem; border: 1px solid var(--border-light); border-radius: 14px; background: var(--bg-card); color: var(--text-main); font: inherit; }
#opsDialog::backdrop { background: #1a151077; }
.ops-dialog-head { display: flex; justify-content: space-between; gap: 1rem; align-items: center; margin-bottom: 1.5rem; }
.ops-dialog-head h2 { font-size: 1.2rem; }
#opsPreviewDialog { position: fixed; inset: 0; margin: auto; width: min(1200px, 96vw); max-height: 94vh; overflow: auto; padding: 1rem; border: 1px solid #98000a; border-radius: 14px; background: #fff; color: #101010; }
#opsPreviewDialog::backdrop { background: #1a151077; }
#opsPreviewBody iframe { display: block; width: 100%; height: 70vh; border: 1px solid #ddd; margin-bottom: 1rem; }
#opsPreviewBody img { display: block; max-width: 100%; max-height: 70vh; object-fit: contain; margin: 0 auto 1rem; }
.ops-repeat { background: var(--bg-subtle); border: 1px solid var(--border-light); border-radius: 10px; padding: 1rem; margin-bottom: 1rem; }
.ops-checkbox { display: flex; align-items: center; gap: .5rem; font-size: .8rem; }
.ops-checkbox input { accent-color: var(--gold); }
.ops-pagination { display: flex; justify-content: space-between; align-items: center; gap: .75rem; margin-top: 1.25rem; }
.ops-content a.ops-back { color: var(--text-muted); text-decoration: none; font-size: .8rem; display: inline-block; margin-bottom: 1rem; }
.ops-content a.ops-back:hover { color: var(--gold); }
.ops-content a.stock-btn { text-decoration: none; }
.ops-detail a { color: var(--gold); text-underline-offset: 3px; }
.ops-error { padding: 1rem; color: var(--red); background: var(--red-light); border-radius: 8px; }
.ops-kpi { background: white; }
.ops-project-grid, .ops-workflow-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-top: 1rem; }
.ops-client-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-top: 1rem; }
.ops-project-card, .ops-client-card { min-width: 0; padding: 1.3rem; background: white; border: 1px solid var(--border-light); border-radius: 14px; box-shadow: var(--shadow-sm); color: inherit; }
.ops-project-card h3, .ops-client-card h3 { font-size: 1.1rem; overflow-wrap: anywhere; margin: .5rem 0; }
.ops-client-card { text-decoration: none; transition: border-color .18s, transform .18s; }
.ops-client-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.ops-client-card p { font-size: .8rem; color: var(--text-secondary); margin: .5rem 0; overflow-wrap: anywhere; }
.ops-client-card footer { border-top: 1px solid var(--border-light); padding-top: .8rem; margin-top: .8rem; color: var(--text-muted); font-size: .75rem; }
.ops-card-top, .ops-card-meta { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: .5rem; }
.ops-reference { font-size: .68rem; letter-spacing: .05em; font-weight: 800; color: var(--text-muted); }
.ops-project-title { color: inherit; text-decoration: none; }
.ops-project-title:hover { color: var(--gold); }
.ops-card-brief { margin: .65rem 0; color: var(--text-secondary); }
.ops-card-meta { font-size: .7rem; color: var(--text-muted); margin: .8rem 0; }
.ops-warranty { margin: .8rem 0; padding: .7rem; border: 1px solid var(--border-light); border-radius: 8px; background: var(--bg-subtle); font-size: .75rem; }
.ops-finance-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; margin: 1rem 0; }
.ops-finance-summary > div { padding: 1rem; border: 1px solid var(--border-light); background: white; border-radius: 10px; min-width: 0; }
.ops-finance-summary span { display: block; color: var(--text-muted); font-size: .7rem; margin-bottom: .4rem; }
.ops-finance-summary strong { display: block; font-size: 1rem; overflow-wrap: anywhere; }
.ops-finance-summary.compact { gap: .35rem; margin: .65rem 0; }
.ops-finance-summary.compact > div { padding: .55rem; background: var(--bg-page); border: none; }
.ops-finance-summary.compact strong { font-size: .8rem; }
.ops-progress { height: 5px; background: var(--bg-subtle); border-radius: 10px; overflow: hidden; margin: .75rem 0; }
.ops-progress > span { display: block; height: 100%; background: var(--gold); }
.ops-card-links { display: flex; gap: 1rem; flex-wrap: wrap; border-top: 1px solid var(--border-light); margin-top: 1rem; padding-top: 1rem; }
.ops-card-links a { color: var(--gold); text-decoration: none; font-size: .75rem; font-weight: 700; }
.ops-urgent { color: var(--red); background: var(--red-light); border-color: var(--red-border); text-decoration: none; }
.ops-quick-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; margin: 1rem 0 1.75rem; }
.ops-quick-actions a { color: var(--gold); background: white; border: 1px solid var(--border-light); border-radius: 10px; padding: 1rem; font-weight: 700; text-decoration: none; text-align: center; }
.ops-activity-row { display: flex; align-items: center; gap: .7rem; padding: .8rem 0; border-bottom: 1px solid var(--border-light); text-decoration: none; color: inherit; }
.ops-activity-row strong { font-size: .8rem; display: block; overflow-wrap: anywhere; }
.ops-activity-row small, .ops-activity-row time { font-size: .65rem; color: var(--text-muted); }
.ops-activity-row time { margin-inline-start: auto; }
.ops-avatar { display: grid; place-items: center; width: 32px; height: 32px; flex-shrink: 0; background: var(--gold-light); color: var(--gold); border-radius: 50%; font-weight: 800; }
.ops-survey-checks { display: flex; gap: .35rem; flex-wrap: wrap; margin: 1rem 0; }
.ops-survey-checks .ops-badge { white-space: normal; overflow-wrap: anywhere; }
.ops-check-row { display: flex; gap: .75rem; flex-wrap: wrap; align-items: center; }
.ops-check-row .ops-field { flex: 1 1 180px; }
.ops-version-list { margin-top: 1rem; }
button, a, input, textarea, select, summary { touch-action: manipulation; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
@media (max-width: 1100px) { .ops-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ops-client-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) {
  .stock-nav { flex-wrap: wrap; } .stock-nav-links { flex-wrap: wrap; gap: .4rem; }
  .ops-grid, .ops-project-grid, .ops-client-grid, .ops-workflow-grid { grid-template-columns: minmax(0, 1fr); }
  .ops-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ops-topbar { margin-bottom: 1rem; } .ops-session { text-align: start; }
  #opsNav a { padding: .55rem .7rem; font-size: .75rem; }
  .ops-finance-summary { gap: .35rem; } .ops-finance-summary > div { padding: .65rem; }
  .ops-detail { grid-template-columns: minmax(0, 1fr); gap: .3rem; } .ops-detail dd { margin-bottom: .5rem; }
  .ops-record { align-items: flex-start; } .stock-container { padding: 1rem .75rem 3rem; }
}