.docs-layout{display:flex;height:100%;background:#fff;border:1px solid #eee;border-radius:12px;overflow:hidden;margin:28px auto}.docs-layout__content{flex-grow:1;padding:20px;overflow-y:auto}@media (max-width:768px){.docs-layout{flex-direction:column;border-radius:8px}.docs-layout__content{padding:15px}}.tutorial-grid{border-radius:12px}.tutorial-grid__search{margin-bottom:20px;margin-left:auto;width:17.5rem;border:1px solid #ddd;padding:8px;display:flex;flex-wrap:nowrap;border-radius:8px;align-items:center}.tutorial-grid__search span{width:1.25rem;height:1.25rem}.tutorial-grid__search input{width:100%;margin-left:8px;font-family:Poppins;font-size:.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.tutorial-grid__search input::-moz-placeholder{color:var(--Text-Color-Base-Second,#68727d);font-family:Poppins;font-size:.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.tutorial-grid__search input::placeholder{color:var(--Text-Color-Base-Second,#68727d);font-family:Poppins;font-size:.875rem;font-style:normal;font-weight:400;line-height:1.25rem}.tutorial-grid__search input:focus{outline:none;border-color:#007bff}.tutorial-grid__list{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:16px}@media (max-width:1536px){.tutorial-grid__list{grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}}@media (max-width:480px){.tutorial-grid__search{width:auto}}.tutorial-card{display:flex;padding:var(--Main-System-8px,12px);align-items:flex-start;gap:var(--Main-System-8px,8px);flex:1 0 0;align-self:stretch;border-radius:var(--Main-System-8px,8px);border:1px solid var(--Stroke-Base,#eaebf0);background:var(--Surface-Base-Main,#fff)}.tutorial-card__icon{flex-shrink:0}.tutorial-card__content{display:flex;flex-direction:column;flex:1}.tutorial-card__header h3{color:var(--Text-Color-Base-Main,#252525);font-size:16px;font-weight:600}.tutorial-card__description,.tutorial-card__header h3{font-family:Poppins;font-style:normal;line-height:20px}.tutorial-card__description{padding-top:.1rem;margin-bottom:1rem;overflow:hidden;color:var(--Text-Color-Base-Second,#68727d);text-overflow:ellipsis;font-size:14px;font-weight:400;min-height:60px}.tutorial-card__footer,.tutorial-card__links{display:flex;justify-content:flex-end;margin-top:auto}.tutorial-card__icons{display:flex;gap:12px;cursor:pointer}.tutorial-card__links button{margin-right:12px;text-decoration:none;color:#2563eb;cursor:pointer}.download,.view{color:var(--Text-Color-Primary,#436aeb);font-family:Poppins;font-size:14px;font-style:normal;font-weight:600;line-height:20px}@media (max-width:600px){.tutorial-card{padding:12px}.tutorial-card__header h3{font-size:15px}.tutorial-card__description,.tutorial-card__links a{font-size:13px}}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:999;padding:10px}.modal{background:#fff;border-radius:12px;max-width:95%;max-height:90%;overflow-y:auto;box-shadow:0 4px 16px rgba(0,0,0,.15)}.modal__header{justify-content:space-between;display:flex;align-items:center;gap:.625rem;align-self:stretch;border-bottom:1px solid var(--Stroke-Base,#eaebf0)}.modal__content,.modal__header{padding:1rem 2rem}.modal__header h3{font-size:16px;font-weight:600;margin:0;color:#333}.modal__close{background:none;border:none;font-size:20px;cursor:pointer;color:#888}.modal__form{display:flex;flex-direction:column;gap:12px}.modal__form label{font-weight:500}.modal__form label,.modal__input{color:var(--Text-Color-Base-Main,#252525);font-family:Poppins;font-size:.875rem;font-style:normal;line-height:1.25rem}.modal__input{width:100%;padding:10px 14px;border:1px solid #ddd;border-radius:8px;border-radius:var(--Roundness-Round-Inside,.375rem);border:1px solid var(--Stroke-Base,#eaebf0);background:var(--Surface-Base-Main,#fff);box-shadow:0 1px 2px 0 rgba(16,24,40,.04);font-weight:400}.modal__error{font-family:Poppins;font-size:.775rem;font-style:normal;font-weight:300;line-height:1.25rem}.modal__input:focus{outline:none;border-color:#007bff}.modal__btn{margin-top:10px;padding:12px;background:#2a55ff;color:#fff;border:none;border-radius:8px;color:var(--Text-Color-On-Color,#fff);font-family:Poppins;font-size:1rem;font-style:normal;font-weight:600;line-height:1.375rem;cursor:pointer;transition:background .2s ease;border-radius:var(--Roundness-Full-Inside,8rem);background:var(--Surface-Primary-Main,#436aeb);box-shadow:0 1px 2px 0 rgba(16,24,40,.04)}.modal__btn:hover{background:#1f40cc}.modal__error{font-size:12px;color:red}@media (max-width:600px){.modal{width:100%!important;height:auto!important;border-radius:8px;padding:15px}.modal__header h3{font-size:15px}.modal__input{font-size:13px;padding:8px 12px}.modal__btn{font-size:13px;padding:10px}}.sidebar{display:flex;flex-direction:column;gap:12px;min-width:220px;padding:20px 10px;border-right:1px solid #eee;background:#fff;max-width:270px}.sidebar__tab{font-size:14px;padding:.75rem .6rem;border-radius:8px;cursor:pointer;transition:background .2s ease,color .2s ease;color:var(--Text-Color-Base-Main,#252525);font-family:Poppins;font-size:1rem;font-style:normal;font-weight:400;line-height:1.5rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.sidebar__tab:hover{background:#f5f5f5}.sidebar__tab.active{color:var(--Text-Color-Primary,#436aeb);font-family:Poppins;font-size:1rem;font-style:normal;font-weight:500;line-height:1.5rem;border-radius:var(--Main-System-0.5rem,.5rem);background:var(--Surface-Primary-Second,#e7ecfd)}@media (max-width:768px){.sidebar{flex-direction:row;overflow-x:auto;min-width:unset;padding:10px;border-right:none;border-bottom:1px solid #eee}.sidebar__tab{flex-shrink:0;font-size:13px;padding:8px 12px}}