.guide-dialog{width:min(1000px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 40px);margin:auto;padding:0;border:1px solid #ded9ec;border-radius:18px;background:#fff;color:#252933;box-shadow:0 26px 120px #21193440;overflow:hidden}
.guide-dialog::backdrop{background:#25203966;backdrop-filter:blur(5px)}
.guide-shell{display:flex;flex-direction:column;max-height:calc(100dvh - 40px)}
.guide-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-shrink:0;padding:19px 24px;border-bottom:1px solid #ece9f2}
.guide-header-label{display:flex;align-items:center;gap:11px;font-size:14px}
.guide-mark{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#6553b7;color:#fff;font-size:16px;font-weight:650;letter-spacing:-1px}
.guide-badge{display:inline-flex;align-items:center;width:fit-content;border-radius:5px;padding:3px 7px;background:#f0ecfa;color:#7862a1;font-size:10px;font-weight:500;line-height:1.5}
.guide-demo-badge{background:#f6f3eb;color:#96815c;font-size:10px;letter-spacing:.5px}
.guide-close{width:32px;height:32px;display:grid;place-items:center;padding:0;border-radius:8px;color:#8c839e;font-size:25px;line-height:1}
.guide-close:hover{background:#f3f0fa;color:#6553b7}
.guide-content{display:grid;grid-template-columns:minmax(230px,.9fr) minmax(0,1.45fr);gap:30px;padding:32px;overflow:auto;min-height:0}
.guide-intro{padding:9px 0 2px;display:flex;flex-direction:column;align-items:flex-start}
.guide-eyebrow{font-size:11px;color:#9a8eb0;letter-spacing:1px;margin:0 0 15px}
.guide-intro h2{font-size:25px;letter-spacing:-.5px;line-height:1.5;font-weight:630;outline:none;margin:0 0 16px;color:#332a48}
.guide-description{font-size:13px;line-height:1.95;color:#6f657e;margin:0}
.guide-tip{font-size:12px;line-height:1.9;color:#766584;margin:22px 0 24px;padding:12px 14px;background:#f8f6fc;border-left:2px solid #cbbfe9;border-radius:0 7px 7px 0}
.guide-step-nav{display:flex;align-items:center;gap:9px;margin-top:auto;padding-top:10px}
.guide-step{width:27px;height:27px;border:1px solid #e7e1f0;border-radius:50%;font-size:11px;color:#a397b4;padding:0;background:white}
.guide-step:hover{background:#f5f2fa;color:#6553b7}
.guide-step.guide-active{background:#6553b7;color:white;border-color:#6553b7}
.guide-stage-wrap{border:1px solid #e4deee;border-radius:12px;overflow:hidden;background:#faf9fd;display:flex;flex-direction:column;min-width:0;min-height:415px}
.guide-stage-toolbar{display:flex;align-items:center;gap:13px;padding:11px 15px;background:#fff;border-bottom:1px solid #e9e4f0;color:#a099ad;font-size:10px;flex-shrink:0}
.guide-window-dots{color:#ddd5e9;font-size:9px;letter-spacing:3px}
.guide-stage{padding:21px 20px 10px;flex:1;min-width:0}
.guide-demo-kicker{color:#9a8fa9;font-size:11px;line-height:1.8;margin:0 0 20px;text-align:center}
.guide-live{margin:0;padding:15px 20px 18px;font-size:11px;line-height:1.9;color:#74677f;min-height:68px}
.guide-demo-button{border:1px solid #e4deee;border-radius:7px;background:#fff;color:#827390;font-size:11px;line-height:1.6;padding:8px 11px;text-align:center;transition:background .12s,border-color .12s}
.guide-demo-button:hover{border-color:#b9aad7;background:#f7f4fc}
.guide-demo-button.guide-demo-primary{background:#ede8f8;border-color:#d9cfee;color:#69508d;font-weight:550}
.guide-demo-button.guide-demo-primary:hover{background:#e6ddf4;border-color:#c3b2de}
.guide-tree{position:relative;padding-top:7px}
.guide-tree-children{display:grid;grid-template-columns:1fr 1fr;gap:12px;position:relative;z-index:1}
.guide-version{display:block;text-align:left;padding:13px 12px;border:1px solid #e6e0ee;border-radius:9px;background:#fff;width:100%;box-shadow:0 3px 10px #35244d05;min-width:0}
.guide-version.guide-selected{border-color:#aa95cf;box-shadow:0 0 0 3px #6553b710}
.guide-version-heading{display:flex;align-items:flex-start;gap:7px;color:#695d78}
.guide-version-heading strong{font-weight:560;font-size:11px;line-height:1.65}
.guide-dot{display:inline-block;width:7px;height:7px;margin-top:5px;border-radius:50%;background:#9aa2af;box-shadow:0 0 0 3px #9aa2af13;flex-shrink:0}
.guide-dot.ready{background:#2eac7a;box-shadow:0 0 0 3px #2eac7a13}
.guide-dot.working{background:#dbad36;box-shadow:0 0 0 3px #dbad3616}
.guide-version-meta{display:block;font-size:9px;color:#aaa0b5;margin:9px 0 7px 14px;line-height:1.5}
.guide-version .guide-badge{margin-left:14px;font-size:9px}
.guide-tree-lines{position:relative;width:50%;height:37px;border:1px solid #c9bfda;border-top:0;border-radius:0 0 10px 10px;margin:-1px auto 0}
.guide-tree-lines:after{content:"";position:absolute;left:50%;bottom:-22px;width:1px;height:21px;background:#c9bfda}
.guide-tree-root{width:65%;margin:20px auto 0;position:relative;z-index:1}
.guide-compose{background:#fff;border:1px solid #ddd4eb;border-radius:10px;box-shadow:0 4px 18px #55446c06;overflow:hidden}
.guide-compose-base{font-size:10px;color:#a18fae;padding:11px 14px;background:#fcfbfe;border-bottom:1px solid #eee8f5}
.guide-compose-text{font-size:13px;line-height:2.1;color:#756580;padding:18px 15px;min-height:127px}
.guide-attachment{display:inline-flex;font-size:11px;color:#84649d;white-space:nowrap;vertical-align:baseline;padding:0 6px;border-radius:5px;background:#f1eaf8;border:1px solid #e5d8ee;margin:0 3px}
.guide-attachment-empty{color:#b6a6c2;font-size:11px}
.guide-compose-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;border-top:1px solid #f0eaf5;padding:10px 12px}
.guide-compose-tools .guide-demo-button{padding:6px 8px;font-size:10px}
.guide-attachment-preview{display:flex;align-items:center;gap:12px;margin-top:12px;color:#a392b3;font-size:10px;line-height:1.8}
.guide-attachment-picture{display:flex;flex-direction:column;gap:5px;align-items:flex-start;border:1px solid #e9e1f0;background:#fff;padding:10px;width:120px;flex-shrink:0;color:#71617d;font-size:8px;border-radius:6px}
.guide-attachment-picture .guide-sample-cta{font-size:7px;padding:3px 6px;min-width:0}
.guide-progress{list-style:none;margin:10px 0 20px;padding:0}
.guide-progress li{display:flex;align-items:center;gap:12px;min-height:46px;position:relative;color:#b4aabc;font-size:12px;padding-bottom:12px}
.guide-progress li:last-child{padding-bottom:0;min-height:34px}
.guide-progress li:not(:last-child):before{content:"";position:absolute;left:12px;top:28px;width:1px;height:18px;background:#e8e2ef}
.guide-progress-icon{width:25px;height:25px;border:1px solid #e6dfef;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:10px;flex-shrink:0}
.guide-progress li.guide-done{color:#8c7c9e}
.guide-progress li.guide-done .guide-progress-icon{background:#ebf6f0;border-color:#d6eadf;color:#599c7c}
.guide-progress li.guide-current{color:#786489;font-weight:550}
.guide-progress li.guide-current .guide-progress-icon{background:#f2edf9;border-color:#cec0e2;color:#80679c}
.guide-progress .guide-badge{margin-left:auto;font-size:9px}
.guide-yellow{background:#fbf4df;color:#aa924f}
.guide-green{background:#eaf6ef;color:#599275}
.guide-grey{background:#eef0f3;color:#8c95a3}
.guide-demo-actions{display:flex;justify-content:center;align-items:center;gap:9px;flex-wrap:wrap;margin-top:15px}
.guide-failure{background:#fbf5ee;border:1px solid #efdfca;border-radius:8px;padding:11px 13px;font-size:10px;color:#a1815d;line-height:1.9}
.guide-failure strong{font-weight:550;font-size:11px;display:block;margin-bottom:3px}
.guide-demo-tabs{display:flex;justify-content:center;gap:7px;margin-bottom:16px}
.guide-demo-tabs .guide-demo-button{padding:6px 17px}
.guide-demo-tabs .guide-demo-tab-active{background:#ede7f7;border-color:#ccbedf;color:#7d6199}
.guide-site{background:#fff;border:1px solid #e8e0f0;border-radius:9px;overflow:hidden;box-shadow:0 5px 20px #4c335908}
.guide-site-nav{display:flex;justify-content:space-between;align-items:center;padding:11px 13px;border-bottom:1px solid #f3edf8;font-size:8px;color:#aa9ab6;gap:8px}
.guide-site-nav strong{color:#7f678f;font-size:10px}
.guide-site-hero{padding:25px 15px 27px;text-align:center;background:linear-gradient(135deg,#fdfbff,#f7f2fc)}
.guide-site-eyebrow{font-size:8px;letter-spacing:1px;color:#b8a0c7}
.guide-site-hero h3{font-size:17px;line-height:1.6;color:#81618e;font-weight:550;margin:11px 0 7px}
.guide-site-hero p{font-size:9px;color:#aa91b8;line-height:1.8;margin-bottom:15px}
.guide-sample-cta{display:inline-flex;align-items:center;justify-content:center;min-width:94px;font-size:10px;padding:7px 16px;border-radius:6px;color:#fff;background:#9b7cb0;line-height:1.6}
.guide-fork-note{display:flex;gap:8px;align-items:flex-start;border-radius:7px;background:#f1edf8;padding:10px 12px;margin-top:12px;color:#9988aa;font-size:10px;line-height:1.8}
.guide-release-card{background:#fff;border:1px solid #e3dbea;border-radius:11px;padding:21px;max-width:350px;margin:auto}
.guide-release-heading{display:flex;align-items:center;gap:10px;font-size:13px;color:#7d658c;font-weight:550}
.guide-release-icon{display:grid;place-items:center;height:30px;width:30px;background:#f3edf8;color:#a183b5;border-radius:8px;font-size:18px}
.guide-release-version{display:flex;flex-direction:column;gap:5px;border:1px solid #eee7f3;background:#fdfbff;padding:12px;margin:16px 0;color:#a18bae;font-size:10px;border-radius:7px}
.guide-release-version strong{color:#8b729c;font-size:11px;font-weight:500}
.guide-release-steps{font-size:11px;line-height:1.8;color:#b3a3be;padding:0 3px;margin-bottom:15px}
.guide-release-steps>span{display:block;color:#d3c8dd;padding-left:6px;font-size:13px;margin:2px 0}
.guide-release-steps .guide-release-done{color:#7f6b90}
.guide-release-card>.guide-demo-button{width:100%;margin-top:3px}
.guide-release-message{font-size:10px;line-height:1.9;color:#a390b1;margin:9px 0}
.guide-release-success{display:flex;align-items:center;gap:8px;color:#7a9a88;font-size:11px;padding:8px 0}
.guide-release-success .guide-dot{margin:0}
.guide-release-success strong{font-weight:500}
.guide-footer{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:17px 24px;border-top:1px solid #ece9f2;background:#fff;flex-shrink:0}
.guide-footer-note{display:flex;align-items:center;gap:15px;flex-wrap:wrap;color:#a39aaf;font-size:10px;line-height:1.7}
.guide-skip{font-size:11px;color:#8b7c9d;padding:5px 0;text-decoration:underline;text-underline-offset:3px}
.guide-skip:hover{color:#6553b7}
.guide-controls{display:flex;gap:9px;flex-shrink:0}
.guide-control{border:1px solid #e4deee;background:#fff;color:#85798f;border-radius:8px;padding:9px 14px;font-size:12px;line-height:1.6;white-space:nowrap}
.guide-control:hover:not(:disabled){background:#f6f2fb;border-color:#c5b7da}
.guide-control.guide-primary{background:#6553b7;border-color:#6553b7;color:#fff}
.guide-control.guide-primary:hover:not(:disabled){background:#504195;border-color:#504195}
.guide-control:disabled{color:#b6afbf;opacity:.65}
.guide-dialog button:focus-visible{outline:3px solid #b2a0d5;outline-offset:3px}
@media(max-width:760px){.guide-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:14px}.guide-shell{max-height:calc(100dvh - 24px)}.guide-header{padding:14px 18px}.guide-content{grid-template-columns:1fr;gap:19px;padding:22px}.guide-intro{padding:0}.guide-intro h2{font-size:23px;margin-bottom:10px}.guide-description{font-size:12px;line-height:1.9}.guide-eyebrow{margin-bottom:9px}.guide-tip{margin:14px 0 10px;padding:9px 12px;font-size:11px}.guide-step-nav{padding-top:4px;gap:8px}.guide-stage-wrap{min-height:360px}.guide-stage{padding:17px 16px 8px}.guide-live{padding:11px 16px 15px;min-height:57px}.guide-demo-kicker{margin-bottom:15px}.guide-footer{padding:13px 18px}.guide-footer-note{gap:4px;flex-direction:column;align-items:flex-start;font-size:9px}.guide-control{padding:8px 11px;font-size:11px}}
@media(max-width:400px){.guide-content{padding:18px 14px}.guide-header{padding:12px 14px}.guide-header-label{gap:8px;font-size:13px}.guide-intro h2{font-size:21px}.guide-version{padding:10px 9px}.guide-version-heading strong{font-size:10px}.guide-version-meta{font-size:8px;margin-left:0}.guide-version .guide-badge{margin-left:0}.guide-tree-children{gap:8px}.guide-tree-root{width:75%}.guide-footer{padding:12px 14px;gap:10px}.guide-footer-note>span{max-width:112px}.guide-controls{gap:5px}.guide-control{padding:8px 9px}.guide-site-hero h3{font-size:15px}}
@media(prefers-reduced-motion:reduce){.guide-demo-button{transition:none}.guide-dialog::backdrop{backdrop-filter:none}}