:root{--bg2:#f6f5f1;--t:#5f5e5a;--p:#534ab7;--s:#999;--b:#d3d1c7}*{box-sizing:border-box}body{color:#2c2c2a;margin:0;font-family:Pretendard,-apple-system,sans-serif}.app-shell{max-width:1200px;margin:0 auto;padding:0 20px 60px}.hero-panel{padding:32px 24px}.topbar{align-items:center;gap:12px;margin-bottom:24px;display:flex}.topbar img{height:32px}.topbar div{flex-direction:column;display:flex}.topbar span{color:var(--t);font-size:12px}.topbar strong{font-size:16px}.hero-copy h1{margin:8px 0;font-size:28px}.eyebrow{text-transform:uppercase;letter-spacing:.08em;color:var(--p);font-size:12px;font-weight:500}.proof-strip{flex-wrap:wrap;gap:12px;margin-top:16px;display:flex}.proof-strip span{color:#3c3489;background:#eeedfe;border-radius:999px;padding:6px 12px;font-size:12px}.workspace{grid-template-columns:minmax(0,5.5fr) minmax(340px,4.5fr);gap:24px;margin-top:24px;display:grid;position:relative}.flow-card{border:1px solid var(--b);background:#fff;border-radius:12px;padding:20px}.flow-header{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:12px;display:flex}.flow-header h2{margin:4px 0 0;font-size:18px}.flow-header p{color:var(--t);font-size:13px}.flow-stage{width:100%}.flow-stage svg{width:100%;display:block}.flow-node-svg{outline:none;transition:opacity .15s,filter .15s}.flow-node-svg:hover{opacity:.85;filter:drop-shadow(0 8px 10px #2c2c2a38)}.flow-node-svg.active rect,.flow-node-svg.active path{stroke-width:2px}.flow-node-svg:focus-visible rect,.flow-node-svg:focus-visible path{stroke-width:2px;filter:drop-shadow(0 0 .35rem #534ab78c)}.flow-node-svg:active{opacity:.72}.c-gray{fill:#f1efe8;stroke:#5f5e5a}.c-gray .t,.c-gray .th{fill:#2c2c2a}.c-gray .ts{fill:#444441}.c-blue{fill:#e6f1fb;stroke:#185fa5}.c-blue .t,.c-blue .th{fill:#042c53}.c-blue .ts{fill:#0c447c}.c-purple{fill:#eeedfe;stroke:#534ab7}.c-purple .t,.c-purple .th{fill:#26215c}.c-purple .ts{fill:#3c3489}.c-teal{fill:#e1f5ee;stroke:#0f6e56}.c-teal .t,.c-teal .th{fill:#04342c}.c-teal .ts{fill:#085041}.c-coral{fill:#faece7;stroke:#993c1d}.c-coral .t,.c-coral .th{fill:#4a1b0c}.c-coral .ts{fill:#712b13}.c-pink{fill:#fbeaf0;stroke:#993556}.c-pink .t,.c-pink .th{fill:#4b1528}.c-pink .ts{fill:#72243e}.c-green{fill:#eaf3de;stroke:#3b6d11}.c-green .t,.c-green .th{fill:#173404}.c-green .ts{fill:#27500a}.t,.ts,.th{font-family:inherit}.t{fill:#2c2c2a;font-size:14px}.ts{fill:#5f5e5a;font-size:12px}.th{fill:#2c2c2a;font-size:14px;font-weight:500}.arr{stroke:var(--t);stroke-width:1.5px;fill:none}.detail-panel{border:1px solid var(--b);background:#fff;border-radius:12px;align-self:start;max-height:calc(100vh - 40px);padding:20px;position:sticky;top:20px;overflow-y:auto;box-shadow:0 18px 40px #2c2c2a14}.detail-panel h2{margin:4px 0 8px;font-size:18px}.summary{color:#444441;font-size:14px;line-height:1.6}.service-box{background:#f6f5f1;border-radius:8px;margin:12px 0;padding:12px}.service-box strong{color:var(--p);margin-bottom:4px;font-size:12px;display:block}.service-box p{color:#444441;margin:0;font-size:13px}.detail-list{padding-left:18px;font-size:13px;line-height:1.6}.code-block{color:#f1efe8;white-space:pre;background:#2c2c2a;border-radius:8px;padding:12px;font-size:12px;overflow-x:auto}.service-shot img{border:1px solid var(--b);border-radius:8px;width:100%}.service-shot figcaption{color:var(--t);margin-top:6px;font-size:12px}.drawer-close,.detail-backdrop{display:none}@media (width<=900px){.workspace{display:block}.flow-card{position:relative}.detail-panel{z-index:20;width:min(440px,100vw - 32px);max-width:none;max-height:calc(100dvh - 32px);transition:transform .22s,box-shadow .22s;position:fixed;inset:16px 16px 16px auto;overflow-y:auto;transform:translate(100%);box-shadow:-22px 0 42px #2c2c2a3d}.workspace .detail-panel.open{transform:translate(0)}.drawer-close{z-index:2;float:right;border:1px solid var(--b);min-width:54px;height:34px;color:var(--p);cursor:pointer;background:#fff;border-radius:999px;justify-content:center;align-items:center;margin:-4px -4px 10px 10px;font-size:14px;font-weight:700;display:inline-flex;position:sticky;top:0;box-shadow:0 8px 18px #2c2c2a1f}.detail-backdrop{z-index:10;pointer-events:none;opacity:0;background:#2c2c2a00;border:none;transition:opacity .18s,background .18s;display:block;position:fixed;inset:0}.detail-backdrop.open{pointer-events:auto;opacity:1;background:#2c2c2a57}}.service-summary{background:#f6f5f1;border-radius:12px;margin-top:32px;padding:20px}.service-summary h2{margin:4px 0 8px;font-size:18px}.service-summary p{color:#444441;font-size:14px;line-height:1.7}