@keyframes modal-slide-in{0%{transform:translateX(100%)}to{transform:translateX(0)}}@keyframes modal-slide-out{0%{transform:translateX(0)}to{transform:translateX(100%)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.guide-modal-backdrop{inset:0;background:rgba(0,0,0,.35);z-index:9998;opacity:0;transition:opacity .25s ease;pointer-events:none;touch-action:none;&.is-visible{opacity:1;pointer-events:auto}}.guide-modal{z-index:9999;box-shadow:0 4px 8px rgba(0,0,0,.5);width:60%;overscroll-behavior:contain;transform:translateX(100%);will-change:transform;animation:modal-slide-out 1s cubic-bezier(.4,0,.2,1);border-top-left-radius:1rem;border-bottom-left-radius:1rem;touch-action:pan-y;&.is-open{transform:translateX(0);animation:modal-slide-in 1s cubic-bezier(.22,1,.36,1)}.guide-modal-header{.guide-modal-info{font-size:1.25rem;line-height:1.4;font-family:Open Sans;color:#0c2d78;.guide-modal-icon{width:20px}.guide-modal-description{font-size:1.125rem;line-height:1.35;color:#272727;font-weight:500}}.guide-modal-button{font-size:1rem;color:#45484c;font-family:Font Awesome\ 5 Pro;background:transparent;&:focus,&:hover{background:#f5f5f5}&:focus{border-color:rgba(255,122,0,.23)!important;box-shadow:0 0 0 .2rem rgba(255,122,0,.25);outline:none}}}.guide-modal-body{grid-template-columns:280px 1fr;.guide-modal-sidebar{background-color:#fff;border:1px solid #a4a7ae;max-height:calc(100vh - 80px);box-shadow:inset -1px 0 0 #e5e5e5,inset 0 8px 8px -8px rgba(0,0,0,.08),inset 0 -8px 8px -8px rgba(0,0,0,.08);scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#d1d3d7 transparent;&::-webkit-scrollbar{width:6px}&::-webkit-scrollbar-track{background:transparent}&::-webkit-scrollbar-thumb{background:#d1d3d7;border-radius:999px;border:2px solid transparent;background-clip:padding-box}&::-webkit-scrollbar-thumb:hover{background:#b6b8be}.guide-modal-sidebar-buttons-step{background:transparent;cursor:pointer;font-size:.8rem;color:#444;transition:background .15s ease,color .15s ease;margin-bottom:8px;&:focus,&:hover{background:#f0f0f0}&:focus{border-color:rgba(255,122,0,.23)!important;box-shadow:0 0 0 .2rem rgba(255,122,0,.25);outline:none}&.active{background:#ec7000;color:#fff;font-weight:800}svg{width:12px;height:12px;flex-shrink:0}span{flex:1 1;min-width:0}}:last-child .guide-modal-sidebar-buttons-step{margin-bottom:0}}.guide-modal-sidebar hr{display:block;border:0;height:1px;background:#e5e5e5;opacity:.6}.guide-modal-sidebar>div:last-child hr{display:none}.guide-modal-content{padding:10px 40px;line-height:1.6;font-size:.938rem;max-height:calc(100vh - 45px);scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#d1d3d7 transparent;&::-webkit-scrollbar{width:6px}&::-webkit-scrollbar-track{background:transparent}&::-webkit-scrollbar-thumb{background:#d1d3d7;border-radius:999px;border:2px solid transparent;background-clip:padding-box}&::-webkit-scrollbar-thumb:hover{background:#b6b8be}.tutorial-tip{background:#fff7ed;border-left:4px solid #ec7000;padding:12px 16px;border-radius:6px}.guide-modal-content-title{display:flex!important;font-size:1.2rem;font-weight:600;line-height:1.4;color:#0c2d78;background:#fff;z-index:4}.guide-image{.guide-image-figure{text-align:center;.guide-image-button{border:none;background:none;padding:0;cursor:zoom-in;.guide-image-button-image{width:100%;height:auto;border-radius:12px;transition:transform .3s ease;border:1px solid rgba(0,0,0,.06);box-shadow:0 2px 8px rgba(0,0,0,.04);&:hover{transform:scale(1.02)}}}.guide-image-description{font-size:.85rem;color:#6c757d;margin-top:8px}}.guide-lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .2s ease;.guide-lightbox-content{position:relative;max-width:90%;max-height:90%;.guide-lightbox-image{width:100%;height:auto;border-radius:12px;cursor:zoom-out}.guide-lightbox-close{position:absolute;top:-40px;right:0;background:#fff;border:none;font-size:20px;border-radius:50%;width:36px;height:36px;cursor:pointer}}}}}.guide-modal-footer,.guide-modal-mobile-nav{display:none}}@media(max-width:1399px){width:70%}@media (max-width:991px){width:100%;border-radius:0;display:flex;flex-direction:column;overflow:hidden;.guide-modal-header{position:relative;z-index:1}.guide-modal-body{display:flex!important;flex-direction:column!important;height:100%!important;flex:1 1;min-height:0;width:100%;overflow:hidden;.guide-modal-sidebar{display:none!important}.guide-modal-mobile-nav{display:flex!important;gap:8px;padding:12px 16px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;border-bottom:1px solid #eee;background:#fafafa;position:-webkit-sticky;position:sticky;top:0;z-index:2;flex-shrink:0;white-space:nowrap;width:100%;scroll-behavior:smooth;scrollbar-width:thin;scrollbar-color:#ccc transparent;&::-webkit-scrollbar{height:4px}&::-webkit-scrollbar-track{background:transparent}&::-webkit-scrollbar-thumb{background:#ccc;border-radius:2px}.tutorial-step{min-width:36px;height:36px;border-radius:50%;border:none;background:#eee;color:#444;font-size:1rem;font-weight:600;display:flex;align-items:center;justify-content:center;flex:0 0 auto;transition:transform .15s ease,box-shadow .15s ease}.tutorial-step.active{background:#ec7000;color:#fff;transform:scale(1.05);box-shadow:0 0 0 3px rgba(236,112,0,.2)}}.guide-modal-content-title{padding-top:12px;font-size:1.2rem;line-height:1.4}.guide-modal-content{font-size:1rem!important;flex:1 1;overflow-y:auto;padding:0 16px 60px!important;.guide-image{.guide-lightbox{position:fixed;z-index:100000;isolation:isolate;top:0;left:0;right:0;bottom:0;width:100vw;height:100vh;padding:2px;transform:none;.guide-lightbox-content{max-width:100%;max-height:100%;width:100%;height:100%;display:flex;align-items:center;justify-content:center;margin:0;padding:0;.guide-lightbox-image{width:100%;height:100%;object-fit:contain;border-radius:0}.guide-lightbox-close{top:20px;right:20px;background:hsla(0,0%,100%,.9);box-shadow:0 2px 8px rgba(0,0,0,.2);z-index:100001;position:fixed}}}}}.guide-modal-footer{display:flex!important;justify-content:space-between;position:fixed!important;bottom:0;left:0;right:0;background:transparent;padding:12px 16px;z-index:10000;.guide-modal-footer-button{background:#0c2d78!important;border-color:#0c2d78!important}}}}}