.op-report { display:grid; gap:18px; }
.op-report .daily-heading,.op-report .daily-presets,.op-report .daily-kpis { margin-bottom:0; }
.op-dashboard-card,.op-traffic-section { padding:18px; border:1px solid var(--line); border-radius:18px; background:linear-gradient(135deg,var(--surface-soft),var(--surface)); }
.op-section-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:14px; }
.op-section-heading span { display:block; color:var(--text-muted); font-size:10px; font-weight:800; letter-spacing:1px; }
.op-section-heading h3 { margin:4px 0; font-size:17px; }.op-section-heading p { margin:0; color:var(--text-muted); font-size:11px; }
.op-plan-table-wrap { overflow:auto; border:1px solid var(--line); border-radius:13px; }
.op-plan-table { width:100%; min-width:780px; border-collapse:collapse; font-size:12px; }.op-plan-table th,.op-plan-table td { padding:10px 12px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); text-align:left; }.op-plan-table th { background:color-mix(in srgb,var(--surface-strong) 75%,transparent); }.op-plan-table thead th { color:var(--text-soft); text-align:center; }.op-plan-table thead small { display:block; color:var(--text-muted); font-size:10px; font-weight:400; margin-top:3px; }.op-plan-table tr:last-child>* { border-bottom:0; }.op-plan-table tr>*:last-child { border-right:0; }
.op-pf { display:grid; grid-template-columns:auto 1fr auto; column-gap:7px; align-items:center; }.op-pf b { font-size:11px; }.op-pf span { font-size:13px; white-space:nowrap; }.op-pf .op-pf-plan { color:var(--text-soft); font-weight:400; }.op-pf .op-pf-fact { color:var(--text); font-weight:800; }.op-pf .op-inline-plan,.op-pf .op-inline-fact { width:92px; min-width:0; padding:0; border:0; border-bottom:1px dashed transparent; border-radius:0; outline:0; background:transparent; font:inherit; }.op-pf .op-inline-plan { color:var(--text-soft); font-size:11px; font-weight:400; }.op-pf .op-inline-fact { color:var(--text); font-size:13px; font-weight:800; }.op-pf .op-inline-plan::placeholder { color:var(--text-soft); opacity:1; }.op-pf .op-inline-plan:hover,.op-pf .op-inline-plan:focus,.op-pf .op-inline-fact:hover,.op-pf .op-inline-fact:focus { border-bottom-color:var(--line); }.op-pf i { grid-column:1 / 3; display:block; height:4px; margin-top:7px; overflow:hidden; border-radius:4px; background:var(--line); }.op-pf i em { display:block; height:100%; border-radius:inherit; background:var(--success); }.op-pf small { grid-column:3; grid-row:2; align-self:end; color:var(--text-soft); font-size:10px; }
.op-plan-editor { padding:18px; border:1px solid color-mix(in srgb,var(--success) 50%,var(--line)); border-radius:18px; background:color-mix(in srgb,var(--success) 7%,var(--surface)); }.op-cycle-anchor { display:grid; grid-template-columns:minmax(0,1fr) 180px; gap:10px; align-items:center; margin:0 0 14px; color:var(--text-soft); font-size:11px; }.op-plan-editor-group { min-width:0; margin:14px 0; padding:12px; border:1px solid var(--line); border-radius:12px; }.op-plan-editor-group legend { padding:0 5px; color:var(--text); font-size:12px; font-weight:800; }.op-plan-period-head,.op-plan-editor-group>label { display:grid; grid-template-columns:minmax(130px,1fr) repeat(3,minmax(90px,1fr)); gap:8px; align-items:center; }.op-plan-period-head { margin-bottom:6px; color:var(--text-muted); font-size:10px; }.op-plan-editor-group>label { margin:6px 0; color:var(--text-soft); font-size:11px; }.op-plan-editor-group input { min-width:0; min-height:31px; padding:4px 7px; }.op-plan-editor-actions { display:flex; justify-content:flex-end; margin-top:14px; }
.op-traffic-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }.op-traffic-card { overflow:auto; border:1px solid var(--line); border-radius:13px; background:var(--surface); }.op-traffic-card h3 { margin:0; padding:12px; font-size:13px; }.op-traffic-card table { width:100%; min-width:470px; border-collapse:collapse; font-size:11px; }.op-traffic-card th,.op-traffic-card td { padding:8px 10px; border-top:1px solid var(--line); text-align:right; }.op-traffic-card th:first-child { text-align:left; }.op-traffic-card thead th { color:var(--text-muted); font-size:10px; }.op-traffic-total>* { background:var(--surface-strong); font-weight:800; }
.op-manager-plan-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }.op-manager-plan-grid article { padding:13px; border:1px solid var(--line); border-radius:13px; background:var(--surface); }.op-manager-plan-grid h4 { margin:0 0 10px; font-size:13px; }.op-manager-plan-grid h4 small { display:block; margin-top:3px; color:var(--text-muted); font-size:10px; font-weight:400; }.op-manager-plan-grid article>div { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:6px; padding:5px 0; border-top:1px solid color-mix(in srgb,var(--line) 70%,transparent); font-size:11px; }.op-manager-plan-grid article>div span { color:var(--text-muted); }.op-manager-plan-grid article>div small { color:var(--text-soft); }
@media(max-width:1200px) { .op-manager-plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.op-traffic-grid { grid-template-columns:1fr; } }
@media(max-width:700px) { .op-dashboard-card,.op-traffic-section { padding:13px; }.op-section-heading { flex-wrap:wrap; }.op-cycle-anchor { grid-template-columns:1fr; }.op-plan-editor-group { overflow:auto; }.op-plan-period-head,.op-plan-editor-group>label { min-width:480px; }.op-manager-plan-grid { grid-template-columns:1fr; } }
.op-manager-plan-grid article>div { grid-template-columns:minmax(0,1fr) repeat(3,minmax(0,1fr)); }
.op-manager-plan-grid article>div b { text-align:right; white-space:nowrap; }
.op-manager-plan-grid article>div small { font-weight:400; }
.op-manager-plan-grid .op-personal-head { color:var(--text-muted); font-size:9px; font-weight:700; }
.op-manager-plan-grid article>div>:not(:first-child) { box-shadow:inset 1px 0 0 color-mix(in srgb,var(--line) 78%,transparent); padding-left:8px; }
.op-manager-plan-grid .op-personal-plan { color:var(--text-soft); font-size:10px; font-weight:400; }
.op-manager-plan-grid .op-personal-fact { color:var(--text); font-size:12px; font-weight:800; }