:root{color-scheme:dark;--bg:#0b1019;--panel:#131c29;--raised:#1a2637;--text:#e7edf5;--muted:#9aaac0;--line:#304055;--story:#85b5ff;--entity:#c5a6ff;--assets:#6dd4be;--warn:#efc88f;font-family:Inter,"Noto Sans KR",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-size:14px;line-height:1.6}a{color:var(--story);text-underline-offset:4px}button,select{font:inherit;color:var(--text);background:var(--raised);border:1px solid var(--line);border-radius:7px;padding:8px 12px;cursor:pointer}button:hover,a:hover{filter:brightness(1.15)}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--story);outline-offset:4px}.bar{display:flex;align-items:center;gap:32px;padding:16px max(24px,calc((100vw - 1340px)/2));border-bottom:1px solid var(--line);background:var(--panel)}.brand{font-size:14px;letter-spacing:1.3px;font-weight:750;color:var(--text);text-decoration:none;white-space:nowrap}.brand span{color:var(--muted);font-weight:400}.bar nav{display:flex;gap:24px;flex:1}.bar nav a{font-size:13px;color:var(--muted);text-decoration:none}.bar nav a[aria-current]{color:var(--text);border-bottom:2px solid var(--story);padding-bottom:5px}main{max-width:1390px;margin:auto;padding:40px 28px}.intro{display:flex;align-items:center;justify-content:space-between;gap:24px}.eyebrow{font-size:11px;letter-spacing:1.8px;color:var(--muted);margin:0 0 8px}h1{font-size:30px;line-height:1.3;letter-spacing:-1px;margin:0}h2{font-size:20px;margin:0}h3{font-size:15px}.lede{color:var(--muted);max-width:700px;margin-bottom:0}.lede b{color:var(--text);font-weight:500}.sample-label{display:grid;gap:8px;font-size:12px;color:var(--muted);flex:none}.sample-label select{min-width:230px}.summary{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:26px 0 16px}.summary .metric{display:flex;align-items:baseline;gap:8px}.summary strong{font-size:24px;letter-spacing:-.7px;font-variant-numeric:tabular-nums}.summary span{color:var(--muted);font-size:12px}.summary .separator{margin:0 12px;color:var(--line)}.measurement-note{font-size:12px;color:var(--muted);padding:10px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}summary{cursor:pointer}.measurement-note p{max-width:1080px}.scope-note{display:flex;align-items:flex-start;gap:18px;padding:15px 18px;margin:18px 0 28px;background:color-mix(in srgb,var(--warn) 7%,transparent);border-left:3px solid var(--warn);font-size:12px}.scope-note>span{color:var(--warn);white-space:nowrap;font-weight:600}.scope-note p{margin:0;color:var(--muted)}.scope-note b{font-weight:500;color:var(--text)}.lane-head{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:56px;text-align:center;margin-bottom:18px;font-size:12px;color:var(--muted)}.lane-head span:first-child{color:var(--entity)}.lane-head span:last-child{color:var(--assets)}.diagram{position:relative}.flow{display:grid;grid-template-columns:1fr 1.1fr 1fr;column-gap:56px;row-gap:44px;position:relative;z-index:1}.flow-card{min-width:0;background:var(--panel);border:1px solid var(--line);border-top:2px solid var(--accent);border-radius:10px;padding:15px 17px;scroll-margin-top:30px;transition:border-color .15s,box-shadow .15s}.flow-card:target{box-shadow:0 0 0 2px var(--accent)}.flow-card[data-lane=story]{--accent:var(--story);grid-column:2}.flow-card[data-lane=entity]{--accent:var(--entity);grid-column:1}.flow-card[data-lane=assets]{--accent:var(--assets);grid-column:3}.card-title{display:flex;gap:10px;align-items:baseline}.number{color:var(--accent);font-family:ui-monospace,monospace;font-size:11px}.card-title h2{font-size:16px;letter-spacing:-.4px}.unit{font-size:11px;color:var(--muted);margin:6px 0 13px;padding-left:27px}.ports{display:grid;gap:9px}.port-section{display:grid;grid-template-columns:28px 1fr;gap:6px}.port-label{font:10px/20px ui-monospace,monospace;color:var(--muted)}.port-list{display:grid;gap:5px;min-width:0}.port{display:flex;flex-wrap:wrap;justify-content:space-between;gap:0 10px;font-size:12px}.port-name{color:var(--muted)}.port-metric{font-variant-numeric:tabular-nums;font-weight:550}.port-volume{display:block;color:var(--muted);font-size:10px;white-space:normal;font-weight:400}.unavailable{color:var(--muted);font-weight:400;font-size:11px}.out-section{border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent);padding-top:8px}.out-section .port-label{color:var(--accent)}.card-bottom{display:flex;justify-content:space-between;align-items:center;gap:6px;margin-top:12px}.data-from{display:flex;gap:5px;flex-wrap:wrap}.data-from a{font:10px ui-monospace,monospace;padding:3px 5px;color:var(--muted);background:var(--raised);border-radius:4px;text-decoration:none}.details-button{font-size:11px;padding:4px 8px;background:transparent;white-space:nowrap}.flow-card.active{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}#edges{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}#edges path.connector{fill:none;stroke:var(--line);stroke-width:1.7;marker-end:url(#arrow)}#edges path.connector.secondary{opacity:.2}#edges path.connector.highlight{stroke:var(--story);stroke-width:2.3;opacity:1}#edges marker path{fill:var(--muted)}.boundary{margin:42px 0 20px;border-top:1px solid var(--line);padding-top:28px}.boundary-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px;font-size:13px;color:var(--muted)}.boundary h3{color:var(--text);font-weight:600}ul{padding-left:19px}.quiet{font-size:12px;color:var(--muted)}footer{font:11px/1.9 ui-monospace,monospace;color:var(--muted);border-top:1px solid var(--line);padding-top:18px;overflow-wrap:anywhere}dialog{background:var(--bg);color:var(--text);border:1px solid var(--line);border-radius:12px;width:min(960px,calc(100vw - 32px));max-height:88vh;padding:0}dialog::backdrop{background:#0009}dialog>header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:23px 27px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:2}#detail-body{padding:20px 27px 28px}#detail-body h3{margin:24px 0 10px}#detail-body p{font-size:13px}.detail-note{padding:12px 16px;background:var(--panel);border-left:2px solid var(--entity)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px}th,td{padding:10px 9px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}th{color:var(--muted);font-weight:500;white-space:nowrap}td{overflow-wrap:anywhere}td code{font-size:11px;color:var(--muted)}.source-list{display:grid;gap:8px;padding-left:0;list-style:none}.source-list li{font-size:12px;overflow-wrap:anywhere}.source-list code{color:var(--muted)}.batch-note{color:var(--story)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.flow-guide{margin:0 0 22px;text-align:center;font-size:11px;color:var(--muted)}
@media(max-width:1050px){.flow,.lane-head{column-gap:26px}.flow-card{padding:12px}.card-title h2{font-size:14px}.intro{align-items:flex-start}.bar{gap:18px}.port{display:block}.port-metric{display:block}.unit{padding-left:0}.card-bottom{align-items:flex-start}}
@media(max-width:720px){main{padding:26px 16px}.bar{padding:14px 16px;flex-wrap:wrap;gap:10px}.bar nav{order:3;flex-basis:100%}.bar>button{margin-left:auto;font-size:11px}.intro{display:block}h1{font-size:25px}.sample-label{margin-top:20px}.summary{gap:8px}.summary strong{font-size:20px}.summary .separator{margin:0 3px}.scope-note{display:block}.scope-note>span{display:block;margin-bottom:6px}.lane-head{display:none}.flow{display:flex;flex-direction:column;gap:28px;padding-left:14px;border-left:1px solid var(--line)}.flow-card{padding:17px}.card-title h2{font-size:17px}.port{display:flex}.port-metric{display:inline}.unit{padding-left:27px}.boundary-grid{grid-template-columns:1fr;gap:4px}#edges{display:none}dialog>header,#detail-body{padding:18px}.card-bottom{align-items:center}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
@media print{:root{--bg:#fff;--panel:#fff;--raised:#eee;--text:#111;--muted:#555;--line:#bbb;--story:#285c9f;--entity:#67428d;--assets:#176c59;color-scheme:light}body{font-size:11px}.bar nav,.bar button,.sample-label,.details-button,.measurement-note{display:none}main{padding:12px;max-width:none}.intro h1{font-size:24px}.flow,.lane-head{column-gap:24px;row-gap:28px}.flow-card{break-inside:avoid}.boundary{break-before:page}.source-list a{color:#111}dialog{display:none}}
