:root{--navy:#0b1f33;--blue:#146c94;--factory:#edf5fb;--pcm:#eef4ed;--system:#f1f0fb;--erp:#fff5df;--line:#cdd8df;--text:#18212b;--muted:#5d6a76}*{box-sizing:border-box}body{margin:0;background:#f2f5f8;color:var(--text);font:16px Arial,sans-serif;line-height:1.5}.flow-header{padding:20px 30px;background:var(--navy);color:#fff;display:flex;justify-content:space-between;gap:20px;align-items:center}.flow-header p{margin:0 0 3px;color:#b9d7e6;font-size:13px;font-weight:bold}.flow-header h1{margin:0;font-size:26px}.flow-header nav{display:flex;gap:10px;flex-wrap:wrap}.flow-header a{padding:9px 12px;border:1px solid #9ac4d7;border-radius:8px;color:#fff;text-decoration:none;font-size:14px}.flow-content{width:min(1440px,100%);margin:auto;padding:28px}.intro{padding:22px 24px;background:#fff;border-radius:12px;box-shadow:0 2px 8px #102a4312}.intro h2{margin:0 0 8px;font-size:24px}.intro p{margin:0;color:var(--muted)}.legend{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.legend span,.owner{display:inline-block;padding:4px 8px;border-radius:999px;font-size:12px;font-weight:bold}.legend .factory{background:#dcecf8;color:#175274}.legend .pcm{background:#dcefdc;color:#2d6532}.legend .system{background:#e3e1f4;color:#4a417d}.legend .erp{background:#ffedbf;color:#7d5400}.flow-section{padding:36px 0;border-bottom:1px solid var(--line)}.section-title{display:flex;gap:12px;align-items:flex-start;margin-bottom:18px}.section-title>span{display:grid;place-items:center;min-width:34px;height:34px;border-radius:50%;background:var(--blue);color:#fff;font-weight:bold}.section-title h2{margin:0 0 3px;font-size:22px}.section-title p{margin:0;color:var(--muted)}.flow-row{display:grid;grid-template-columns:minmax(180px,1fr) 28px minmax(180px,1fr) 28px minmax(180px,1fr) 28px minmax(180px,1fr);gap:8px;align-items:stretch}.flow-card,.branch,.control-grid article{padding:16px;border:1px solid var(--line);border-radius:10px;background:#fff}.flow-card h3,.branch h3{margin:8px 0 7px;font-size:17px}.flow-card p,.branch p{margin:0}.flow-card small{display:block;margin-top:12px;color:var(--muted);font-size:12px}.flow-card.factory,.branch.factory{background:var(--factory);border-color:#b8d8ea}.flow-card.pcm{background:var(--pcm);border-color:#c6ddc5}.flow-card.system{background:var(--system);border-color:#d3cff0}.flow-card.erp{background:var(--erp);border-color:#f0d692}.factory .owner{background:#dcecf8;color:#175274}.pcm .owner{background:#dcefdc;color:#2d6532}.system .owner{background:#e3e1f4;color:#4a417d}.erp .owner{background:#ffedbf;color:#7d5400}.arrow{display:grid;place-items:center;color:#497187;font-size:28px;font-weight:bold}.split-flow{display:grid;grid-template-columns:1fr 100px 1fr;gap:14px;align-items:center}.branch ol{margin:10px 0;padding-left:20px}.branch li{margin:5px 0}.branch-arrow{display:grid;gap:6px;place-items:center;color:#497187;font-size:30px;font-weight:bold}.branch-arrow span{font-size:12px;color:var(--muted)}.outcome{margin-top:14px!important;padding-top:10px;border-top:1px solid #b8d8ea;font-size:13px;font-weight:bold}.down-arrow{margin:14px auto;max-width:500px;text-align:center;color:#497187;font-size:30px;font-weight:bold}.decision{max-width:800px;margin:auto;text-align:center}.decision-options{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center;margin-top:14px;font-size:12px}.decision-options strong{padding:8px;border-radius:8px;background:#dcecff;color:#075d9a}.decision-grid{display:grid;grid-template-columns:1fr 70px 1fr;gap:12px;align-items:center;margin-top:8px}.control-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.control-grid article{border-top:4px solid var(--blue)}.control-grid p{margin:7px 0 0;color:var(--muted);font-size:14px}.attention{border-bottom:0}@media(max-width:1000px){.flow-row{grid-template-columns:1fr;gap:10px}.arrow{transform:rotate(90deg);min-height:28px}.split-flow{grid-template-columns:1fr}.branch-arrow{transform:rotate(90deg);min-height:60px}.decision-grid{grid-template-columns:1fr}.decision-grid .down-arrow{margin:0;transform:rotate(90deg)}.control-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.flow-header{padding:16px;align-items:flex-start;flex-direction:column}.flow-content{padding:18px 14px}.intro{padding:18px}.intro h2{font-size:21px}.flow-section{padding:28px 0}.section-title h2{font-size:20px}.control-grid{grid-template-columns:1fr}.decision-options{grid-template-columns:1fr}.decision-options strong{order:-1}}
