:root {
  --sop-ink:#0f2744; --sop-ink2:#334155; --sop-mute:#64748b; --sop-line:#e3eaf3;
  --sop-blue:#1f6fe5; --sop-soft:#eef5ff; --sop-navy:#1e3a68;
  --sop-green:#15803d; --sop-amber:#a16207; --sop-red:#c62828;
}
.sop, .mie, .mbe, .mle, .pme, .pay, .cal {
  --ink:#0f2744; --ink2:#334155; --mute:#64748b; --line:#e3eaf3;
  --blue:#1f6fe5; --soft:#eef5ff; --navy:#1e3a68;
  color:var(--ink2); font-size:13px;
}
.pf {
  --pf-blue:#0f6fd6; --pf-deep:#0b4fa3; --pf-ink:#123a63; --pf-mut:#7089a8;
  --pf-line:#dbe8f7; --pf-soft:#eaf3fd;
}
.sop *, .mie *, .mbe *, .mle *, .pme *, .pay *, .cal *, .pf * { box-sizing:border-box; }

.sop-card, .mie-card, .mbe-card, .mle-card, .pme-card, .pay-card, .cal-card {
  background:#fff; border:1px solid var(--sop-line); border-radius:16px;
  box-shadow:0 1px 3px rgba(16,24,40,.05); margin-bottom:22px; overflow:hidden;
}
.sop-panel, .pf-card {
  background:#fff; border:1px solid #dbe8f7; border-radius:16px; padding:18px 20px;
  margin:0 0 16px; box-shadow:0 2px 10px rgba(16,42,80,.05);
}
.sop-panel > h2, .sop-panel > h3, .pf-card > h2 { margin:0 0 4px; font-size:16px; font-weight:800; color:#123a63; }
.sop-panel p.hint, .sop-panel .sop-note { font-size:12.5px; color:var(--sop-mute); line-height:1.55; margin:0 0 14px; }

.sop-head, .mie-head, .mbe-head, .mle-head, .pme-head, .pay-head, .cal-head {
  display:flex; align-items:center; gap:12px; padding:16px 18px; flex-wrap:wrap;
}
.sop-ic, .mie-ic, .mbe-ic, .mle-ic, .pme-ic, .pay-ic, .cal-ico {
  flex:0 0 38px; height:38px; border-radius:11px; color:#fff; font-size:16px;
  background:linear-gradient(135deg,#3f8cf3,#1f6fe5);
  display:flex; align-items:center; justify-content:center;
}
.sop-head h1, .sop-head h2,
.mie-head h2, .mbe-head h2, .mle-head h2, .pme-head h2, .pay-head h2, .cal-head h1 {
  margin:0; flex:1; font-size:17px; font-weight:800; color:var(--sop-ink); letter-spacing:-.2px;
}
.sop-head p, .cal-head p { margin:2px 0 0; font-size:12.5px; color:var(--sop-mute); }
.sop-head .grow, .cal-head .grow { flex:1; min-width:180px; }

.sop-chip, .mle-chip, .cal-chip, .pay-chip {
  display:inline-flex; align-items:center; gap:7px; background:var(--sop-soft); border:1px solid #d3e6fb;
  color:#1f6fd8; border-radius:99px; padding:7px 14px; font-size:12.5px; font-weight:800; white-space:nowrap;
}
.sop-chip.warn, .pay-chip { background:#fff7e6; border-color:#f4dfae; color:var(--sop-amber); }
.sop-chip.down, .cal-chip.down { background:#fdecec; border-color:#f4c9c9; color:var(--sop-red); }

.sop-all, .mie-all, .mbe-all, .mle-all, .pme-all, .pay-all {
  display:inline-flex; align-items:center; gap:8px; border:1px solid #cfe0f7; background:#fff;
  color:var(--sop-blue) !important; border-radius:99px; padding:8px 16px; font-size:12.5px;
  font-weight:800; text-decoration:none !important;
}
.sop-all:hover, .mie-all:hover, .mbe-all:hover, .mle-all:hover, .pme-all:hover, .pay-all:hover { background:var(--sop-soft); }

.sop-tw, .mie-tw, .mbe-tw, .mle-tw, .pme-tw, .pay-tw, .cal-tw { overflow-x:auto; }
table.sop-t, table.mie-t, table.mbe-t, table.mle-t, table.pme-t, table.pay-t, table.cal-t {
  width:100%; border-collapse:collapse; margin:0;
}
table.sop-t th, table.mie-t th, table.mbe-t th, table.mle-t th, table.pme-t th, table.pay-t th, table.cal-t th {
  background:var(--sop-navy); color:#fff; font-size:11.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.4px; text-align:left; padding:13px 16px; white-space:nowrap; border:0;
}
table.sop-t td, table.mie-t td, table.mbe-t td, table.mle-t td, table.pme-t td, table.pay-t td, table.cal-t td {
  padding:13px 16px; border-bottom:1px solid #eef3f9; font-size:13px; color:var(--sop-ink2); vertical-align:middle;
}
table.sop-t td, table.mie-t td, table.mbe-t td, table.mle-t td, table.pme-t td, table.pay-t td { white-space:nowrap; }
table.sop-t td.wrap, table.cal-t td.cal-name, table.cal-t td.cal-text { white-space:normal; }
table.sop-t th.c, table.sop-t td.c, table.cal-t th.c, table.cal-t td.c { text-align:center; }
table.sop-t tbody tr:nth-child(odd) td, table.mie-t tbody tr:nth-child(odd) td,
table.mbe-t tbody tr:nth-child(odd) td, table.mle-t tbody tr:nth-child(odd) td,
table.pme-t tbody tr:nth-child(odd) td, table.pay-t tbody tr:nth-child(odd) td,
table.cal-t tbody tr:nth-child(odd) td { background:#f7fbff; }
table.sop-t tbody tr:hover td, table.mie-t tbody tr:hover td, table.mbe-t tbody tr:hover td,
table.mle-t tbody tr:hover td, table.pme-t tbody tr:hover td, table.pay-t tbody tr:hover td,
table.cal-t tbody tr:hover > td { background:var(--sop-soft); }
table.sop-t tbody tr:last-child td, table.mie-t tbody tr:last-child td, table.mbe-t tbody tr:last-child td,
table.mle-t tbody tr:last-child td, table.pme-t tbody tr:last-child td, table.pay-t tbody tr:last-child td,
table.cal-t tbody tr:last-child td { border-bottom:0; }

.sop-code, .mie-inv, .mbe-code, .mle-codecell, .pme-code, .pay-num, .cal-code {
  font-family:ui-monospace,Consolas,monospace; font-weight:800; color:var(--sop-blue);
}
.cal-code { display:inline-block; background:var(--sop-soft); border-radius:8px; padding:4px 11px; font-size:12.5px; }
.cal-code.na { background:#f1f5f9; color:#94a3b8; font-style:italic; }
.sop-strong, .mie-mat, .mbe-name, .mle-nm, .pme-nm, .pay-co, .cal-name { color:var(--sop-ink); font-weight:700; }
.sop-empty, .mie-empty, .mbe-empty, .mle-empty, .pme-empty, .pay-empty {
  padding:26px 18px; text-align:center; color:#94a3b8; font-style:italic; font-size:13px;
}
.cal-empty { text-align:center !important; padding:46px !important; color:#94a3b8 !important; font-style:italic; }
.sop-dash, .cal-dash { color:#94a3b8; }

.sop-badge, .mie-loc, .mbe-loc, .mbe-tag, .mle-badge, .pme-badge, .pay-badge, .cal-loc, .cal-status {
  display:inline-flex; align-items:center; gap:6px; border-radius:8px; padding:3px 11px;
  font-size:11.5px; font-weight:800; white-space:nowrap; background:#e7f0fd; color:#1f6fd8;
}
.sop-badge.round, .pay-badge, .cal-status { border-radius:99px; padding:4px 12px; }
.sop-badge.ok, .mbe-tag.ok, .pay-badge.paid, .cal-status.ok, .mle-badge.mech, .pme-badge.mech { background:#e7f7ee; color:var(--sop-green); }
.sop-badge.warn, .pay-badge.due, .mle-badge.elec, .pme-badge.elec { background:#fff7e6; color:var(--sop-amber); }
.sop-badge.bad, .mbe-tag.no, .cal-status.down { background:#fdecec; color:var(--sop-red); }
.sop-badge.grey, .cal-status.none, .pme-badge.wk { background:#f1f5f9; color:#334155; }
.pme-badge.wk { font-family:ui-monospace,Consolas,monospace; }
.pay-badge.cheque { background:#f3f0ff; color:#5b3bd4; }
.mle-badge.eq { background:#eef2ff; color:#4338ca; }
.mle-badge.sp { background:#fdf2f8; color:#a3196a; }
.mle-badge.ts { background:#ecfeff; color:#0e7490; }
.cal-status i { width:8px; height:8px; border-radius:50%; display:inline-block; }
.cal-status.ok i { background:#16a34a; } .cal-status.down i { background:#e5484d; } .cal-status.none i { background:#cbd5e1; }

.sop-dot { width:9px; height:9px; border-radius:50%; display:inline-block; vertical-align:middle; }
.sop-dot.on  { background:#16a34a; box-shadow:0 0 0 3px rgba(22,163,74,.14); }
.sop-dot.off { background:#e5484d; box-shadow:0 0 0 3px rgba(229,72,77,.14); }
.sop-dot.wait{ background:#f0a92c; box-shadow:0 0 0 3px rgba(240,169,44,.16); }

.sop-act {
  display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px;
  border:1px solid #d8e1ec; background:#fff; border-radius:9px; color:#33507a; font-size:12.5px;
  cursor:pointer; text-decoration:none !important; padding:0;
}
.sop-act:hover { border-color:var(--sop-blue); color:var(--sop-blue) !important; background:var(--sop-soft); }
.sop-act.del:hover { border-color:#e5484d; background:#e5484d; color:#fff !important; }
.sop-act.key { border-color:#f4dfae; color:var(--sop-amber); background:#fff9ec; }
.sop-act.key:hover { background:var(--sop-amber); border-color:var(--sop-amber); color:#fff !important; }
.sop-none { color:#94a3b8; }

.sop-view, .pay-view, .cal-view {
  display:inline-flex; align-items:center; gap:7px; border:1px solid #d8e1ec; background:#fff;
  color:#33507a !important; border-radius:9px; padding:5px 12px; font-size:12px; font-weight:800;
  text-decoration:none !important; white-space:nowrap;
}
.sop-view:hover, .pay-view:hover, .cal-view:hover { border-color:var(--sop-blue); color:var(--sop-blue) !important; background:var(--sop-soft); }

.sop-banner, .mie-banner, .mbe-banner, .mle-banner, .pme-banner, .pay-banner {
  position:relative; display:flex; align-items:center; gap:14px; padding:18px 20px; overflow:hidden;
  background:linear-gradient(110deg,#eaf3ff 0%,#f4f9ff 45%,#eaf1fb 100%);
  border-bottom:1px solid var(--sop-line);
}
.sop-bic, .mie-bic, .mbe-bic, .mle-bic, .pme-bic, .pay-bic {
  flex:0 0 52px; height:52px; border-radius:14px; color:#fff; font-size:21px;
  background:linear-gradient(135deg,#3f8cf3,#1f6fe5); box-shadow:0 6px 16px rgba(31,111,229,.28);
  display:flex; align-items:center; justify-content:center;
}
.sop-bic.green, .pme-bic, .pay-bic { background:linear-gradient(135deg,#25c07f,#12a366); box-shadow:0 6px 16px rgba(18,163,102,.26); }
.sop-bic.orange, .mbe-bic { background:linear-gradient(135deg,#ff8f3a,#f2682a); box-shadow:0 6px 16px rgba(242,104,42,.28); }
.sop-banner h2, .mie-banner h2, .mbe-banner h2, .mle-banner h2, .pme-banner h2, .pay-banner h2 {
  margin:0; font-size:18px; font-weight:800; color:var(--sop-ink); letter-spacing:-.2px;
}
.sop-banner p, .mie-banner p, .mbe-banner p, .mle-banner p, .pme-banner p, .pay-banner p {
  margin:2px 0 0; font-size:12.5px; color:var(--sop-mute); max-width:70ch;
}
.sop-banner.tall { align-items:flex-start; }
.sop-banner.tall .sop-bic { margin-top:2px; }

.sop-art, .mie-art, .mbe-art, .mle-art, .pme-art, .pay-art {
  position:absolute; right:10px; top:0; height:100%; width:320px; opacity:.5; pointer-events:none;
}

.sop-step, .mbe-step, .mle-step, .pme-step { display:flex; align-items:center; gap:10px; margin:0 0 14px; }
.sop-step.later, .mbe-step.later, .mle-step.later, .pme-step.later { margin-top:26px; }
.sop-step .n, .mbe-step .n, .mle-step .n, .pme-step .n {
  flex:0 0 26px; height:26px; border-radius:50%; background:var(--sop-blue); color:#fff;
  font-size:12px; font-weight:800; display:flex; align-items:center; justify-content:center;
}
.sop-step h3, .mbe-step h3, .mle-step h3, .pme-step h3 {
  margin:0; font-size:13px; font-weight:800; color:var(--sop-ink); text-transform:uppercase; letter-spacing:.5px;
}
.sop-step .sub, .mle-step .sub, .pme-step .sub {
  font-size:11.5px; color:var(--sop-mute); font-weight:600; text-transform:none; letter-spacing:0;
}
.sop-step .line, .mbe-step .line, .mle-step .line, .pme-step .line { flex:1; height:1px; background:var(--sop-line); }
.sop-step.is-off, .mbe-step.is-off { opacity:.45; }

.sop-form, .mie-form, .mbe-form, .mle-form, .pay-form { padding:20px; }
.sop-grid, .mie-grid, .mbe-grid, .pay-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px 22px; }
.sop-grid.two, .mle-fields, .pme-filters { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px 20px; }
.sop-grid.four, .mle-fields.four, .pme-filters { grid-template-columns:repeat(4,minmax(0,1fr)); }
.pme-filters { align-items:end; }
.sop-f.wide, .mie-f.wide, .mbe-f.wide, .mle-fld.wide, .pay-f.wide { grid-column:span 2; }
.sop-f.solo, .mie-f.solo, .mle-fld.solo { grid-column:1 / -1; }
.mie-f.solo .mie-in, .mle-fld.solo .mle-box, .sop-f.solo.narrow .sop-in { max-width:420px; }

.sop-f label, .mie-f label, .mbe-f label, .mle-fld label, .pme-f label, .pay-f label, .cal-f label {
  display:flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700; color:var(--sop-ink); margin:0 0 7px;
}
.sop-f label i, .mie-f label i, .mbe-f label i, .mle-fld label i.lb, .pme-f label i, .pay-f label i, .cal-f label i {
  color:var(--sop-blue); font-size:13px; width:15px; text-align:center;
}
.sop-f label b, .mie-f label b, .mbe-f label b, .pay-f label b,
.sop-f label .req, .mle-fld label .req { color:#e5484d; font-weight:800; }
.mle-fld label em { font-style:normal; font-weight:600; font-size:11px; color:var(--sop-mute); margin-left:auto; }

.sop-in, .mie-in, .mbe-in, .mle-box, .pme-box, .pay-in, .cal-box, .mbe-search {
  display:flex; align-items:stretch; border:1px solid #d8e1ec; border-radius:11px; background:#fff;
  overflow:hidden; transition:border-color .12s, box-shadow .12s;
}
.sop-in:focus-within, .mie-in:focus-within, .mbe-in:focus-within, .mle-box:focus-within,
.pme-box:focus-within, .pay-in:focus-within, .cal-box:focus-within, .mbe-search:focus-within {
  border-color:var(--sop-blue); box-shadow:0 0 0 3px rgba(31,111,229,.13);
}
.sop-in .slot, .mie-in .mie-slot, .mbe-in .mbe-slot, .mle-box .slot, .pme-box .slot,
.pay-in .slot, .cal-box .slot, .mbe-search .mbe-slot {
  flex:0 0 40px; display:flex; align-items:center; justify-content:center; color:#a9c2e4;
  background:#f8fbff; border-right:1px solid #eef3f9; font-size:13px;
}
.sop-in input, .sop-in select, .mie-in input, .mie-in select, .mbe-in input, .mbe-in select,
.mle-box input, .mle-box select, .pme-box input, .pme-box select, .pay-in input, .pay-in select,
.cal-box input, .mbe-search input {
  flex:1; min-width:0; border:0; outline:none; background:transparent; padding:11px 13px;
  font-size:13.5px; color:var(--sop-ink); height:44px;
}
.mbe-search input:disabled, .sop-in input:disabled { background:#f8fafc; color:#94a3b8; }
.sop-in select, .mie-in select, .mbe-in select, .mle-box select, .pme-box select, .pay-in select {
  appearance:none; cursor:pointer; padding-right:32px;
}
.sop-in.sel, .mie-in.sel, .mbe-in.sel, .mle-box.sel, .pme-box.sel, .pay-in.sel { position:relative; }
.sop-in.sel::after, .mie-in.sel::after, .mbe-in.sel::after, .mle-box.sel::after,
.pme-box.sel::after, .pay-in.sel::after {
  content:""; position:absolute; right:14px; top:50%; width:7px; height:7px; margin-top:-5px;
  border-right:2px solid #64748b; border-bottom:2px solid #64748b; transform:rotate(45deg); pointer-events:none;
}
.sop-in textarea, .mle-box textarea {
  flex:1; border:0; outline:none; background:transparent; padding:11px 13px; font:inherit;
  font-size:13.5px; color:var(--sop-ink); resize:vertical; min-height:92px;
}
.sop-in input[type=file], .mie-in input[type=file], .mbe-in input[type=file], .pay-in input[type=file] {
  padding:9px 12px; font-size:12.5px; color:var(--sop-mute);
}
.sop-in input[type=file]::file-selector-button, .mie-in input[type=file]::file-selector-button,
.mbe-in input[type=file]::file-selector-button, .pay-in input[type=file]::file-selector-button {
  border:1px solid #d8e1ec; background:#f3f7fd; color:#33507a; border-radius:8px; padding:6px 12px;
  font-size:12.5px; font-weight:700; margin-right:10px; cursor:pointer;
}
.sop-note, .mie-note, .mbe-note, .mle-hint, .pay-note {
  display:block; font-size:11.5px; color:var(--sop-mute); margin:6px 0 0; line-height:1.55;
}

.sop-btn, .mle-btn, .pme-btn, .mie-ghost, .mbe-ghost, .pay-ghost, .cal-btn, .mbe-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px; border:1px solid #d8e1ec;
  background:#fff; color:#33507a !important; border-radius:11px; padding:11px 18px; font-size:13px;
  font-weight:800; cursor:pointer; text-decoration:none !important; white-space:nowrap; line-height:1.2;
}
.sop-btn:hover, .mle-btn:hover, .pme-btn:hover, .mie-ghost:hover, .mbe-ghost:hover,
.pay-ghost:hover, .cal-btn:hover, .mbe-btn:hover:not([disabled]) {
  border-color:var(--sop-blue); color:var(--sop-blue) !important;
}
.sop-btn.is-primary, .mle-btn.blue, .pme-btn.blue, .cal-btn.primary,
.mie-save, .mbe-save, .pay-save {
  border:0; background:linear-gradient(135deg,#3f8cf3,#1f6fe5); color:#fff !important;
  box-shadow:0 4px 12px rgba(31,111,229,.3); border-radius:11px; padding:12px 24px;
  font-size:13.5px; font-weight:800; cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
}
.sop-btn.is-primary:hover, .mle-btn.blue:hover, .pme-btn.blue:hover, .cal-btn.primary:hover,
.mie-save:hover, .mbe-save:hover, .pay-save:hover { filter:brightness(1.05); color:#fff !important; }
.sop-btn.is-danger { border-color:#f3c2c2; color:#dc2626 !important; }
.sop-btn.is-danger:hover { background:#dc2626; border-color:#dc2626; color:#fff !important; }
.sop-btn.sm, .mle-btn.sm, .pme-btn.sm, .mbe-btn.sm { padding:7px 13px; font-size:12px; border-radius:9px; height:auto; }
.sop-btn[disabled], .mbe-btn[disabled] { opacity:.5; cursor:default; }

.sop-actions, .mie-actions, .mbe-actions, .mle-foot, .pay-actions, .pme-foot {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:22px;
  border-top:1px solid var(--sop-line); padding-top:18px;
}
.sop-req, .mbe-req, .pay-req { margin-left:auto; }
.sop-req, .mbe-req, .pay-req, .mle-foot .note { font-size:11.5px; color:var(--sop-mute); }
.sop-req b, .mbe-req b, .pay-req b, .mle-foot .note .req { color:#e5484d; font-weight:800; }

.sop-msg, .mie-msg, .mbe-msg, .mle-msg, .pme-msg, .pay-msg {
  display:flex; align-items:center; gap:9px; border-radius:12px; padding:12px 15px;
  font-size:13px; font-weight:600; margin-bottom:18px;
}
.sop-msg.ok, .mie-msg.ok, .mbe-msg.ok, .mle-msg.ok, .pme-msg.ok, .pay-msg.ok {
  background:#ecfdf3; border:1px solid #abefc6; color:#067647;
}
.sop-msg.no, .mie-msg.no, .mbe-msg.no, .mle-msg.bad, .pme-msg.bad, .pay-msg.no {
  background:#fdecec; border:1px solid #f4c9c9; color:#b42318;
}
.sop-msg.warn, .pme-msg.warn { background:#fffbf0; border:1px solid #f4dfae; color:#8a5a00; }
.sop-msg a, .mbe-msg a { color:inherit; text-decoration:underline; }
.sop-msg .x, .mle-msg .mle-x {
  margin-left:auto; background:none; border:0; font-size:19px; line-height:1; color:inherit; opacity:.55; cursor:pointer;
}
.sop-msg .x:hover, .mle-msg .mle-x:hover { opacity:1; }

.sop-tips, .pf-tips { background:#f5faff; border:1px solid #d7e9fb; border-radius:14px; padding:16px 18px; }
.sop-tips h3, .pf-tips h3 {
  display:flex; align-items:center; gap:8px; margin:0 0 10px; font-size:13.5px; font-weight:800; color:#123a63;
}
.sop-tips h3 svg, .pf-tips h3 svg { width:18px; height:18px; color:#f0a92c; }
.sop-tips ul, .pf-tips ul { list-style:none; margin:0; padding:0; }
.sop-tips li, .pf-tips li {
  display:flex; align-items:flex-start; gap:9px; font-size:12.5px; color:#3d5f86; line-height:1.5; margin-bottom:8px;
}
.sop-tips li:last-child, .pf-tips li:last-child { margin-bottom:0; }
.sop-tips li svg, .pf-tips li svg { flex:0 0 auto; width:15px; height:15px; color:#0f6fd6; margin-top:1px; }
.sop-hint, .pme-hint {
  background:#f7fbff; border:1px solid #d9e8fb; border-radius:12px; padding:11px 14px;
  font-size:12.5px; color:var(--sop-ink2); margin-top:16px;
}

.pf { max-width:1180px; }
.sop-hero, .pf-hero {
  position:relative; overflow:hidden; border-radius:16px; padding:20px 26px;
  background:linear-gradient(115deg,#1573d8 0%,#0f62c2 45%,#0a4894 100%);
  color:#fff; display:flex; align-items:center; gap:16px; margin-bottom:18px;
  box-shadow:0 10px 26px rgba(10,72,148,.22);
}
.sop-hero-ic, .pf-hero-ic {
  flex:0 0 50px; height:50px; border-radius:14px; background:#fff; color:#0f6fd6;
  display:flex; align-items:center; justify-content:center;
}
.sop-hero-ic svg, .pf-hero-ic svg { width:27px; height:27px; }
.sop-hero h1, .pf-hero h1 { margin:0; font-size:24px; font-weight:800; letter-spacing:-.02em; color:#fff; }
.sop-hero p, .pf-hero p { margin:2px 0 0; font-size:13px; color:#cfe3fb; }
.pf-sign { margin-left:auto; text-align:center; padding-right:78px; position:relative; z-index:2; }
.pf-sign em {
  font-style:normal; font-family:"Segoe Script","Ink Free","Bradley Hand ITC","Brush Script MT",cursive;
  font-size:21px; color:#eaf3ff; white-space:nowrap;
}
.pf-sign svg { display:block; width:160px; height:9px; margin:3px auto 0; color:#7db4f0; }
.pf-hero img.pf-mark {
  position:absolute; right:-12px; top:50%; transform:translateY(-50%); height:150px;
  opacity:.16; filter:brightness(0) invert(1); pointer-events:none;
}
.pf-hint { margin:0 0 14px; font-size:12.5px; line-height:1.6; color:#7089a8; max-width:80ch; }
.pf-head { display:flex; align-items:flex-start; gap:12px; margin-bottom:12px; }
.pf-head-ic {
  flex:0 0 36px; height:36px; border-radius:11px; background:#eaf3fd; color:#0f6fd6;
  display:flex; align-items:center; justify-content:center;
}
.pf-head-ic svg { width:19px; height:19px; }
.pf-head > div { flex:1; min-width:0; }
.pf-head h2 { margin:0 0 3px; font-size:16px; font-weight:800; color:#123a63; }
.pf-head p { margin:0; font-size:12.5px; line-height:1.55; color:#7089a8; }
.pf-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:9px 17px; font-size:13px;
  font-weight:700; border:1px solid #dbe8f7; border-radius:10px; background:#fff; color:#3d5f86;
  cursor:pointer; text-decoration:none; line-height:1.2;
}
.pf-btn:hover { border-color:#9dc8f2; color:#123a63; text-decoration:none; }
.pf-btn svg { width:16px; height:16px; }
.pf-btn.is-primary { background:linear-gradient(135deg,#1478df,#0b5fbb); border-color:#0b5fbb; color:#fff;
                     box-shadow:0 3px 10px rgba(11,95,187,.28); }
.pf-btn.is-primary:hover { filter:brightness(1.07); color:#fff; }
.pf-btn.is-danger { border-color:#f3c2c2; color:#dc2626; }
.pf-btn.is-danger:hover { background:#dc2626; border-color:#dc2626; color:#fff; }
.pf-field { margin-bottom:12px; }
.pf-label { display:block; font-size:11.5px; font-weight:700; letter-spacing:.02em; color:#7089a8; margin:0 0 5px; }
.pf-in { width:100%; padding:10px 12px; border:1px solid #dbe8f7; border-radius:10px; font-size:13.5px;
         color:#123a63; background:#fff; outline:none; }
.pf-in:focus { border-color:#0f6fd6; box-shadow:0 0 0 3px rgba(15,111,214,.14); }
.pf-in[disabled] { background:#f6f9fd; color:#8ba2bd; }
.pf-grid { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:14px; }
.pf-grid > div { flex:1 1 220px; min-width:0; }
.pf-note { font-size:11.5px; color:#7089a8; line-height:1.6; }
.pf-msg { display:flex; align-items:center; gap:9px; border-radius:12px; padding:12px 15px; font-size:13px;
          font-weight:600; margin-bottom:16px; }
.pf-msg svg { width:17px; height:17px; flex:0 0 auto; }
.pf-msg.ok { background:#e9f8ef; color:#15803d; border:1px solid #bfe7cf; }
.pf-msg.no { background:#fdecec; color:#b91c1c; border:1px solid #f4c9c9; }
.pf-pill { display:inline-flex; align-items:center; gap:5px; padding:3px 11px; border-radius:99px;
           font-size:11.5px; font-weight:800; vertical-align:middle; }
.pf-pill.on { background:#e9f8ef; color:#15803d; border:1px solid #bfe7cf; }
.pf-pill.off { background:#f1f5f9; color:#64748b; border:1px solid #e2e8f0; }
.pf-warn { border-color:#f6c9c9; background:#fdf4f4; }
.pf-warn h2 { color:#b42318; }
.pf-warn p { color:#7a271a; }
.pf-amber { border-color:#f4dfae; background:#fffbf1; }

.sop-legacy { --ink:#0f2744; --ink2:#334155; --mute:#64748b; --line:#e3eaf3;
              --blue:#1f6fe5; --soft:#eef5ff; --navy:#1e3a68; }

.sop-legacy .card {
  background:#fff; border:1px solid #d8e1ec; border-radius:16px;
  box-shadow:0 1px 3px rgba(16,24,40,.05);
}
.sop-legacy .card .card { box-shadow:none; }
.sop-legacy .card-body { padding:18px 20px; }
.sop-legacy .card-title, .sop-legacy p.card-title {
  font-size:17px; font-weight:800; color:var(--sop-ink); letter-spacing:-.2px; margin-bottom:12px;
}
.sop-legacy .card-description { font-size:12.5px; color:var(--sop-mute); }

.sop-legacy .table-responsive { overflow-x:auto; }
.sop-legacy table.table { width:100%; border-collapse:collapse; margin:0; color:var(--sop-ink2); }
.sop-legacy table.table thead th, .sop-legacy table.table th {
  background:var(--sop-navy); color:#fff; font-size:11.5px; font-weight:800; text-transform:uppercase;
  letter-spacing:.4px; text-align:left; padding:13px 16px; white-space:nowrap; border:0; vertical-align:middle;
}
.sop-legacy table.table td {
  padding:13px 16px; border:0; border-bottom:1px solid #eef3f9; font-size:13px;
  color:var(--sop-ink2); vertical-align:middle;
}
.sop-legacy table.table tbody tr:nth-child(odd) td { background:#f7fbff; }
.sop-legacy table.table tbody tr:hover td { background:var(--sop-soft); }
.sop-legacy table.table tbody tr:last-child td { border-bottom:0; }
.sop-legacy table.table-dark,
.sop-legacy table.table-dark th,
.sop-legacy table.table-dark td,
.sop-legacy table.table-dark tbody td {
  background-color:transparent !important; color:var(--sop-ink2) !important; border-color:#eef3f9;
}
.sop-legacy table.table-dark thead th {
  background:var(--sop-navy) !important; color:#fff !important;
}
.sop-legacy table.table-dark tbody tr:nth-child(odd) td { background:#f7fbff !important; }
.sop-legacy table.table-dark tbody tr:hover td { background:var(--sop-soft) !important; }
.sop-legacy table.table-dark a { color:var(--sop-blue) !important; }
.sop-legacy table.table-dark .sop-strong, .sop-legacy table.table-dark strong { color:var(--sop-ink) !important; }
.sop-legacy table.table-striped tbody tr:nth-of-type(odd) { background:transparent; }

.sop-legacy .btn {
  border-radius:11px; padding:10px 18px; font-size:13px; font-weight:800; line-height:1.2;
  display:inline-flex; align-items:center; justify-content:center; gap:8px; box-shadow:none;
}
.sop-legacy .btn-sm { padding:7px 13px; font-size:12px; border-radius:9px; }
.sop-legacy .btn-primary, .sop-legacy .btn-info {
  border:0; background:linear-gradient(135deg,#3f8cf3,#1f6fe5); color:#fff;
  box-shadow:0 4px 12px rgba(31,111,229,.3);
}
.sop-legacy .btn-primary:hover, .sop-legacy .btn-info:hover { filter:brightness(1.05); color:#fff; }
.sop-legacy .btn-success { border:0; background:linear-gradient(135deg,#25c07f,#12a366); color:#fff;
                           box-shadow:0 4px 12px rgba(18,163,102,.26); }
.sop-legacy .btn-danger  { border:0; background:#e5484d; color:#fff; box-shadow:0 4px 12px rgba(229,72,77,.24); }
.sop-legacy .btn-warning { border:0; background:#f0a92c; color:#3d2c00; }
.sop-legacy .btn-secondary, .sop-legacy .btn-light, .sop-legacy .btn-default {
  border:1px solid #d8e1ec; background:#fff; color:#33507a;
}
.sop-legacy .btn-secondary:hover, .sop-legacy .btn-light:hover, .sop-legacy .btn-default:hover {
  border-color:var(--sop-blue); color:var(--sop-blue); background:var(--sop-soft);
}
.sop-legacy [class*="btn-outline-"] { border:1px solid #d8e1ec; background:#fff; color:#33507a; }
.sop-legacy [class*="btn-outline-"]:hover { border-color:var(--sop-blue); color:var(--sop-blue); background:var(--sop-soft); }
.sop-legacy .btn-outline-danger { border-color:#f3c2c2; color:#dc2626; }
.sop-legacy .btn-outline-danger:hover { background:#dc2626; border-color:#dc2626; color:#fff; }
.sop-legacy .btn-outline-warning { border-color:#f4dfae; color:var(--sop-amber); background:#fff9ec; }
.sop-legacy .btn-outline-warning:hover { background:var(--sop-amber); border-color:var(--sop-amber); color:#fff; }

.sop-legacy .form-group label, .sop-legacy .col-form-label {
  font-size:12.5px; font-weight:700; color:var(--sop-ink); margin-bottom:7px;
}
.sop-legacy .form-control, .sop-legacy select.form-control, .sop-legacy textarea.form-control {
  border:1px solid #d8e1ec; border-radius:11px; padding:10px 13px; font-size:13.5px;
  color:var(--sop-ink); background:#fff; height:auto; min-height:44px; box-shadow:none;
}
.sop-legacy textarea.form-control { min-height:92px; }
.sop-legacy .form-control:focus {
  border-color:var(--sop-blue); box-shadow:0 0 0 3px rgba(31,111,229,.13); background:#fff;
}
.sop-legacy .form-control-sm { min-height:36px; padding:6px 10px; font-size:12.5px; border-radius:9px; }
.sop-legacy .input-group-text { border:1px solid #d8e1ec; background:#f8fbff; color:#a9c2e4; border-radius:11px; }
.sop-legacy .custom-select { border:1px solid #d8e1ec; border-radius:11px; min-height:44px; }

.sop-legacy .alert {
  border-radius:12px; padding:12px 15px; font-size:13px; font-weight:600; border-width:1px;
}
.sop-legacy .alert-success { background:#ecfdf3; border-color:#abefc6; color:#067647; }
.sop-legacy .alert-danger  { background:#fdecec; border-color:#f4c9c9; color:#b42318; }
.sop-legacy .alert-warning { background:#fffbf0; border-color:#f4dfae; color:#8a5a00; }
.sop-legacy .alert-info    { background:var(--sop-soft); border-color:#d3e6fb; color:#1f6fd8; }

.sop-legacy .badge {
  border-radius:8px; padding:4px 11px; font-size:11.5px; font-weight:800; letter-spacing:0;
}
.sop-legacy .badge-pill { border-radius:99px; }
.sop-legacy .badge-primary, .sop-legacy .badge-info  { background:#e7f0fd; color:#1f6fd8; }
.sop-legacy .badge-success { background:#e7f7ee; color:var(--sop-green); }
.sop-legacy .badge-danger  { background:#fdecec; color:var(--sop-red); }
.sop-legacy .badge-warning { background:#fff7e6; color:var(--sop-amber); }
.sop-legacy .badge-secondary, .sop-legacy .badge-light, .sop-legacy .badge-dark { background:#f1f5f9; color:#334155; }

.sop-legacy .modal-content { border:0; border-radius:16px; box-shadow:0 24px 60px rgba(16,42,80,.24); }
.sop-legacy .modal-header, .sop-legacy .modal-footer { border-color:var(--sop-line); }
.sop-legacy .nav-tabs { border-bottom:1px solid var(--sop-line); }
.sop-legacy .nav-tabs .nav-link { border:0; border-bottom:2px solid transparent; font-weight:700;
                                  color:var(--sop-mute); padding:10px 14px; }
.sop-legacy .nav-tabs .nav-link.active { color:var(--sop-blue); border-bottom-color:var(--sop-blue); background:transparent; }
.sop-legacy .page-header, .sop-legacy .page-title { color:var(--sop-ink); }
.sop-legacy hr { border-color:var(--sop-line); }

@media (max-width:1100px) {
  .sop-grid, .mie-grid, .mbe-grid, .pay-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sop-grid.four, .mle-fields.four, .pme-filters { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .sop-hero, .pf-hero { flex-wrap:wrap; }
  .pf-sign { margin-left:0; padding-right:0; width:100%; text-align:left; }
  .pf-sign svg { margin-left:0; }
  .pf-sign em { font-size:18px; white-space:normal; }
  .pf-hero img.pf-mark { height:110px; opacity:.12; }
}
@media (max-width:700px) {
  .sop-grid, .sop-grid.two, .sop-grid.four, .mie-grid, .mbe-grid, .pay-grid,
  .mle-fields, .mle-fields.four, .pme-filters { grid-template-columns:1fr; }
  .sop-f.wide, .mie-f.wide, .mbe-f.wide, .mle-fld.wide, .pay-f.wide { grid-column:span 1; }
.sop-banner.tall { align-items:flex-start; }
.sop-banner.tall .sop-bic { margin-top:2px; }

.sop-art, .mie-art, .mbe-art, .mle-art, .pme-art, .pay-art { display:none; }
  .sop-req, .mbe-req, .pay-req { margin-left:0; }
  .mle-foot .note { margin-right:0; width:100%; }
}