:root{--blue:#165dff;--ink:#253343;--muted:#84909e;--line:#e6e9ed;--side:280px;--header:72px;--footer:56px;font-family:Inter,"Segoe UI","Microsoft YaHei",sans-serif;color:var(--ink);font-synthesis:none}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#f2f3f5;font-size:13px}button,input,select{font:inherit}button{cursor:pointer;color:inherit;border:0;background:transparent;border-radius:6px;padding:7px 10px;white-space:nowrap}button:hover{background:#edf1f8;color:var(--blue)}button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--blue);outline-offset:2px}button.active{color:var(--blue);background:#edf3ff}input[type=range]{accent-color:var(--blue);cursor:pointer;height:16px;min-width:0}input[type=checkbox]{accent-color:var(--blue);cursor:pointer}select{border:0;background:#f3f5f8;border-radius:5px;padding:5px;color:var(--ink)}header{position:fixed;inset:0 0 auto;height:var(--header);background:rgba(255,255,255,.95);display:flex;align-items:center;padding:0 26px;border-bottom:1px solid var(--line);z-index:30;gap:14px}.brand-mark{width:34px;height:34px;background:#213b43;color:white;font-size:25px;font-weight:600;border-radius:8px;text-align:center;position:relative}.brand-mark span{font-size:18px;color:#95d5dc;position:absolute;right:3px;bottom:1px}.brand{display:flex;gap:20px;align-items:center}.brand strong{font-size:18px;font-weight:600;letter-spacing:1px}.brand>span{color:#8c969f;border-left:1px solid var(--line);padding-left:20px;font-size:12px}.header-right{margin-left:auto;display:flex;align-items:center;gap:9px;color:#74828d;font-size:12px}.status-dot{height:6px;width:6px;background:#41a58b;border-radius:50%}.version{margin-left:15px;border:1px solid var(--line);padding:3px 7px;border-radius:4px;color:#83919d;font-size:10px}#help{margin-left:14px;border:1px solid #dde3e8;width:26px;height:26px;border-radius:50%;padding:0}#menu{display:none}#sidebar{position:fixed;top:var(--header);bottom:var(--footer);left:0;width:var(--side);background:#fff;border-right:1px solid var(--line);z-index:20;display:flex;flex-direction:column}.side-heading{display:flex;justify-content:space-between;padding:25px 20px 20px;font-weight:600}.side-heading small{font-size:10px;font-weight:400;color:var(--muted)}.search{margin:0 16px;display:flex;align-items:center;padding:0 7px;border:1px solid var(--line);border-radius:7px;background:#fafbfc;height:38px}.search>span{font-size:22px;color:#8f9aa5;line-height:1}.search input{border:0;background:transparent;outline:0;width:100%;padding:7px;font-size:12px}.search button{padding:3px 7px;color:#9aa4ae}.tree-tools{display:flex;gap:0;justify-content:space-between;padding:12px 13px;border-bottom:1px solid #f0f2f4}.tree-tools button{font-size:11px;padding:5px 6px;color:#7e8b98}#tree{overflow:auto;flex:1;padding:10px 10px 20px;scrollbar-width:thin;scrollbar-color:#d8dfe5 transparent}.tree-row{display:flex;align-items:center;gap:5px;height:36px;border-radius:5px;padding:0 5px;user-select:none}.tree-row:hover{background:#f4f7fa}.tree-row.selected{background:#eaf1ff;color:var(--blue)}.tree-row>input{width:12px;height:12px;margin:0 3px;flex-shrink:0}.tree-row>button.toggle{font-size:10px;padding:3px;width:20px;flex-shrink:0}.tree-row .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;font-size:12px;flex:1;line-height:30px}.tree-row.level1 .name{font-weight:500}.tree-row.level2{padding-left:19px}.tree-row.level3{padding-left:37px;height:30px}.tree-row.level3 .name{font-size:11px;color:#647382}.tree-row .count{font-size:10px;color:#a2acb6}.tree-row.filtered{display:none}.side-foot{display:flex;align-items:center;gap:12px;margin:0 18px;padding:16px 0;border-top:1px solid var(--line);font-size:11px;color:#617283}.side-foot small{display:block;color:#9ba4ad;font-size:10px;padding-top:5px}.mini-grid{font-size:24px;color:#94a3af}#viewport{position:fixed;top:var(--header);bottom:var(--footer);left:var(--side);right:0;background:linear-gradient(150deg,#f2f3f5,#fff);overflow:hidden}#canvas-host{position:absolute;inset:0}canvas{display:block;touch-action:none}.viewport-title{position:absolute;top:34px;left:36px;pointer-events:none;z-index:2}.eyebrow{font-size:10px;letter-spacing:3px;color:#92a2af}.viewport-title h1{font-size:23px;letter-spacing:1px;font-weight:500;margin:10px 0 7px}.viewport-title p{color:#94a0aa;font-size:12px;margin:0}#view-controls{display:flex;position:absolute;right:28px;top:28px;padding:4px;background:rgba(255,255,255,.88);box-shadow:0 2px 16px #27344308;border:1px solid white;border-radius:8px;gap:2px}#view-controls button{font-size:12px;padding:7px 12px}#loading{position:absolute;inset:0;display:flex;flex-direction:column;gap:16px;align-items:center;justify-content:center;background:#f3f5f8ee;z-index:9}#loading small{color:#8c98a3}.spinner{width:32px;height:32px;border:2px solid #dce5ef;border-top-color:var(--blue);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#viewport-bottom{position:absolute;bottom:24px;left:30px;right:30px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;color:#9aa3ab;font-size:11px}.legend{display:flex;gap:20px;align-items:center}.legend button{pointer-events:auto;display:flex;align-items:center;gap:6px;background:white;box-shadow:0 2px 12px #00000005;padding:9px 13px;border:1px solid #e6ecf0}.ball{width:9px;height:9px;display:inline-block;border-radius:50%;box-shadow:inset -1px -2px 3px #0002}.ball.yellow{background:#ffd600}.ball.blue{background:#009fea}.legend span{margin-left:6px}#info{position:fixed;right:0;top:var(--header);bottom:var(--footer);width:300px;padding:0 24px;background:#fffffff5;border-left:1px solid var(--line);box-shadow:-8px 0 30px #27344307;z-index:22;transform:translateX(101%);transition:transform .2s;overflow-y:auto}#info.open{transform:translateX(0)}.info-top{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-bottom:1px solid var(--line);color:#85939e;font-size:12px}.info-top button{font-size:23px;padding:0 6px}.info-icon{margin:26px 0 16px;background:#edf3f9;border-radius:12px;display:flex;align-items:center;justify-content:center;width:48px;height:48px;font-size:26px;color:#7192aa}#info h2{font-size:20px;line-height:1.6;font-weight:500;overflow-wrap:anywhere;margin:0 0 7px}#info-id{color:#93a1ad;font-size:11px}.mono{font-family:Consolas,monospace}dl{margin-top:26px}dt{color:#9aa5ae;font-size:11px;margin-top:20px}dd{margin:7px 0;color:#51616f;font-size:12px;line-height:1.8}.info-actions{display:flex;gap:8px;margin-top:28px}.info-actions button{border:1px solid var(--line);font-size:11px;padding:9px 12px}.info-actions button:first-child{color:var(--blue);background:#f0f5ff;border-color:#e3ecff}.info-note{font-size:10px;color:#a4aeb7;line-height:1.8;margin-top:24px}footer{position:fixed;bottom:0;left:0;right:0;height:var(--footer);background:white;border-top:1px solid var(--line);z-index:35;display:flex;align-items:center;gap:12px;padding:0 24px}.mode-switch{display:flex;background:#f3f5f8;padding:3px;border-radius:7px}.mode-switch button{padding:5px 16px;font-size:12px}.mode-switch button.active{background:white;box-shadow:0 1px 5px #0001}.explode-control{display:flex;align-items:center;gap:9px}.explode-control input{width:116px}.explode-control select{background:white;font-size:11px}.separator{height:22px;border-left:1px solid var(--line);margin:0 5px}.play{width:31px;height:31px;padding:0;color:white;background:var(--blue);border-radius:50%}.play:hover{background:#0047e8;color:white}#timeline{flex:1;max-width:470px}#time{font-size:11px;color:#8392a1;min-width:78px}#loop,#speed,#more{font-size:11px}#more{margin-left:auto}.popup{position:fixed;z-index:50;background:white;box-shadow:0 6px 24px #26395025;border:1px solid var(--line);padding:6px;border-radius:8px;min-width:150px}.popup button,.popup label{display:block;width:100%;text-align:left;font-size:12px;padding:10px}.popup label{cursor:pointer}.popup[hidden]{display:none}#more-menu{bottom:65px;right:16px}#tooltip{position:absolute;background:#233544e8;color:white;padding:7px 10px;font-size:11px;border-radius:5px;pointer-events:none;display:none;z-index:26;max-width:280px}.route-label{position:absolute;border:1px solid #eadc87;background:#fffdf1ef;padding:5px 9px 5px 5px;border-radius:6px;color:#82712c;font-size:10px;display:none;pointer-events:none;white-space:nowrap}.route-label b{background:#ffd600;color:#574b0c;width:18px;height:18px;display:inline-flex;justify-content:center;align-items:center;margin-right:6px;border-radius:4px}.route-label.blue{background:#f0faffef;color:#337997;border-color:#b7deed}.route-label.blue b{background:#009fea;color:white}#notice{position:absolute;left:50%;top:100px;transform:translateX(-50%);border:1px solid #e1e9f0;background:#ffffffee;box-shadow:0 4px 20px #0001;border-radius:7px;padding:10px 16px;font-size:12px;z-index:25;display:none;white-space:nowrap}dialog{border:1px solid #e1e6eb;border-radius:14px;width:min(460px,90vw);padding:32px;color:var(--ink);box-shadow:0 24px 100px #19293730}dialog::backdrop{background:#1f304b38;backdrop-filter:blur(3px)}dialog h2{font-weight:500;font-size:24px}dialog p{font-size:13px;line-height:1.9;color:#697885}dialog small{color:#9aa5af;line-height:1.8;display:block}#close-help{position:absolute;top:15px;right:15px;font-size:22px}#understood{margin-top:25px;padding:10px 20px;background:var(--blue);color:white}
@media(max-width:1100px){.viewport-title h1{font-size:19px}.viewport-title{top:86px;left:25px}#view-controls{top:18px;right:18px}.brand>span{display:none}footer{padding:0 12px;gap:7px}.explode-control input{width:80px}.mode-switch button{padding:5px 11px}#gesture-hint{display:none}}
@media(max-width:700px){:root{--header:60px;--side:0px;--footer:106px}header{padding:0 14px;gap:9px}#menu{display:block;padding:5px;font-size:17px}.brand strong{font-size:15px}.brand-mark{display:none}.header-right{font-size:10px;gap:6px}.version{margin-left:5px}#help{margin-left:5px}#sidebar{width:280px;transform:translateX(-100%);box-shadow:8px 0 30px #0001;transition:transform .2s}#sidebar.open{transform:translateX(0)}#viewport-title{top:80px}.viewport-title{top:79px;left:20px}.viewport-title h1{font-size:19px}.viewport-title p{font-size:11px}.eyebrow{font-size:8px}#view-controls{left:13px;right:13px;top:15px;justify-content:space-around}#view-controls button{font-size:11px;padding:6px 9px}#viewport-bottom{bottom:17px;left:16px;right:16px}.legend{gap:10px}.legend button{font-size:10px;padding:7px 9px}#mode-label{font-size:10px}footer{display:grid;grid-template-columns:auto 1fr auto auto;grid-template-rows:40px 42px;gap:6px;padding:8px 12px}.mode-switch{grid-column:1}.explode-control{grid-column:2 / 4;justify-content:flex-end}.explode-control input{width:85px}#more{grid-column:4;grid-row:1}.separator{display:none}#play{grid-column:1;grid-row:2;margin-left:5px}#restart{display:none}#timeline{grid-column:2;grid-row:2;width:100%}#time{display:none}#loop{grid-column:3;grid-row:2}#speed{grid-column:4;grid-row:2}#info{width:min(300px,88vw)}#more-menu{bottom:116px}#notice{top:150px;max-width:90%;white-space:normal}.route-label{font-size:9px;padding:3px 5px}.route-label b{width:15px;height:15px}#status{max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* R16 assembly-following callouts and stronger selection */
.tree-row.selected{background:#dceaff;box-shadow:inset 3px 0 #1263ed;color:#0648bc;font-weight:600}.tree-row.selected .name{color:#0648bc}.tree-row.selected .count{color:#1263ed}
#tracking-layer{position:absolute;inset:0;pointer-events:none;z-index:5}#tracking-layer svg{position:absolute;width:100%;height:100%;overflow:hidden}#tracking-layer path{fill:none;stroke:#7295bd;stroke-width:1.2;opacity:.78}#tracking-layer circle{fill:#1765d7;stroke:white;stroke-width:1.2}
.tracking-label{position:absolute;pointer-events:auto;text-align:left;background:#fffffff2;border:1px solid #c7d7e8;border-radius:6px;padding:6px 9px;box-shadow:0 3px 12px #20446610;white-space:normal;line-height:1.2;min-height:35px}.tracking-label strong{display:block;font-size:11px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tracking-label small{display:block;font-size:9px;color:#758ba0;margin-top:3px}.tracking-label.chosen{background:#1263ed;border-color:#1263ed;color:white}.tracking-label.chosen small{color:#d5e5ff}.tracking-label[hidden]{display:none}.is-exploded .viewport-title p{visibility:hidden}
#flow-stages{position:absolute;top:35px;left:36px;z-index:3;display:flex;gap:10px;align-items:center;pointer-events:none;color:#71808c;background:#ffffffdc;padding:10px 13px;border:1px solid #e2e8ec;border-radius:8px;font-size:11px}#flow-stages b{color:#b78b36;margin-right:4px;font-size:10px}#flow-stages i{font-style:normal;color:#a8b5bf}#flow-stages small{font-size:9px;color:#97a2ac;border-left:1px solid #e3e8ec;padding-left:10px}#flow-stages.running b{color:#128b75}#flow-stages[hidden]{display:none}#viewport:has(#flow-stages:not([hidden])) .viewport-title{top:96px}#viewport:has(#flow-stages:not([hidden])) .viewport-title h1{font-size:20px}
@media(max-width:1250px){#flow-stages{top:70px;left:25px}#viewport:has(#flow-stages:not([hidden])) .viewport-title{top:123px}}
@media(max-width:700px){#flow-stages{top:65px;left:16px;right:16px;justify-content:center;padding:8px 4px;gap:5px;font-size:10px}#flow-stages small{display:none}#viewport:has(#flow-stages:not([hidden])) .viewport-title{top:113px}#viewport:has(#flow-stages:not([hidden])) .viewport-title h1{font-size:17px}.tracking-label{padding:5px 6px}.tracking-label strong{font-size:10px}.tracking-label small{font-size:8px}.is-exploded .viewport-title{display:none}}

#label-pager{position:absolute;bottom:72px;left:50%;transform:translateX(-50%);pointer-events:auto;display:flex;align-items:center;gap:8px;padding:4px;background:#fffffff2;border:1px solid #cfdae7;border-radius:7px;font-size:11px;white-space:nowrap}#label-pager[hidden]{display:none}#label-pager button{font-size:17px;padding:2px 10px}#label-pager button:disabled{opacity:.3;cursor:default}.tracking-label.compact{min-height:22px;padding-top:4px;padding-bottom:4px}.tracking-label.compact small{display:none}

/* R18 neutral photographic stage, with accessible UI contrast. */
#viewport{background:#454e57}.viewport-title .eyebrow{color:#9aadb9}.viewport-title h1{color:#f2f6f8;font-weight:400;letter-spacing:1.5px}.viewport-title p{color:#bcc9d2}#viewport-bottom{color:#c0cbd3}#mode-label,#gesture-hint{color:#c0cbd3}#view-controls{background:#ffffffed}.route-label{z-index:6}#quality{border:1px solid #dce3e9;font-size:11px;padding:5px 8px}#quality.active{border-color:#b9cfed;background:#edf4ff}.ball.blue{width:6px;height:6px}#flow-stages{background:#ffffffea}#flow-stages small{color:#607487}
@media(max-width:700px){#quality{font-size:9px;padding:4px 5px}.version{display:none}#status{max-width:62px}.viewport-title h1{font-size:17px}#help{margin-left:0}}

#quality-review{width:min(1040px,94vw);padding:20px;background:#fff}#quality-review .review-head{display:flex;align-items:center;justify-content:space-between}.review-head small{font-size:11px;color:#84909e}.review-head h2{margin:7px 0 15px;font-size:21px}.review-head button{font-size:26px}.review-frame{position:relative;--split:50%;width:100%;aspect-ratio:1000/592;background:#454e57;overflow:hidden;border-radius:8px}.review-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.review-after{clip-path:inset(0 0 0 var(--split))}.review-divider{position:absolute;top:0;bottom:0;left:var(--split);width:2px;background:white;box-shadow:0 0 8px #0008}.review-tag{position:absolute;top:16px;background:#162638cc;color:white;border:1px solid #fff4;padding:6px 10px;border-radius:5px;font-size:11px}.review-tag.old{left:16px}.review-tag.new{right:16px}.review-slider{display:flex;align-items:center;gap:15px;margin-top:15px;font-size:12px;color:#758392}.review-slider input{flex:1}#quality-review p{margin-bottom:0;font-size:11px;color:#8794a0}
#viewport{background:#f2f3f5}.viewport-title .eyebrow{color:#84909e}.viewport-title h1{color:#33414f}.viewport-title p{color:#73818e}#viewport-bottom,#mode-label,#gesture-hint{color:#74828e}

#render-status{font-size:10px;padding:6px 10px;background:#ffffffc9;border:1px solid #dce1e6;border-radius:20px;color:#6c7b87}#render-status[data-mode=traced]{color:#277066;border-color:#c5dcd5}@media(max-width:700px){#render-status{display:none}}

.viewport-title{padding:12px 14px;border-radius:10px;background:#ffffffdc;backdrop-filter:blur(10px)}.viewport-title h1{font-size:21px!important}.viewport-title .eyebrow{font-size:9px}#material-views{position:absolute;top:78px;right:28px;display:flex;gap:3px;background:#ffffffeb;border:1px solid #e0e5e8;border-radius:9px;padding:4px;font-size:11px}#material-views button{padding:6px 8px}#viewport.is-exploded #material-views{display:none}@media(max-width:700px){#material-views{top:111px;right:12px;font-size:10px}.viewport-title{display:none}#material-views button{padding:5px 6px}}
.material-audit-image{display:block;width:100%;height:auto;border:1px solid #dce3e6;border-radius:10px}