/* The roadmap's full path (steps + light product window) — shared by the homepage roadmap demo and /platform/roadmaps. Extracted from home.css so the rules have one definition. */
.rd{display:grid;grid-template-columns:350px minmax(0,1fr);gap:18px;max-width:1300px;margin:56px auto 0}
.rd-steps{list-style:none;display:flex;flex-direction:column;gap:6px;border:1px solid var(--line);border-radius:22px;padding:12px;background:linear-gradient(180deg,#121318,#0d0e11)}
.rd-steps button{all:unset;box-sizing:border-box;cursor:pointer;position:relative;display:grid;grid-template-columns:32px 1fr;gap:12px;width:100%;padding:12px 12px;border-radius:14px;transition:background .3s;overflow:hidden}
.rd-steps i{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-style:normal;font-size:13px;font-weight:700;color:var(--ink3);border:1px solid var(--line2);transition:all .3s}
.rd-steps b{display:block;font-size:15px;font-weight:600;color:var(--ink3);line-height:1.35;transition:color .3s}
.rd-steps span{display:block;margin-top:3px;font-size:13px;color:var(--ink4);transition:color .3s}
.rd-steps em{position:absolute;left:0;bottom:0;height:2px;width:0;background:#9fb0ff;box-shadow:0 0 10px #9fb0ff}
.rd-steps button.seen i{color:#c9d2ff;border-color:rgba(129,148,221,.55)}
.rd-steps button.seen b{color:var(--ink2)}
.rd-steps button.on{background:rgba(129,148,221,.09)}
.rd-steps button.on i{background:#8194dd;color:#0a0b0d;border-color:#8194dd}
.rd-steps button.on b{color:#fff}.rd-steps button.on span{color:var(--ink2)}
.rd-win{display:flex;flex-direction:column}
.rd-scroll{overflow-x:auto;flex:1;scrollbar-width:none}.rd-scroll::-webkit-scrollbar{display:none}
.rd-stage{position:relative;min-width:820px;aspect-ratio:880/430;margin:14px 18px 18px}
.rd-svg{position:absolute;inset:0;width:100%;height:100%}
.rd-svg path,.rd-svg circle#rdMd,.rd-svg circle#rdTd{transition:opacity .5s}
#rdScan{transition:width 1.6s ease,opacity .4s}
.rd-main{position:absolute;left:3.4%;top:91%;font:600 12px/1 "Plus Jakarta Sans";color:#475569}
.rd-dir,.rd-read,.rd-card,.rd-pause{position:absolute;background:#fff;border:1px solid var(--u-bd);border-radius:12px;padding:12px 14px;box-shadow:var(--u-sh2);transition:opacity .5s,transform .5s var(--ease)}
.rd-dir{left:2.3%;top:3.7%;width:41%}
.rd-dir .k,.rd-read .k,.rd-card .k,.rd-pause .k{display:flex;gap:8px;align-items:center;font-size:11.5px;font-weight:650;color:#596779}
.rd-dir b,.rd-card b{display:block;margin-top:6px;font-size:14px;font-weight:700;line-height:1.35;color:#0f172a}
.rd-dir p,.rd-card p,.rd-pause p{margin-top:5px;font-size:12px;line-height:1.5;color:#475569;min-height:18px}
.rd-read{left:47.7%;top:3.7%;width:50%}
.rd-read ul{list-style:none;margin-top:8px;display:grid;gap:4px}
.rd-read li{font:500 11.5px/1.5 ui-monospace,"SF Mono",monospace;color:#334155;opacity:0;transform:translateX(-6px);transition:all .4s}
.rd-read.on li{opacity:1;transform:none}.rd-read.on li:nth-child(2){transition-delay:.5s}.rd-read.on li:nth-child(3){transition-delay:1s}
.rd-card{left:13.6%;top:39.5%;width:36.4%}
#rdS2{left:56.8%}
.rd-card .st{margin-left:auto;transition:color .3s}
.rd-pills{display:flex;gap:6px;margin-top:10px}
.rd-pills span{font-size:11px;font-weight:650;color:#94a3b8;border:1px solid #e2e8f0;border-radius:7px;padding:4px 8px;transition:all .35s}
.rd-pills span.ok{color:#0b7648;border-color:#bfe8cf;background:#f0fbf5}
.rd-mlabel{position:absolute;left:51%;top:92.5%;font-size:11.5px;font-weight:650;color:#0b7648;transition:opacity .5s}
.rd-cut{position:absolute;left:58.5%;top:78%;font-size:11.5px;font-weight:650;color:#1d4fc4;transition:opacity .5s}
.rd-pause{left:47.7%;top:3.7%;width:50%;border-color:#f3dcae;background:#fffaf0}
.rd-pause .k{color:var(--u-warn)}
.rd-hide{opacity:0!important;transform:translateY(10px)!important;pointer-events:none}
@media(max-width:1060px){.rd{grid-template-columns:1fr}}
