.pd-hero{perspective:1200px;container-type:inline-size}.pd-glow{background:radial-gradient(circle at 80% 68%,#fff6,#0000 24%),radial-gradient(circle at 55%,#7c3aed38,#0000 34%)}.pd-floor{transform-origin:bottom;background-image:linear-gradient(#0b121914 1px,#0000 1px),linear-gradient(90deg,#0b121914 1px,#0000 1px);background-size:36px 36px;transform:perspective(700px)rotateX(64deg)translateY(20%);-webkit-mask-image:radial-gradient(#000 20%,#0000 72%);mask-image:radial-gradient(#000 20%,#0000 72%)}.pd-stage{transform-style:preserve-3d;font-size:max(10px,min(1.3cqw,18px));top:10%;bottom:20%;left:8%;right:5%;transform:rotateX(7deg)rotateY(13deg)rotate(-5deg)}.pd-panels{transform-style:preserve-3d}.pd-code,.pd-panel{border-radius:6px;position:relative;overflow:hidden}.pd-code{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:linear-gradient(135deg,#ffffff1f,#ffffff05),#0c0d1cc2;border:1px solid #ffffff52;width:38%;height:64%;position:absolute;bottom:20%;left:50%;transform:translateZ(-30px);box-shadow:0 22px 54px #08122066,inset 0 0 30px #67e8f91f}.pd-window-bar{border-bottom:1px solid #ffffff1f;flex-shrink:0;align-items:center;gap:.4em;height:2.4em;padding:0 .7em;display:flex}.pd-window-bar span{background:#ffffff7a;border-radius:50%;width:.5em;height:.5em}.pd-window-bar em{font-family:var(--font-mono), monospace;letter-spacing:.14em;color:#ffffff75;margin-left:auto;font-size:.72em;font-style:normal}.pd-window-close{color:#ffffff6b;flex-shrink:0}.pd-code-body{height:calc(100% - 2.4em);display:flex}.pd-file-tree{border-right:1px solid #ffffff1a;flex:0 0 40%;padding:.5em 0;overflow:hidden}.pd-file-row{font-family:var(--font-mono), monospace;color:#ffffff80;white-space:nowrap;align-items:center;gap:.4em;padding-top:.34em;padding-bottom:.34em;padding-right:.5em;font-size:.66em;display:flex}.pd-file-row[data-active]{color:#ffffffeb;background:#ffffff1a}.pd-folder,.pd-file{flex-shrink:0;display:inline-block}.pd-folder{border-top:.3em solid #0000;border-bottom:.3em solid #0000;border-left:.36em solid #fff6;width:0;height:0}.pd-file{border:1px solid #fff6;width:.4em;height:.5em}.pd-code-lines{font-family:var(--font-mono), monospace;color:#ffffffb3;flex:1;padding:.6em .7em;font-size:.68em;line-height:1.9;overflow:hidden}.pd-code-lines p{opacity:0;animation:10s infinite pdCode;animation-delay:calc(var(--i) * .14s);white-space:nowrap;transform:translate(-8px)}.pd-code-lines small{color:#67e8f966;margin-right:.7em}.pd-code-lines .kw{color:#67e8f9e6}.pd-code-lines .str{color:#f4c77ad9}.pd-code-lines .fn{color:#e2e8fff2}.pd-stream{width:16%;height:14%;position:absolute;bottom:4%;left:28%;overflow:visible}.pd-stream path{fill:none;stroke:#67e8f938;stroke-width:1.4px}.pd-stream .hot{stroke:#fffffff5;stroke-width:2.2px;stroke-linecap:round;stroke-dasharray:46 200;filter:drop-shadow(0 0 7px #67e8f9bf);animation:10s infinite pdFlow}.pd-stream-b{width:20%;height:12%;animation-delay:.6s;bottom:8%;left:10%}.pd-stream-b .hot{filter:drop-shadow(0 0 7px #f4c77ab3)}.pd-panel{color:#1e1a14d6;height:42%;transform:translateZ(calc((4 - var(--i)) * 18px));animation:10s infinite pdPanel;animation-delay:calc(var(--i) * 1.15s + .4s);background:linear-gradient(135deg,#fffffffa,#f0ecfae6);border:1px solid #ffffffb3;flex:1 1 0;padding:.65em .7em;font-size:max(8px,min(8cqw,13px));box-shadow:0 18px 40px #2d1d5433,inset 0 0 0 1px #ffffff80;container-type:inline-size}.pd-panel-head{opacity:.9;font-family:var(--font-mono), monospace;border-bottom:1px solid;align-items:baseline;gap:.6em;padding-bottom:.5em;display:flex}.pd-panel-head span{opacity:.85;font-size:1.15em}.pd-panel-head strong{white-space:nowrap;text-overflow:ellipsis;letter-spacing:.12em;font-size:.68em;overflow:hidden}.pd-panel-status{gap:.35em;margin-top:.55em;display:flex}.pd-panel-status i{opacity:.3;background:currentColor;border-radius:1px;width:.9em;height:.22em}.pd-panel-status i:first-child{opacity:.6}.pd-sketch,.pd-proto,.pd-flow,.pd-ui,.pd-shipped{flex-direction:column;height:calc(100% - 3.4em);margin-top:.5em;display:flex;position:relative}.pd-tag{letter-spacing:.04em;border-radius:1em;align-self:flex-start;margin-top:auto;padding:.22em .6em;font-size:.62em;font-weight:600}.pd-tag-sketch{color:#475569;background:#64748b24}.pd-tag-proto{color:#0f766e;background:#14b8a629}.pd-sketch-canvas{color:#64748b;background:#64748b0f;border:1px dashed #64748b66;border-radius:5px;flex:1;justify-content:center;align-items:center;min-height:0;display:flex}.pd-sketch-line{opacity:.28;background:currentColor;border-radius:1px;width:55%;height:.4em;margin-top:.5em}.pd-sketch-line.wide{opacity:.4;width:75%;margin-top:.6em}.pd-proto-head{align-items:center;gap:.5em;display:flex}.pd-proto-dot{background:#14b8a6;border-radius:50%;flex-shrink:0;width:.6em;height:.6em;box-shadow:0 0 6px #14b8a6b3}.pd-proto-title{opacity:.35;background:currentColor;border-radius:1px;flex:1;height:.42em}.pd-proto-box{color:#14b8a6;flex:1;justify-content:center;align-items:center;min-height:0;margin-top:.5em;display:flex}.pd-proto-box svg{opacity:.9;width:46%;height:46%}.pd-flow{justify-content:center;align-items:center}.pd-flow svg{width:100%;height:100%;overflow:visible}.pd-flow-node{fill:#ffffffe6;stroke:currentColor;stroke-width:2.2px;opacity:.6}.pd-flow-node-active{fill:#7c3aed24;stroke:#7c3aed;opacity:1}.pd-flow-line{fill:none;stroke:#7c3aed;stroke-width:2px;stroke-linecap:round;opacity:.65}#pdFlowArrow path{fill:#7c3aed}.pd-ui-bar{opacity:.7;border-bottom:1px solid;gap:.3em;padding-bottom:.5em;display:flex}.pd-ui-dot{border-radius:50%;width:.42em;height:.42em}.pd-ui-dot-a{background:#fb7185}.pd-ui-dot-b{background:#fbbf24}.pd-ui-dot-c{background:#34d399}.pd-ui-body{flex-direction:column;flex:1;gap:.45em;margin-top:.65em;display:flex}.pd-ui-line{opacity:.24;background:currentColor;border-radius:1px;width:100%;height:.4em}.pd-ui-line.wide{opacity:.4;width:85%}.pd-ui-line.short{width:40%}.pd-ui-btn{color:#40260a;background:#f4c77a;border-radius:1em;align-self:flex-start;margin-top:auto;padding:.3em .85em;font-size:.65em;font-weight:600}.pd-mini-chart{width:100%}.pd-mini-chart path{fill:none;stroke:currentColor;stroke-width:2.4px;stroke-linecap:round;opacity:.7}.pd-shipped-row{justify-content:space-between;align-items:baseline;display:flex;overflow:hidden}.pd-shipped-row strong,.pd-shipped-row small{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.pd-shipped-row strong{font-size:1.35em;font-weight:500}.pd-shipped-row small{opacity:.55;font-size:.72em}.pd-shipped-viz{flex:1;min-height:0;margin-top:.5em;position:relative}.pd-shipped-viz .pd-mini-chart path{stroke:#6d5bd0}.pd-donut{background:conic-gradient(#6d5bd0 0turn,#6d5bd0 .62turn,#6d5bd033 0turn);border-radius:50%;width:2.1em;height:2.1em;position:absolute;bottom:-.1em;right:0}.pd-donut:after{content:"";background:#fffffff5;border-radius:50%;position:absolute;top:22%;bottom:22%;left:22%;right:22%}.pd-shipped-legend{opacity:.75;margin-top:.5em;font-size:.68em}.pd-shipped-legend div{align-items:center;gap:.4em;margin-top:.3em;display:flex}.pd-shipped-legend b{margin-left:auto;font-weight:600}.pd-shipped-legend .dot{border-radius:50%;width:.5em;height:.5em}.pd-shipped-legend .dot-a{background:#6d5bd0}.pd-shipped-legend .dot-b{background:#f4c77a}.pd-track{transform-style:preserve-3d;transform:translateZ(10px)rotateX(58deg)}.pd-track-top{display:none}.pd-track-face{background:#05080ee6;border:1px solid #ffffff24;border-top:0;justify-content:space-around;align-items:center;display:flex;position:absolute;top:46%;bottom:0;left:1%;right:1%}.pd-track-face span{width:1.6em;height:.9em;animation:4s infinite pdArrow;animation-delay:calc(var(--i) * .16s);border-bottom:2px solid #ffffffb8;border-right:2px solid #ffffffb8;transform:skew(-24deg)}.pd-track-glow{background:linear-gradient(90deg,#0000,#fffffff2 45%,#f4c77af2 90%,#0000);height:2px;animation:4s infinite pdRail;position:absolute;bottom:20%;left:2%;right:2%;box-shadow:0 0 16px #67e8f999}.pd-track-badge{color:#fff6e1f2;background:#0c0d1cd9;border:1px solid #fff6e1b3;border-radius:.5em;justify-content:center;align-items:center;width:2.2em;height:2.2em;display:flex;position:absolute;top:-85%;right:2%;transform:rotateX(-58deg)translateZ(6px);box-shadow:0 0 16px #fff6e166}@keyframes pdCode{0%,6%{opacity:0;transform:translate(-8px)}14%,88%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(4px)}}@keyframes pdFlow{0%{stroke-dashoffset:220px;opacity:0}18%,82%{stroke-dashoffset:0;opacity:1}to{stroke-dashoffset:-180px;opacity:0}}@keyframes pdPanel{0%,8%{opacity:.4}16%,30%{opacity:1;transform:translateZ(calc((4 - var(--i)) * 18px + 14px));box-shadow:0 26px 60px #2d1d5447,inset 0 0 0 1px #7c3aed4d}46%,to{opacity:.78}}@keyframes pdArrow{0%,to{opacity:.22;transform:translate(-6px)skew(-24deg)}50%{opacity:.9;transform:translate(6px)skew(-24deg)}}@keyframes pdRail{0%{opacity:.22;transform:translate(-36%)scaleX(.3)}62%{opacity:1;transform:translate(24%)scaleX(1)}to{opacity:.22;transform:translate(46%)scaleX(.24)}}@container (max-width:640px){.pd-code,.pd-stream{display:none}.pd-panels{gap:2.4%}}
