@andreyshpigunov/x 0.3.89 → 0.4.0

package/assets/js/app.js

@@ -0,0 +1 @@
+function $parcel$export(e,t,i,s){Object.defineProperty(e,t,{get:i,set:s,enumerable:!0,configurable:!0})}var $parcel$global="u">typeof globalThis?globalThis:"u">typeof self?self:"u">typeof window?window:"u">typeof global?global:{},$parcel$modules={},$parcel$inits={},parcelRequire=$parcel$global.parcelRequirec3c2;null==parcelRequire&&((parcelRequire=function(e){if(e in $parcel$modules)return $parcel$modules[e].exports;if(e in $parcel$inits){var t=$parcel$inits[e];delete $parcel$inits[e];var i={id:e,exports:{}};return $parcel$modules[e]=i,t.call(i.exports,i,i.exports),i.exports}var s=Error("Cannot find module '"+e+"'");throw s.code="MODULE_NOT_FOUND",s}).register=function(e,t){$parcel$inits[e]=t},$parcel$global.parcelRequirec3c2=parcelRequire);var parcelRegister=parcelRequire.register;parcelRegister("ehsFN",function(module,exports){$parcel$export(module.exports,"lib",function(){return lib});let HAS_DOM=()=>"u">typeof document&&"u">typeof window;class Lib{constructor(){this.loadedScripts=new Set,HAS_DOM()&&this._elementRender()}_elementRender(){HAS_DOM()&&document.addEventListener("DOMContentLoaded",()=>{let elements=this.qsa("[x-render]");for(let i=0;i<elements.length;i++){let item=elements[i];try{let expression=item.getAttribute("x-render");if(expression){let value=eval(expression);this.render(item,value)}}catch(_){}}},{once:!0})}_escapeHtml(e){if(null==e)return"";let t=String(e);if(HAS_DOM()){let e=document.createElement("div");return e.textContent=t,e.innerHTML}return t.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}id(e){return HAS_DOM()?document.getElementById(e):null}qs(e,t=document){return e?HAS_DOM()?"string"==typeof e?t.querySelector(e):e instanceof Node?e:e instanceof NodeList?e.length?e[0]:null:Array.isArray(e)&&e.length?e[0]instanceof Node?e[0]:t.querySelector(e[0]):e===window?e:null:e instanceof Node?e:null:null}qsa(e,t=document){if(!e)return[];if(!HAS_DOM())return e instanceof Node?[e]:[];if("string"==typeof e)return Array.from(t.querySelectorAll(e));if(e instanceof NodeList)return Array.from(e);if(e instanceof Node)return[e];if(Array.isArray(e)&&e.length){let i=[];for(let s=0;s<e.length;s++){let n=e[s];n instanceof Node?i.push(n):n instanceof NodeList?i.push(...n):i.push(...t.querySelectorAll(n))}return i.flat()}return e===window?[e]:[]}async hide(e){await this.addClass(e,"hidden")}async show(e){await this.removeClass(e,"hidden")}async toggle(e){await this.toggleClass(e,"hidden")}async switch(e,t){t?await this.removeClass(e,"hidden"):await this.addClass(e,"hidden")}async addClass(e,t,i=0){let s=this.qsa(e),n=s.length;if(n){if(i>0){let e=t.replace(/--.*/,"")+"--ready";for(let t=0;t<n;t++)s[t].classList.add(e);await new Promise(e=>setTimeout(e,i))}for(let e=0;e<n;e++)s[e].classList.add(t)}}async removeClass(e,t,i=0){let s=this.qsa(e),n=s.length;if(n){for(let e=0;e<n;e++)s[e].classList.remove(t);if(i>0){await new Promise(e=>setTimeout(e,i));let e=t.replace(/--.*/,"")+"--ready";for(let t=0;t<n;t++)s[t].classList.remove(e)}}}async toggleClass(e,t,i=0){let s=this.qsa(e),n=s.length;for(let e=0;e<n;e++){let n=s[e];n.classList.contains(t)?await this.removeClass(n,t,i):await this.addClass(n,t,i)}}async switchClass(e,t,i,s=0){i?await this.addClass(e,t,s):await this.removeClass(e,t,s)}reload(){"u">typeof window&&location.reload()}reloadWithHash(e){"u">typeof window&&(location.hash=e,this.reload())}redirectTo(e){"u">typeof window&&(location.href=e)}updateURL(e,t){"u">typeof window&&(history.pushState?history.pushState(null,t,e):location.href=e)}random(e,t){return Math.floor(Math.random()*(t-e+1))+e}price(e){return parseFloat(e).toFixed(2).replace(/\d(?=(\d{3})+\.)/g,"$& ").replace(".00","")}number(e){let t=(e+"").split(".");return t[0]=t[0].replace(/(\d)(?=(\d{3})+(?!\d))/g,"$1 "),t.join(".")}numberDecline(e,t,i,s){if(e>10&&1===Math.floor(e%100/10))return s;switch(e%10){case 1:return t;case 2:case 3:case 4:return i;default:return s}}isEmail(e){return"string"==typeof e&&/^[^\s@]+@[^\s@]+\.[^\s@]{2,}$/.test(e.trim())}isValidJSON(e){if("string"!=typeof e)return!1;try{return JSON.parse(e),!0}catch{return!1}}isInteger(e){return Number.isInteger(Number(e))}isDouble(e){let t=Number(e);return!isNaN(t)&&"number"==typeof t}makeId(){return"id"+this.random(1e5,999999)}makePassword(e=8,t){e<1&&(e=8);let i="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#^$%^&*()-+:,.;_",s="";for(let t=0;t<e;t++)s+=i[Math.floor(Math.random()*i.length)];if(t){let e=this.qs(t);e&&"value"in e&&(e.value=s);return}return s}loadScript(e,t,i="async"){if(HAS_DOM()&&e&&"function"==typeof t){try{if("string"==typeof e&&e.startsWith("http")){let t=new URL(e,window.location.href);if("http:"!==t.protocol&&"https:"!==t.protocol)return}}catch(t){if(!e.startsWith("/")&&!e.startsWith("./")&&!e.startsWith("../"))return}if(this.loadedScripts.has(e))return void t();try{let s=document.createElement("script");s.onload=t,s.onerror=()=>this.loadedScripts.delete(e),s.src=e,i&&s.setAttribute(i,""),s.crossOrigin="anonymous",document.body.appendChild(s),this.loadedScripts.add(e)}catch(e){}}}deferred(e,t=1e4){let i;if("u"<typeof window)return;let s=["scroll","resize","click","keydown","mousemove","touchmove"],n=()=>{for(let e=0;e<s.length;e++)window.removeEventListener(s[e],n,{once:!0});"complete"===document.readyState?e():window.addEventListener("load",e,{once:!0}),clearTimeout(i)};i=setTimeout(n,t);for(let e=0;e<s.length;e++)window.addEventListener(s[e],n,{once:!0})}deffered(e,t=1e4){return this.deferred(e,t)}throttle(e,t,i={}){return this._throttle(e,t,i)}debounce(e,t,i={}){return this._debounce(e,t,i)}onAppear(e,t,i=null,s={}){if(!HAS_DOM()||"function"!=typeof t||!("IntersectionObserver"in window))return;let n=this.qsa(e),r=n.length;if(!r)return;let o=new IntersectionObserver((e,s)=>{for(let n=0;n<e.length;n++){let r=e[n];r.isIntersecting?(t(r.target),i||s.unobserve(r.target)):i&&i(r.target)}},{root:null,rootMargin:"200px",threshold:.1,...s});for(let e=0;e<r;e++)o.observe(n[e])}alertErrors(e){e&&("string"==typeof e?alert(e):alert(Object.values(e).join("\n")))}printErrors(e){return e?"string"==typeof e?`<div>${this._escapeHtml(e)}</div>`:Object.entries(e).map(([e,t])=>{let i=this._escapeHtml(String(e)),s=this._escapeHtml(String(t));return`<div class="error_${i}">${s}</div>`}).join("\n"):""}async render(e,t,i=null,s=!1){if(!e)return;let n=this.qsa(e),r=n.length;if(r)try{let e="function"==typeof t?await t():t,o=String(e||"");for(let e=0;e<r;e++){let t=n[e];if(s)if(null==i)t.textContent=o;else{let e=document.createTextNode(o);"beforebegin"===i?t.parentNode?.insertBefore(e,t):"afterbegin"===i?t.insertBefore(e,t.firstChild):"beforeend"===i?t.appendChild(e):"afterend"===i&&t.parentNode?.insertBefore(e,t.nextSibling)}else null==i?t.innerHTML=o:t.insertAdjacentHTML(i,o)}}catch(e){}}transitionsOn(e=0){HAS_DOM()&&setTimeout(()=>document.documentElement.classList.remove("noTransitions"),e)}transitionsOff(){HAS_DOM()&&document.documentElement.classList.add("noTransitions")}async sleep(e){return new Promise(t=>setTimeout(t,e))}_throttle(e,t,i={}){let s=null,n=null,r=null,o=0,{leading:l=!0,trailing:a=!0}=i,d=t=>{o=t,e.apply(r,n),n=r=null},c=function(...e){let i=Date.now();o||l||(o=i),n=e,r=this;let c=t-(i-o);c<=0||c>t?(s&&clearTimeout(s),s=null,d(i)):!s&&a&&(s=setTimeout(()=>{s=null,a&&n&&d(Date.now())},c))};return c.cancel=()=>{s&&clearTimeout(s),s=n=r=null,o=0},c}_debounce(e,t,i={}){let s=null,n=null,r=null,{leading:o=!1,trailing:l=!0}=i,a=()=>{e.apply(r,n),n=r=null},d=function(...e){n=e,r=this,s&&clearTimeout(s),o&&!s&&a(),s=setTimeout(()=>{s=null,l&&n&&a()},t)};return d.cancel=()=>{s&&clearTimeout(s),s=n=r=null},d}}let lib=new Lib});var $ehsFN=parcelRequire("ehsFN");class $fb3cb004b28f41eb$var$Modal{constructor(){this.modalLevel=0,this.lockCount=0,this.html=null,this._initialized=!1,this._clickHandler=null,this._keydownHandler=null}init(){"u">typeof document&&"u">typeof window&&(this._initialized&&this.destroy(),this.html=$ehsFN.lib.qs("html"),this._renderModalContents(),this._setupModalLinks(),this._setupGlobalListeners(),this._initialized=!0)}destroy(){"u">typeof document&&(this._clickHandler&&(document.removeEventListener("click",this._clickHandler),this._clickHandler=null),this._keydownHandler&&(document.removeEventListener("keydown",this._keydownHandler),this._keydownHandler=null),this.modalLevel=0,this.lockCount=0,this.html=null,this._initialized=!1)}_isValidId(e){return"string"==typeof e&&!!e&&/^[a-zA-Z0-9_-]+$/.test(e)}_escapeHtml(e){if(null==e)return"";let t=String(e);if("u">typeof document){let e=document.createElement("div");return e.textContent=t,e.innerHTML}return t.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}_renderModalContents(){let e=$ehsFN.lib.qsa("[x-modal]"),t=$ehsFN.lib.qs(".modal-here")||$ehsFN.lib.qs("body");if(t)for(let i=0;i<e.length;i++){let s=e[i],n=s.getAttribute("x-modal");if(!n||!this._isValidId(n)||$ehsFN.lib.qs("#"+n))continue;let r=s.getAttribute("class")||"",o=(s.getAttribute("data-window-class")||"").replace(/\s+/g," ").trim(),l=this._escapeHtml(o),a=s.innerHTML,d=document.createElement("div");d.id=n,d.className="modal "+r,d.innerHTML='<div class="modal-overlay"></div><div class="modal-outer"><div class="modal-inner"><div class="modal-window '+l+'">'+a+'<div class="modal-rail"><a role="button" class="modal-close"></a></div></div></div></div>',t.appendChild(d),s.remove()}}_setupModalLinks(){let e=$ehsFN.lib.qsa("[x-modal-open]");for(let t=0;t<e.length;t++){let i=e[t],s=i.getAttribute("x-modal-open");if(s&&this._isValidId(s)&&(i.addEventListener("click",e=>{e.preventDefault(),this.show(s)}),window.location.hash==="#"+s)){let e=$ehsFN.lib.qs("#"+s);e&&e.classList.contains("modal--hash")&&this.show(s)}}}_setupGlobalListeners(){this._clickHandler=e=>{if(!$ehsFN.lib.qs(".modal--active"))return;let t=e.target,i=t.classList&&t.classList.contains("modal-close"),s=!t.closest||!t.closest(".modal-window");if(!i&&!s)return;e.preventDefault();let n=t.closest(".modal"),r=n?n.getAttribute("id"):null;r&&this._isValidId(r)&&this.hide(r)},this._keydownHandler=e=>{if("Escape"!==e.key)return;let t=$ehsFN.lib.qsa(".modal--active"),i=t.length;if(!i)return;let s=t[i-1].getAttribute("id");s&&this._isValidId(s)&&(e.preventDefault(),this.hide(s))},document.addEventListener("click",this._clickHandler),document.addEventListener("keydown",this._keydownHandler)}async show(e){if("u"<typeof document||!e||"string"!=typeof e||!this._isValidId(e)||this.lockCount>0)return;if(this.isActive(e))return void await this.hide(e);let t=$ehsFN.lib.qs("#"+e);if(t){t.classList.contains("modal--uniq")&&await this.hideAll(),this.lockCount++;try{await $ehsFN.lib.addClass(t,"modal--ready"),await $ehsFN.lib.sleep(10),t.dispatchEvent(new CustomEvent("modal:ready")),t.classList.contains("modal--hash")&&history.replaceState(null,"","#"+e),this.html&&($ehsFN.lib.addClass(this.html,"modal--active"),$ehsFN.lib.addClass(this.html,e+"--active")),$ehsFN.lib.addClass("[x-modal-open="+e+"]","active"),this.modalLevel++,$ehsFN.lib.addClass(t,"modal--z"+this.modalLevel),await $ehsFN.lib.addClass(t,"modal--active");let i=$ehsFN.lib.qs(".modal-outer",t);i&&i.scrollTo(0,1),await $ehsFN.lib.sleep(200),t.dispatchEvent(new CustomEvent("modal:open"))}catch(e){}finally{this.lockCount--}}}async hide(e){if("u"<typeof document||!e||"string"!=typeof e||!this._isValidId(e)||this.lockCount>0)return;let t=$ehsFN.lib.qs("#"+e);if(t){this.lockCount++;try{t.classList.contains("modal--hash")&&window.location.hash==="#"+e&&history.replaceState(null,document.title,window.location.pathname+window.location.search),$ehsFN.lib.removeClass("[x-modal-open="+e+"]","active"),await $ehsFN.lib.removeClass(t,"modal--active",200),$ehsFN.lib.removeClass(t,"modal--z"+this.modalLevel),t.dispatchEvent(new CustomEvent("modal:close")),this.html&&$ehsFN.lib.removeClass(this.html,e+"--active"),this.modalLevel--,0===this.modalLevel&&this.html&&$ehsFN.lib.removeClass(this.html,"modal--active")}catch(e){}finally{this.lockCount--}}}async hideAll(){if("u"<typeof document)return;let e=$ehsFN.lib.qsa(".modal--active");for(let t=0;t<e.length;t++){let i=e[t].getAttribute("id");i&&await this.hide(i)}}isActive(e){if("u"<typeof document||!e||"string"!=typeof e||!this._isValidId(e))return!1;let t=$ehsFN.lib.qs("#"+e);return!!t&&t.classList.contains("modal--active")}}let $fb3cb004b28f41eb$export$96e4b36520c26a2c=new $fb3cb004b28f41eb$var$Modal;var $ehsFN=parcelRequire("ehsFN");class $014037f76a5c216c$var$Animate{constructor(){this._ticking=!1,this._animations=[],this._scroll=this._scroll.bind(this),this._scrollHandler=this._scrollHandler.bind(this),this._initialized=!1,this._parents=new Set,this._elements=null}init(){"u"<typeof window||(this._cleanup(),this._elements=$ehsFN.lib.qsa("[x-animate]"),!this._elements?.length||(this._parseElementsAnimations(),this._animations.length&&(this._setupListeners(),this._initialized=!0)))}_cleanup(){!this._initialized||"u">typeof window&&(this._parents.forEach(e=>{e.removeEventListener("scroll",this._scrollHandler)}),window.removeEventListener("resize",this._scrollHandler),this._ticking=!1,this._animations=[],this._parents=new Set,this._elements=null,this._initialized=!1)}destroy(){"u">typeof window&&this._cleanup()}_parseElementsAnimations(){for(let e of(this._animations=[],this._elements))try{let t=JSON.parse(e.getAttribute("x-animate"));this._animations.push({element:e,trigger:$ehsFN.lib.qs(t.trigger)||e,parent:$ehsFN.lib.qs(t.parent)||window,start:t.start,end:t.end||!1,class:t.class,classRemove:!1!==t.classRemove,functionName:t.functionName,fn:null,lockedIn:!1,lockedOut:!1,log:t.log||!1})}catch(t){console.error("Invalid JSON in x-animate attribute:",e,t)}}_setupListeners(){for(let e of this._animations)this._parents.has(e.parent)||(this._parents.add(e.parent),e.parent.addEventListener("scroll",this._scrollHandler));window.addEventListener("resize",this._scrollHandler);let e=()=>requestAnimationFrame(()=>this._scroll());"complete"===document.readyState?e():window.addEventListener("load",e,{once:!0})}_scrollHandler(){this._ticking||(this._ticking=!0,window.requestAnimationFrame(()=>{this._scroll(),this._ticking=!1}))}_scroll(){for(let e=0;e<this._animations.length;e++){let t=this._animations[e];if(!t.element.isConnected||!t.trigger.isConnected)continue;!t.fn&&t.functionName&&"function"==typeof window[t.functionName]&&(t.fn=window[t.functionName]);let i=t.trigger.getBoundingClientRect(),s=t.parent,n=s===window?0:s.getBoundingClientRect().top,r=i.top-n,o=this._2px(t.start,s),l=this._2px(t.end,s),a=!isNaN(o),d=!isNaN(l),c=t.fn;t.log&&console.log(r,o,l,t),a&&d?(t.duration=o-l,r<=o&&r>=l?(t.lockedOut=!1,t.class&&!t.element.classList.contains(t.class)&&t.element.classList.add(t.class),c&&(t.progress=((o-r)/t.duration).toFixed(4),c(t))):(t.class&&t.classRemove&&t.element.classList.contains(t.class)&&t.element.classList.remove(t.class),!t.lockedOut&&c&&(r>=o?(t.progress=0,c(t),t.lockedOut=!0):r<=l&&(t.progress=1,c(t),t.lockedOut=!0)))):a&&(r<=o?(t.lockedOut=!1,t.class&&!t.element.classList.contains(t.class)&&t.element.classList.add(t.class),!t.lockedIn&&c&&(t.progress=1,c(t),t.lockedIn=!0)):(t.lockedIn=!1,t.class&&t.classRemove&&t.element.classList.contains(t.class)&&t.element.classList.remove(t.class),!t.lockedOut&&c&&r>=o&&(t.progress=0,c(t),t.lockedOut=!0)))}}_2px(e,t=window){if("number"==typeof e)return e;if("string"!=typeof e)return NaN;let i=parseFloat(e);return/[%vh]/.test(e)?(e.includes("vh")||t===window?document.documentElement.clientHeight:t.clientHeight)*i/100:i}}let $014037f76a5c216c$export$e3607ec2d7a891c4=new $014037f76a5c216c$var$Animate;var $ehsFN=parcelRequire("ehsFN");class $eb3d55ecca7ee7d2$var$Appear{constructor(){this._targets=[],this._observer=null,this._options={appearedClass:"appeared",visibleClass:"visible",once:!1,root:null,rootMargin:"0px",threshold:0},this._observerCallback=this._observerCallback.bind(this)}init(e={}){if("u"<typeof window||!("IntersectionObserver"in window)||(this._options={...this._options,...e},this._observer&&(this._observer.disconnect(),this._observer=null),this._targets=$ehsFN.lib.qsa("[x-appear]"),!this._targets.length))return;let{root:t,rootMargin:i,threshold:s}=this._options;this._observer=new IntersectionObserver(this._observerCallback,{root:t||null,rootMargin:i,threshold:s});for(let e=0;e<this._targets.length;e++)this._observer.observe(this._targets[e])}destroy(){"u">typeof window&&(this._observer&&(this._observer.disconnect(),this._observer=null),this._targets=[])}_observerCallback(e){let{appearedClass:t,visibleClass:i,once:s}=this._options,n=this._observer;for(let r=0;r<e.length;r++){let o=e[r],l=o.target;o.isIntersecting?(t&&!l.classList.contains(t)&&(l.classList.add(t),s&&n&&n.unobserve(l)),i&&!l.classList.contains(i)&&(l.classList.add(i),l.dispatchEvent(new CustomEvent("visible",{detail:{appeared:!0}})))):i&&l.classList.contains(i)&&(l.classList.remove(i),l.dispatchEvent(new CustomEvent("invisible",{detail:{appeared:!0}})))}}}let $eb3d55ecca7ee7d2$export$fb1b4b0e602f43f1=new $eb3d55ecca7ee7d2$var$Appear;var $ehsFN=parcelRequire("ehsFN");class $45256965eb1aa1f4$var$Lazyload{constructor(){this._observer=null,this._options={root:null,rootMargin:"200px",threshold:.1}}init(){if("u"<typeof window||"u"<typeof document||!("IntersectionObserver"in window))return;this._observer||(this._observer=new IntersectionObserver(this._callback.bind(this),this._options));let e=$ehsFN.lib.qsa("[x-lazyload]");for(let t=0;t<e.length;t++){let i=e[t];i.classList.contains("loaded")||this._observer.observe(i)}}destroy(){"u">typeof window&&this._observer&&(this._observer.disconnect(),this._observer=null)}_callback(e){for(let t=0;t<e.length;t++){let i=e[t];i.isIntersecting&&i.target&&this._loadImage(i.target)}}_fetchImage(e,t){return new Promise((i,s)=>{if(!e&&!t)return void s(Error("lazyload: no src or srcset"));let n=new Image;n.onload=i,n.onerror=()=>s(Error("lazyload: load failed")),t&&(n.srcset=t),e&&(n.src=e)})}_loadImage(e){if(!e||"IMG"!==e.nodeName)return;let t=e.getAttribute("data-src"),i=e.getAttribute("data-srcset");if(!t&&!i){this._observer&&this._observer.unobserve(e);return}let s=this._observer;this._fetchImage(t||null,i||null).then(()=>{i&&(e.srcset=i,e.removeAttribute("data-srcset")),t&&(e.src=t,e.removeAttribute("data-src")),e.classList.add("loaded"),s&&s.unobserve(e)}).catch(()=>{s&&s.unobserve(e)})}}let $45256965eb1aa1f4$export$c3e8f8508bab224b=new $45256965eb1aa1f4$var$Lazyload;var $ehsFN=parcelRequire("ehsFN");class $c188f7d5f390f2f6$var$Loadmore{constructor(){this.items={},this.locked=!1,this.observer=null,this._initialized=!1}init(){if("u"<typeof window||"u"<typeof document)return;this._initialized&&this.destroy();let e=$ehsFN.lib.qsa("[x-loadmore]"),t=e.length;if(!t)return;let i=/^[a-zA-Z_$][a-zA-Z0-9_$.]*$/,s=async(e,t)=>{for(let s=0;s<e.length;s++){let n=e[s];if(n.isIntersecting&&!this.locked){this.locked=!0;try{let e,s=n.target;if(!s)continue;let r=s.getAttribute("x-loadmore");if(!r)continue;try{e=JSON.parse(r)}catch(e){continue}let o=e&&e.functionName;if("string"!=typeof o||!i.test(o))continue;let l=window[o];if("function"!=typeof l)continue;let a=s.id,d=a?this.items[a]:null;if(!d)continue;let c=d.page||1,h=await l(c);!0===h?d.page=c+1:!1===h&&t.unobserve(s)}catch(e){}finally{this.locked=!1}}}};if("IntersectionObserver"in window){this.observer=new IntersectionObserver(s,{rootMargin:"0px 0px 400px 0px",threshold:0});for(let i=0;i<t;i++){let t=e[i],s=$ehsFN.lib.makeId();s&&(t.setAttribute("id",s),this.items[s]={el:t,page:1},this.observer.observe(t))}this._initialized=!0}}destroy(){"u">typeof window&&(this.observer&&(this.observer.disconnect(),this.observer=null),this.items={},this.locked=!1,this._initialized=!1)}reset(e){if("u"<typeof document)return;let t=$ehsFN.lib.qs(e);if(!t||!t.id)return;let i=this.items[t.id];i&&(i.page=1)}}let $c188f7d5f390f2f6$export$6456520619f548d5=new $c188f7d5f390f2f6$var$Loadmore;var $ehsFN=parcelRequire("ehsFN");class $8f6aab8d3dab3eed$var$Sheets{constructor(){this._handlers=new Map,this._initialized=!1}_dispatchEvent(e,t,i={}){let s=new CustomEvent(`sheets:${t}`,{detail:i,bubbles:!0,cancelable:!1});e.dispatchEvent(s)}_isValidSheetValue(e){return"string"==typeof e&&!!e&&/^[a-zA-Z0-9_-]+$/.test(e)}init(){this._initialized&&this.destroy();let e=$ehsFN.lib.qsa("[x-sheets]");if(e.length){for(let t of e){if(!t)continue;for(let e of $ehsFN.lib.qsa("[x-sheet-open]:not([x-sheet-open] [x-sheet-open])",t)){if(!e)continue;let t=e.getAttribute("x-sheet-open");if(!t){console.warn("sheets.init: Tab has x-sheet-open attribute but no value",e);continue}if(!this._isValidSheetValue(t)){console.error("sheets.init: Invalid sheet value (security check failed):",t);continue}let i=e=>{e.preventDefault(),this.show(t)};e.addEventListener("click",i),this._handlers.set(e,i)}let e=$ehsFN.lib.qs("[x-sheet-open].active",t);if(e){let t=e.getAttribute("x-sheet-open");t&&this._isValidSheetValue(t)&&this.show(t)}this._dispatchEvent(t,"ready",{container:t,timestamp:Date.now(),initialized:!0})}this._initialized=!0}}destroy(){let e=new Set;for(let[t]of this._handlers.entries()){let i=t.closest("[x-sheets]");i&&e.add(i)}for(let[e,t]of this._handlers.entries())e.removeEventListener("click",t);for(let t of(this._handlers.clear(),this._initialized=!1,e))this._dispatchEvent(t,"destroy",{container:t,timestamp:Date.now(),wasInitialized:!0})}show(e,t={silent:!1,source:"api"}){if(!e||"string"!=typeof e)return void console.error("sheets.show: Sheet value is required and must be a string");if(!this._isValidSheetValue(e))return void console.error("sheets.show: Invalid sheet value (security check failed):",e);let i=CSS.escape(e),s=$ehsFN.lib.qs(`[x-sheet="${i}"]`);if(!s)return void console.warn("sheets.show: Target content not found:",e);let n=s.closest("[x-sheets]");if(!n)return void console.warn("sheets.show: Sheets container not found for:",e);let r=$ehsFN.lib.qs(`[x-sheet-open="${i}"]`,n);if(!r)return void console.warn("sheets.show: Tab not found:",e);if(r.classList.contains("active")&&s.classList.contains("active")){t.silent||this._dispatchEvent(n,"selected",{sheet:e,tab:r,content:s,container:n,previousSheet:e,previousTab:r,previousContent:s,wasActive:!0,source:t.source||"api",timestamp:Date.now()});return}let o=$ehsFN.lib.qs("[x-sheet-open].active",n),l=$ehsFN.lib.qs("[x-sheet].active",n),a=o?o.getAttribute("x-sheet-open"):null,d=$ehsFN.lib.qsa("[x-sheet-open]",n),c=$ehsFN.lib.qsa("[x-sheet]",n);for(let e of d)e&&e.classList.contains("active")&&e.classList.remove("active");for(let e of c)e&&e.classList.contains("active")&&e.classList.remove("active");r.classList.add("active"),s.classList.add("active"),t.silent||this._dispatchEvent(n,"selected",{sheet:e,tab:r,content:s,container:n,previousSheet:a,previousTab:o,previousContent:l,wasActive:!1,source:t.source||"api",timestamp:Date.now()})}}let $8f6aab8d3dab3eed$export$d1f2fc3a3d47c5af=new $8f6aab8d3dab3eed$var$Sheets;var $ehsFN=parcelRequire("ehsFN");class $3134c8ebb2c91188$var$Dropdown{constructor(){this._handlers=new Map,this._menus=new Map,this._parentToMenu=new Map,this._initialized=!1,this._globalClickHandler=null}init(){if(!("u"<typeof document)){for(let e of(this._initialized&&this._cleanup(),this._attachGlobalListeners(),$ehsFN.lib.qsa("[x-dropdown]"))){let t=e.parentElement;if(!t)continue;let i=$ehsFN.lib.qs("[x-dropdown-open]",t);i&&(this._setupAccessibility(t,i,e),this._bindTrigger(t,i),this._bindMenuKeys(e,i,t),this._menus.set(e,{parent:t,trigger:i}),this._parentToMenu.set(t,e),t.dispatchEvent(new CustomEvent("dropdown:ready")))}this._initialized=!0}}_setupAccessibility(e,t,i){e.classList.add("dropdown"),t.setAttribute("aria-expanded","false"),i.id||(i.id=$ehsFN.lib.makeId()),t.setAttribute("aria-controls",i.id),i.setAttribute("role","menu"),i.setAttribute("tabindex","-1");let s=i.querySelectorAll("li > a");for(let e=0;e<s.length;e++){let t=s[e];t.setAttribute("role","menuitem"),t.setAttribute("tabindex","-1")}}_bindTrigger(e,t){let i=$ehsFN.lib.throttle(()=>this._toggleDropdown(e,t),400),s=t.tagName,n="INPUT"===s||"TEXTAREA"===s,r=null,o=e=>{n||(e.stopPropagation(),i())},l=s=>{let{key:r}=s;if(" "!==r||!n){if(!n&&("Enter"===r||" "===r)){s.preventDefault(),i();return}if("ArrowDown"===r){s.preventDefault(),n||(this._open(e,t),this._focusFirstItem(e));return}"ArrowUp"===r&&(s.preventDefault(),n||(this._open(e,t),this._focusLastItem(e)))}},a=()=>{n?(r&&clearTimeout(r),this.closeAllDropdowns(),this._open(e,t)):t.classList.add("hover")},d=()=>{n?r=setTimeout(()=>this._close(e),200):t.classList.remove("hover")};this._handlers.set(t,{clickListener:o,keyListener:l,focusListener:a,blurListener:d,blurTimeout:r}),t.addEventListener("click",o),t.addEventListener("keydown",l),t.addEventListener("focus",a),t.addEventListener("blur",d)}_bindMenuKeys(e,t,i){let s=s=>{let n=e.querySelectorAll('[role="menuitem"]:not([disabled])'),r=n.length;if(!r)return;let o=-1,l=document.activeElement;for(let e=0;e<r;e++)if(n[e]===l){o=e;break}let a=s.key;if("ArrowDown"===a){s.preventDefault(),n[(o+1)%r].focus();return}if("ArrowUp"===a){s.preventDefault(),n[(o-1+r)%r].focus();return}if("Home"===a){s.preventDefault(),n[0].focus();return}if("End"===a){s.preventDefault(),n[r-1].focus();return}"Escape"===a&&(s.preventDefault(),this._close(i),t.focus())},n=e=>{e.target.matches('[role="menuitem"]')&&e.target.classList.add("hover")},r=e=>{e.target.matches('[role="menuitem"]')&&e.target.classList.remove("hover")};this._handlers.set(e,{keyListener:s,focusListener:n,blurListener:r}),e.addEventListener("keydown",s),e.addEventListener("focusin",n),e.addEventListener("focusout",r)}_cleanup(){this.closeAllDropdowns(),this._handlers.forEach((e,t)=>{e.clickListener&&t.removeEventListener("click",e.clickListener),e.keyListener&&t.removeEventListener("keydown",e.keyListener),e.focusListener&&(t.removeEventListener("focus",e.focusListener),t.removeEventListener("focusin",e.focusListener)),e.blurListener&&(t.removeEventListener("blur",e.blurListener),t.removeEventListener("focusout",e.blurListener)),e.blurTimeout&&clearTimeout(e.blurTimeout)}),this._handlers.clear(),this._menus.clear(),this._parentToMenu.clear(),$3134c8ebb2c91188$var$Dropdown._globalListenersAttached&&this._globalClickHandler&&(document.removeEventListener("click",this._globalClickHandler),$3134c8ebb2c91188$var$Dropdown._globalListenersAttached=!1)}_toggleDropdown(e,t){let i=e.classList.contains("dropdown--open");this.closeAllDropdowns(),i||this._open(e,t)}async _open(e,t){let i=this._parentToMenu.get(e);i&&(this._fireEvent(e,"beforeshow"),this._adjustPosition(e,i),$ehsFN.lib.addClass(t,"active"),$ehsFN.lib.addClass(e,"dropdown--open",20),t.setAttribute("aria-expanded","true"),this._fireEvent(e,"aftershow"))}_adjustPosition(e,t){e.classList.add("dropdown--ready");let i=t.getBoundingClientRect();e.classList.remove("dropdown--ready");let s=window.innerWidth,n=document.documentElement.scrollHeight;e.classList.remove("dropdown--right","dropdown--bottom"),i.right>s&&e.classList.add("dropdown--right"),window.scrollY+i.bottom>n&&e.classList.add("dropdown--bottom")}_focusFirstItem(e){let t=this._parentToMenu.get(e);if(!t)return;let i=t.querySelector('[role="menuitem"]:not([disabled])');i&&i.focus()}_focusLastItem(e){let t=this._parentToMenu.get(e);if(!t)return;let i=t.querySelectorAll('[role="menuitem"]:not([disabled])');i.length&&i[i.length-1].focus()}closeAllDropdowns(){if(document.querySelector(".dropdown--open"))for(let e of $ehsFN.lib.qsa(".dropdown--open"))this._close(e)}async _close(e){if(e._dropdownClosing)return;e._dropdownClosing=!0,this._fireEvent(e,"beforehide");let t=$ehsFN.lib.qs("[x-dropdown-open]",e);t&&($ehsFN.lib.removeClass(t,"active"),t.setAttribute("aria-expanded","false")),await $ehsFN.lib.removeClass(e,"dropdown--open",200),e.classList.remove("dropdown--right","dropdown--bottom"),this._fireEvent(e,"afterhide"),setTimeout(()=>{e._dropdownClosing=!1},100)}_fireEvent(e,t){e.dispatchEvent(new CustomEvent(`dropdown:${t}`))}_attachGlobalListeners(){$3134c8ebb2c91188$var$Dropdown._globalListenersAttached||(this._globalClickHandler=e=>{e.target.closest("[x-dropdown-open]")||e.target.closest("[x-dropdown] .dropdown--stay")||document.querySelector(".dropdown--open")&&this.closeAllDropdowns()},document.addEventListener("click",this._globalClickHandler),$3134c8ebb2c91188$var$Dropdown._globalListenersAttached=!0)}destroy(){"u">typeof document&&this._initialized&&(this._cleanup(),this._initialized=!1)}}$3134c8ebb2c91188$var$Dropdown._globalListenersAttached=!1;let $3134c8ebb2c91188$export$81207e5cc4186890=new $3134c8ebb2c91188$var$Dropdown;var $ehsFN=parcelRequire("ehsFN");class $fa742adec1b07386$var$Autocomplete{emptyStateHtml='<li><span class="op4">Ничего не найдено</span></li>';defaultStateHtml='<li><span class="op4">Начните печатать</span></li>';loadingStateHtml='<li><span class="op4">Загрузка...</span></li>';constructor(){this._clicked=!1,this._currentLoadId=0,this._loadData=this._loadData.bind(this),this._keyHandler=this._keyHandler.bind(this),this._clickHandler=this._clickHandler.bind(this),this._hideHandler=this._hideHandler.bind(this)}init(e,t={}){"u"<typeof window||!e||"string"!=typeof e||(this.emptyStateHtml=t.emptyStateHtml??this.emptyStateHtml,this.defaultStateHtml=t.defaultStateHtml??this.defaultStateHtml,this.loadingStateHtml=t.loadingStateHtml??this.loadingStateHtml,this.dropdown=$ehsFN.lib.id(e),!this.dropdown||(this.field=$ehsFN.lib.qs("[x-dropdown-open]",this.dropdown),this.list=$ehsFN.lib.qs("[x-dropdown]",this.dropdown),this.field&&this.list&&(this.data=t.data??null,this.loadData=t.loadData??null,this.mapData=t.mapData??null,this.renderItem=t.renderItem??null,this.onSelect=t.onSelect??null,this.resetFunc=t.resetFunc??null,this.debouncedLoadData=$ehsFN.lib.debounce(this._loadData,400),this.field.value.trim()?this._defaultState():this._reset(),this.field.addEventListener("focus",this.debouncedLoadData),this.field.addEventListener("input",this.debouncedLoadData),this.field.addEventListener("keydown",this._keyHandler),this.list.addEventListener("click",this._clickHandler),this.dropdown.addEventListener("dropdown:afterhide",this._hideHandler))))}destroy(){"u"<typeof window||this.field&&this.list&&this.dropdown&&(this._reset(),this.field.removeEventListener("focus",this.debouncedLoadData),this.field.removeEventListener("input",this.debouncedLoadData),this.field.removeEventListener("keydown",this._keyHandler),this.list.removeEventListener("click",this._clickHandler),this.dropdown.removeEventListener("dropdown:afterhide",this._hideHandler))}_keyHandler(e){"Enter"===e.key&&(e.preventDefault(),this.field?.blur())}_clickHandler(e){if(this._clicked)return;this._clicked=!0;let t=e.target.closest("[data-item]");if(!t||!this.onSelect)return void setTimeout(()=>{this._clicked=!1},0);try{let e=JSON.parse(t.dataset.item);this.onSelect(e)}catch(e){console.error("Autocomplete: error parsing data-item JSON",e)}setTimeout(()=>{this._clicked=!1},0)}_hideHandler(){if(this._clicked){this._clicked=!1;return}this.data?.length&&this.onSelect?(this._loadingState(),this.onSelect(this.data[0])):this._reset()}_loadingState(){$ehsFN.lib.render(this.list,this.loadingStateHtml)}_emptyState(){$ehsFN.lib.render(this.list,this.emptyStateHtml)}_defaultState(){$ehsFN.lib.render(this.list,this.defaultStateHtml)}_reset(){this.resetFunc&&this.resetFunc(),this.data=null,this._defaultState()}async _loadData(){if(!this.field||!this.field.value.trim())return void this._reset();if(!this.loadData)return void this._defaultState();this._loadingState();let e=Date.now();this._currentLoadId=e;try{let t=await this.loadData(this);if(e!==this._currentLoadId)return;this.data=this.mapData?this.mapData(t):t,this.render()}catch(t){e===this._currentLoadId&&this._reset(),console.error("Autocomplete: load error",t)}}render(){if(!this.data)return void this._reset();if(!this.data.length)return void this._emptyState();if(!this.renderItem)return void this._defaultState();let e=this.data.map(this.renderItem).join("");$ehsFN.lib.render(this.list,e)}}let $fa742adec1b07386$export$485ded5f26ebe08d=new $fa742adec1b07386$var$Autocomplete;var $ehsFN=parcelRequire("ehsFN");class $ef55f167e58e504d$var$Scroll{constructor(){this.parent=window,this.offset=0,this.classActive="active",this.hash=!1,this.to=this.scrollTo,this._linksHash={},this._scrollHandlers=new Map,this._initialized=!1}_isValidSelector(e){return!("string"!=typeof e||!e||/<script|javascript:/i.test(e))&&/^[#.a-zA-Z0-9_\-\[\]="':\s>+~,()]+$/.test(e)}init(){this._initialized&&this.destroy();let e=$ehsFN.lib.qsa("[x-scrollto]");if(e.length){for(let t of(this._linksHash={},e))if(t)try{let e=t.getAttribute("x-scrollto");if(!e){console.warn("scroll.init: Link has x-scrollto attribute but no value",t);continue}let i={};if($ehsFN.lib.isValidJSON(e)){let s=JSON.parse(e);if(!s||"object"!=typeof s){console.error("scroll.init: Invalid JSON object:",s);continue}let n=s.target;if(!n){console.error("scroll.init: Target required in JSON:",s);continue}if("string"!=typeof n||!this._isValidSelector(n)){console.error("scroll.init: Invalid or unsafe selector:",n);continue}let r=$ehsFN.lib.qs(n);if(!r){console.error("scroll.init: Target element not found:",n);continue}i.link=t,i.target=r,i.offset="number"==typeof s.offset?s.offset:this.offset,i.classActive=s.classActive||this.classActive,i.hash=s.hash??this.hash,s.parent?"string"==typeof s.parent?this._isValidSelector(s.parent)?i.parent=$ehsFN.lib.qs(s.parent)||this.parent:(console.error("scroll.init: Invalid parent selector:",s.parent),i.parent=this.parent):s.parent instanceof HTMLElement||s.parent===window?i.parent=s.parent:i.parent=this.parent:i.parent=this.parent}else{if(!this._isValidSelector(e)){console.error("scroll.init: Invalid or unsafe selector:",e);continue}let s=$ehsFN.lib.qs(e);if(!s){console.error("scroll.init: Target not found:",e);continue}i.link=t,i.parent=this.parent,i.target=s,i.offset=this.offset,i.classActive=this.classActive,i.hash=this.hash}if(i.link&&i.target){let e=$ehsFN.lib.makeId();if(!e){console.error("scroll.init: Failed to generate ID");continue}this._linksHash[e]=i,t.addEventListener("click",e=>{e.preventDefault(),this.scrollTo({parent:i.parent,target:i.target,offset:i.offset,classActive:i.classActive,hash:i.hash})})}}catch(e){console.error("scroll.init: Error processing link",t,e)}Object.keys(this._linksHash).length&&this._setupScrollObservers(),this._initialized=!0}}destroy(){for(let[e,t]of this._scrollHandlers.entries())e.removeEventListener("scroll",t);this._scrollHandlers.clear(),this._linksHash={},this._initialized=!1}_isValidId(e){return"string"==typeof e&&!!e&&/^[a-zA-Z0-9_-]+$/.test(e)}async scrollTo(e){return new Promise(t=>{let i,s,n,r,o,l,a,d;if(!e){console.error("scroll.scrollTo: Parameters required"),t();return}if(e instanceof HTMLElement)i=e,s=this.parent,n=this.offset,r=this.hash;else if("string"==typeof e){if(!this._isValidSelector(e)){console.error("scroll.scrollTo: Invalid or unsafe selector:",e),t();return}i=$ehsFN.lib.qs(e),s=this.parent,n=this.offset,r=this.hash}else if("object"==typeof e){if(e.target instanceof HTMLElement)i=e.target;else if("string"==typeof e.target){if(!this._isValidSelector(e.target)){console.error("scroll.scrollTo: Invalid or unsafe target selector:",e.target),t();return}i=$ehsFN.lib.qs(e.target)}else{console.error("scroll.scrollTo: Invalid target parameter:",e.target),t();return}e.parent===window||e.parent instanceof HTMLElement?s=e.parent:"string"==typeof e.parent?this._isValidSelector(e.parent)?s=$ehsFN.lib.qs(e.parent)||this.parent:(console.error("scroll.scrollTo: Invalid or unsafe parent selector:",e.parent),s=this.parent):s=this.parent,n="number"==typeof e.offset?e.offset:this.offset,r=e.hash??this.hash}else{console.error("scroll.scrollTo: Invalid parameters:",e),t();return}if(!i){console.error("scroll.scrollTo: Target not found:",e),t();return}if(!s){console.error("scroll.scrollTo: Parent not found"),t();return}try{s===window?d=(o=(l=window.pageYOffset||window.scrollY)+i.getBoundingClientRect().top)-l-n:(l=s.scrollTop,a=s.getBoundingClientRect().top,d=(o=l+i.getBoundingClientRect().top-a)-l-n),s.scrollTo({top:Math.max(0,l+d),left:0,behavior:"smooth"}),setTimeout(t,400),r&&i.id?this._isValidId(i.id)?$ehsFN.lib.updateURL("#"+i.id):console.warn("scroll.scrollTo: Invalid target ID for hash:",i.id):r&&history.replaceState({},document.title,window.location.href.split("#")[0])}catch(e){console.error("scroll.scrollTo: Error during scroll",e),t()}})}_setupScrollObservers(){let e=new Set;for(let t in this._linksHash)e.add(this._linksHash[t].parent);for(let t of e){let e=t===window?window:$ehsFN.lib.qs(t);if(!e)continue;let i=()=>{this._scrollObserve()};e.addEventListener("scroll",i,{passive:!0}),this._scrollHandlers.set(e,i)}this._scrollObserve()}_scrollObserve(){let e=document.documentElement.clientHeight/4;for(let t in this._linksHash){if(!this._linksHash.hasOwnProperty(t))continue;let i=this._linksHash[t];if(i&&i.target&&i.link)try{let t=i.target.getBoundingClientRect(),s=t.top<=e&&t.bottom>e;null!=i.classActive&&(s?(i.link.classList.contains(i.classActive)||i.link.classList.add(i.classActive),i.target.classList.contains(i.classActive)||i.target.classList.add(i.classActive)):(i.link.classList.contains(i.classActive)&&i.link.classList.remove(i.classActive),i.target.classList.contains(i.classActive)&&i.target.classList.remove(i.classActive)))}catch(e){console.error("scroll._scrollObserve: Error observing item",t,e)}}}}let $ef55f167e58e504d$export$209876d7b1ac8f3=new $ef55f167e58e504d$var$Scroll;var $ehsFN=parcelRequire("ehsFN");class $10665505e2eb0736$export$70dd375dd4457bf8{constructor(){this._initialized=!1,this._boundEnter=this._handleEnter.bind(this),this._boundLeave=this._handleLeave.bind(this)}init(){"u">typeof document&&!this._initialized&&(this._initialized=!0,document.addEventListener("mouseenter",this._boundEnter,!0),document.addEventListener("mouseleave",this._boundLeave,!0))}destroy(){"u">typeof document&&this._initialized&&(document.removeEventListener("mouseenter",this._boundEnter,!0),document.removeEventListener("mouseleave",this._boundLeave,!0),this._initialized=!1)}_handleEnter(e){this._syncHover(e,!0)}_handleLeave(e){this._syncHover(e,!1)}_syncHover(e,t){let i=e?.target;if(!i||"function"!=typeof i.closest)return;let s=i.closest("[x-hover]");if(!s)return;let n=s.getAttribute("href");if(null!=n&&""!==n.trim()&&"u">typeof CSS&&"function"==typeof CSS.escape)try{let e=CSS.escape(n),i=$ehsFN.lib.qsa(`[x-hover][href="${e}"]`);for(let e=0;e<i.length;e++)i[e].classList.toggle("hover",t)}catch(e){}}}let $10665505e2eb0736$export$3f60957f5dbf3876=new $10665505e2eb0736$export$70dd375dd4457bf8;var $ehsFN=parcelRequire("ehsFN");let $69dd4358dca59ad6$var$CLASSES_TO_REMOVE=["js","windows","macos","ios","android","linux","unknown","chrome","firefox","safari","opera","edge","iphone","ipad","mac","computer","mobile","desktop","touch"],$69dd4358dca59ad6$var$SIZE_FLAGS={xs:{xs:!0,s:!1,m:!1,l:!1,xl:!1},s:{xs:!1,s:!0,m:!1,l:!1,xl:!1},m:{xs:!1,s:!1,m:!0,l:!1,xl:!1},l:{xs:!1,s:!1,m:!1,l:!0,xl:!1},xl:{xs:!1,s:!1,m:!1,l:!1,xl:!0}};class $69dd4358dca59ad6$export$8215d14a63d9fb10{constructor(){if(this.js=!0,this.os="unknown",this.browser="unknown",this.device=null,this.mobile=!1,this.touch=!1,this.width=0,this.height=0,this.breakpoint="xs",this.size=$69dd4358dca59ad6$var$SIZE_FLAGS.xs,this._html=null,this._onResize=this._onResize.bind(this),this._debouncedResize=$ehsFN.lib.debounce(this._onResize,200),this._initialized=!1,"u"<typeof window)return;this.width=window.innerWidth,this.height=window.innerHeight,this.breakpoint=this._getBreakpointName(this.width),this.size=$69dd4358dca59ad6$var$SIZE_FLAGS[this.breakpoint]||$69dd4358dca59ad6$var$SIZE_FLAGS.xs,this._html=document.documentElement}init(){"u">typeof window&&(this._initialized&&this._cleanup(),this._html=document.documentElement,this._detect(),this._applyHtmlClasses(),window.addEventListener("resize",this._debouncedResize),this._initialized=!0)}destroy(){"u">typeof window&&this._cleanup()}_cleanup(){window.removeEventListener("resize",this._debouncedResize),this._html&&this._html.classList.remove(...$69dd4358dca59ad6$var$CLASSES_TO_REMOVE),this._initialized=!1}_getBreakpointName(e){return e>=1280?"xl":e>=1024?"l":e>=768?"m":e>=640?"s":"xs"}_getSizeFlags(e){return $69dd4358dca59ad6$var$SIZE_FLAGS[e]||$69dd4358dca59ad6$var$SIZE_FLAGS.xs}_onResize(){let e=window.innerWidth,t=window.innerHeight,i=this.breakpoint,s=this._getBreakpointName(e);this.width=e,this.height=t,this.breakpoint=s,this.size=$69dd4358dca59ad6$var$SIZE_FLAGS[s]||$69dd4358dca59ad6$var$SIZE_FLAGS.xs,i!==s&&window.dispatchEvent(new CustomEvent("breakpointchange",{detail:{prev:i,current:s,width:e,height:t}}))}_detect(){let e=window.navigator.userAgent.toLowerCase();this.mobile=/mobile/.test(e),e.includes("win")?this.os="windows":e.includes("iphone")||e.includes("ipad")||e.includes("ipod")?this.os="ios":e.includes("android")?this.os="android":e.includes("mac")?this.os="macos":e.includes("linux")?this.os="linux":this.os="unknown",/edg\//.test(e)?this.browser="edge":/opr\//.test(e)||/opera/.test(e)?this.browser="opera":/firefox/.test(e)?this.browser="firefox":/chrome/.test(e)?this.browser="chrome":/safari/.test(e)?this.browser="safari":this.browser="unknown",e.includes("ipad")?this.device="ipad":e.includes("iphone")?this.device="iphone":e.includes("android")?this.device="android":e.includes("mac")?this.device="mac":this.device="computer",this.touch=window.matchMedia?.("(pointer: coarse)").matches??!1}_applyHtmlClasses(){if(!this._html)return;let e=["js",this.os,this.browser,this.device,this.mobile?"mobile":"desktop",this.touch?"touch":null].filter(Boolean);this._html.classList.add(...e)}}let $69dd4358dca59ad6$export$91cea577896d70d9=new $69dd4358dca59ad6$export$8215d14a63d9fb10;var $ehsFN=parcelRequire("ehsFN"),$ehsFN=parcelRequire("ehsFN");class $fb9ec3799c0f5369$var$Form{constructor(){this._updateElements=new Set,this._updateHandlers=new Map,this.listen=Object.freeze({update:this._updateElements})}getEventType(e){if(!e)throw Error("getEventType: Element is required");if(e.isContentEditable)return"input";let t=e.tagName?.toLowerCase();if(!t)throw Error("getEventType: Element has no tagName");if("input"===t||"textarea"===t)return"input";if("select"===t)return"change";throw Error(`getEventType: Unsupported element <${t}>`)}_eventType(e){if(!e)return"";if(e.isContentEditable)return"input";let t=e.tagName?.toLowerCase();return"input"===t||"textarea"===t?"input":"select"===t?"change":""}setChecked(e,t=!1){if("u"<typeof document||!e)return;let i=$ehsFN.lib.qsa(e);for(let e=0;e<i.length;e++){let s=i[e],n=s.type;("checkbox"===n||"radio"===n)&&s.checked!==t&&(s.checked=t,s.dispatchEvent(new Event("input",{bubbles:!0})))}}setValue(e,t){if("u"<typeof document||!e)return;let i=$ehsFN.lib.qsa(e),s=String(t);for(let e=0;e<i.length;e++){let n=i[e],r="";try{if(n.isContentEditable)n.innerText=s,r="input";else{let e=n.tagName?.toLowerCase();if(!e)continue;let i=n.type;if("input"===e)"checkbox"===i||"radio"===i?n.checked=!!t:n.value=s,r="input";else{if("textarea"!==e&&"select"!==e)continue;n.value=s,r="select"===e?"change":"input"}}r&&n.dispatchEvent(new Event(r,{bubbles:!0}))}catch(e){"u">typeof console&&console.error&&console.error("setValue",n,e)}}}onUpdate(e,t){if("u"<typeof document||!e||"function"!=typeof t)return;let i=$ehsFN.lib.qsa(e);for(let e=0;e<i.length;e++){let s=i[e];if(this._updateHandlers.has(s))continue;let n=this._eventType(s);if(!n)continue;let r=()=>t(s);s.addEventListener(n,r),this._updateHandlers.set(s,{eventType:n,handler:r}),this._updateElements.add(s)}}offUpdate(e){if("u"<typeof document||!e)return;let t=$ehsFN.lib.qsa(e);for(let e=0;e<t.length;e++){let i=t[e],s=this._updateHandlers.get(i);s&&(i.removeEventListener(s.eventType,s.handler),this._updateHandlers.delete(i),this._updateElements.delete(i))}}update(e){if("u"<typeof document||!e)return;let t=$ehsFN.lib.qsa(e);for(let e=0;e<t.length;e++){let i=t[e],s=this._eventType(i);s&&i.dispatchEvent(new Event(s,{bubbles:!0}))}}destroy(){"u">typeof document&&(this._updateHandlers.forEach((e,t)=>{t.removeEventListener(e.eventType,e.handler)}),this._updateHandlers.clear(),this._updateElements.clear())}}let $fb9ec3799c0f5369$export$6210fa4921d2a466=new $fb9ec3799c0f5369$var$Form;var $ehsFN=parcelRequire("ehsFN");class $a1e3f49e5a065fbf$var$Sticky{constructor(){this.activeClass="sticky--on",this.rootMargin="-1px 0px 0px 0px",this._observer=null,this._initialized=!1,this._initObserver()}_initObserver(){"IntersectionObserver"in window?this._observer=new IntersectionObserver(e=>{for(let t of e)t&&t.target&&this._handleEntry(t)},{threshold:1,rootMargin:this.rootMargin}):console.warn("sticky: IntersectionObserver is not supported")}_handleEntry(e){if(!e||!e.target)return;let t=e.target;if(!(t instanceof HTMLElement))return;let i=e.intersectionRatio<1;i!==t.classList.contains(this.activeClass)&&(i?(t.classList.add(this.activeClass),t.dispatchEvent(new CustomEvent("sticky:on",{bubbles:!0}))):(t.classList.remove(this.activeClass),t.dispatchEvent(new CustomEvent("sticky:off",{bubbles:!0}))))}init(){if(!this._observer)return void console.warn("sticky.init: IntersectionObserver is not available");for(let e of(this._initialized&&this.reset(),$ehsFN.lib.qsa(".sticky")))if(e&&e instanceof HTMLElement&&!e.dataset.stickyObserved)try{this._observer.observe(e),e.dataset.stickyObserved="true"}catch(t){console.error("sticky.init: Error observing element",e,t)}this._initialized=!0}reset(){if(this._observer){for(let e of $ehsFN.lib.qsa(".sticky"))if(e&&e instanceof HTMLElement&&e.dataset.stickyObserved)try{document.body.contains(e)&&this._observer.unobserve(e),delete e.dataset.stickyObserved}catch(t){console.error("sticky.reset: Error unobserving element",e,t),delete e.dataset.stickyObserved}}}destroy(){this._observer&&(this._observer.disconnect(),this._observer=null),this._initialized=!1}}let $a1e3f49e5a065fbf$export$4bd4b47501432316=new $a1e3f49e5a065fbf$var$Sticky;var $ehsFN=parcelRequire("ehsFN");class $a4da403316380ec6$export$472062a354075cee{constructor(){this.sliders=[],this.instances=new Map,this.io=null,this.mo=null}init(){(this.observeSliders(),"MutationObserver"in window)?(this.mo=new MutationObserver(e=>{for(let t of e)for(let e of t.addedNodes)if(1===e.nodeType&&e instanceof HTMLElement){e.hasAttribute("x-slider")&&this.io&&this.io.observe(e);let t=e.querySelectorAll?.("[x-slider]");if(t&&this.io)for(let e of t)e&&!this.instances.has(e)&&this.io.observe(e)}}),this.mo.observe(document.body,{childList:!0,subtree:!0})):console.warn("slider: MutationObserver is not supported")}destroy(){this.instances.forEach((e,t)=>{let i=e.listenerTarget||e.wrapper||t;e.touch?(i.removeEventListener("touchstart",e.events.touchstart,!0),i.removeEventListener("touchmove",e.events.touchmove,!0),i.removeEventListener("touchend",e.events.touchend,!0),i.removeEventListener("touchcancel",e.events.touchcancel,!0)):(t.removeEventListener("mousemove",e.events.mousemove),e.events.mouseout&&t.removeEventListener("mouseleave",e.events.mouseout),e.events.mouseenter&&t.removeEventListener("mouseenter",e.events.mouseenter),e.events.resize&&(window.removeEventListener("resize",e.events.resize),window.removeEventListener("orientationchange",e.events.resize)))}),this.io&&this.io.disconnect(),this.mo&&this.mo.disconnect(),this.instances.clear()}observeSliders(){if(!("IntersectionObserver"in window))return void console.warn("slider: IntersectionObserver is not supported");for(let e of(this.sliders=document.querySelectorAll("[x-slider]"),this.io=new IntersectionObserver(e=>{for(let t of e)t.isIntersecting&&t.target&&!this.instances.has(t.target)&&this.initSlider(t.target)},{rootMargin:"60px 0px 60px 0px",threshold:0}),this.sliders))e&&this.io.observe(e)}_validateConfig(e){let t={gap:0,rubber:!0,resetOnMouseout:!0,touch:!0};if(!e||"object"!=typeof e)return t;if("gap"in e){let i=Number(e.gap);t.gap=isNaN(i)||i<0?0:i}return"rubber"in e&&(t.rubber=!!e.rubber),"resetOnMouseout"in e&&(t.resetOnMouseout=!!e.resetOnMouseout),"touch"in e&&(t.touch=!!e.touch),t}initSlider(e){if(!e||!(e instanceof HTMLElement))return void console.error("slider.initSlider: Invalid element");let t=[...e.children].map(e=>e.cloneNode(!0));if(!t.length)return void console.warn("slider.initSlider: No slides found",e);e.classList.add("slider"),e.style.overflow="hidden",e.style.overscrollBehavior="contain";let i=0,s=!0,n=!0,r=!0;try{let t=e.getAttribute("x-slider");if(t)if($ehsFN.lib.isValidJSON(t)){let e=JSON.parse(t),o=this._validateConfig(e);i=o.gap,s=o.rubber,n=o.resetOnMouseout,r=o.touch}else console.warn("slider.initSlider: Invalid JSON in x-slider attribute:",t)}catch(e){console.warn("slider.initSlider: Error parsing x-slider JSON",e)}let o=document.createElement("div");o.className="slider-wrapper",o.style.gap=i+"px",e.innerHTML="";for(let e=0;e<t.length;e++){let i=t[e];if(!i)continue;i.classList.add("slider-item");let s=i.querySelector("img");s&&0===e&&(s.dataset.srcset&&(s.srcset=s.dataset.srcset,s.removeAttribute("data-srcset")),s.dataset.src&&(s.src=s.dataset.src,s.removeAttribute("data-src")),s.setAttribute("loading","eager")),o.appendChild(i)}e.appendChild(o);let l="ontouchstart"in window,a=[];if(t.length>1&&(!l||r)){let i=document.createElement("div");i.className="slider-indicators";for(let e=0;e<t.length;e++){let t=document.createElement("span");0===e&&t.classList.add("active"),i.appendChild(t)}e.appendChild(i),a=[...i.querySelectorAll("span")]}let d=t;if(l&&r?e.classList.add("slider_touch"):e.classList.remove("slider_touch"),l&&!r)return void d[0].classList.add("active");let c=0,h=/iP(ad|hone|od)/.test(navigator.platform)||navigator.userAgent.includes("Mac")&&"ontouchend"in document,u=()=>d[0].offsetWidth+i,p=(e,t=!1)=>{let i=Math.max(0,Math.min(e,d.length-1)),s=u();if(c=i,o.style.transition=t?"none":"transform 0.25s",o.style.transform=`translateX(${-c*s}px)`,a.length)for(let e=0;e<a.length;e++){let t=a[e];t&&t.classList.toggle("active",e===c)}t||o.addEventListener("transitionend",()=>{o.style.transition="none",h&&(o.style.pointerEvents="none",requestAnimationFrame(()=>{o.offsetWidth,o.style.pointerEvents="auto"}))},{once:!0})};p(0,!0);let f={},m=!1,v=null,b=()=>{if(!m){m=!0;for(let t=0;t<d.length;t++){let i=d[t];if(!i)continue;let s=i.querySelector("img");s&&0!==t&&(s.dataset.srcset&&(s.srcset=s.dataset.srcset,s.removeAttribute("data-srcset")),s.dataset.src&&(s.src=s.dataset.src,s.removeAttribute("data-src")),l||s.complete&&0!==s.naturalWidth||s.addEventListener("load",()=>{if(null!=v){let i=e.getBoundingClientRect(),s=e.offsetWidth;s>0&&Math.floor((v-i.left)/s*d.length)===t&&p(t,!0)}},{once:!0}))}}};if(d.length>1)if(l){let t=0,i=0,n=!1,r=null,l=(e,t)=>[...e].find(e=>e.identifier===t)||null,a=()=>{b(),e.removeEventListener("touchstart",a)};e.addEventListener("touchstart",a,{passive:!1,capture:!0}),f.touchstart=e=>{let s=e.changedTouches[0];r=s.identifier,t=s.clientX,i=s.clientY,n=!0,o.style.transition="none"},f.touchmove=e=>{if(!n||null==r)return;let a=l(e.touches,r);if(!a)return;let h=a.clientX-t;if(Math.abs(a.clientY-i)>Math.abs(h))return;e.cancelable&&e.preventDefault();let p=u(),f=h;0===c&&h>0&&(f=s?.15*h:0),c===d.length-1&&h<0&&(f=s?.15*h:0),o.style.transform=`translateX(${-c*p+f}px)`},f.touchend=e=>{if(!n)return;n=!1;let s=l(e.changedTouches,r)||e.changedTouches[0];r=null;let o=s.clientX-t,a=s.clientY-i,h=.1*u();Math.abs(a)>Math.abs(o)||0===c&&o>0||c===d.length-1&&o<0?p(c):o>h&&c>0?p(c-1):o<-h&&c<d.length-1?p(c+1):p(c)},f.touchcancel=()=>{n=!1,r=null,p(c)},e.addEventListener("touchstart",f.touchstart,{passive:!1,capture:!0}),e.addEventListener("touchmove",f.touchmove,{passive:!1,capture:!0}),e.addEventListener("touchend",f.touchend,{capture:!0}),e.addEventListener("touchcancel",f.touchcancel,{capture:!0})}else{let t=i=>{v=i.clientX,b(),e.removeEventListener("mouseenter",t)};e.addEventListener("mouseenter",t),f.mousemove=t=>{v=t.clientX;let i=e.getBoundingClientRect(),s=e.offsetWidth;if(s<=0)return;let n=t.clientX-i.left;n<0?n=0:n>=s&&(n=s-1e-7);let r=Math.floor(n/s*d.length),o=d[r].querySelector("img");r!==c&&(!o||o.complete||o.naturalWidth>0)&&p(r,!0)},e.addEventListener("mousemove",f.mousemove),e.addEventListener("mouseenter",e=>f.mousemove(e)),n&&(f.mouseout=()=>p(0,!0),e.addEventListener("mouseleave",f.mouseout))}let _=()=>{let e=u();o.style.transition="none",o.style.transform=`translateX(${-c*e}px)`};window.addEventListener("resize",_),window.addEventListener("orientationchange",_),f.resize=_,this.instances.set(e,{wrapper:o,slides:d,events:f,touch:l,listenerTarget:e})}}let $a4da403316380ec6$export$b38bf4f33e9e4c25=new $a4da403316380ec6$export$472062a354075cee;class $e5904712fb6120b1$var$X{constructor(){this.modal=$fb3cb004b28f41eb$export$96e4b36520c26a2c,this.animate=$014037f76a5c216c$export$e3607ec2d7a891c4,this.appear=$eb3d55ecca7ee7d2$export$fb1b4b0e602f43f1,this.lazyload=$45256965eb1aa1f4$export$c3e8f8508bab224b,this.loadmore=$c188f7d5f390f2f6$export$6456520619f548d5,this.sheets=$8f6aab8d3dab3eed$export$d1f2fc3a3d47c5af,this.dropdown=$3134c8ebb2c91188$export$81207e5cc4186890,this.autocomplete=$fa742adec1b07386$export$485ded5f26ebe08d,this.scroll=$ef55f167e58e504d$export$209876d7b1ac8f3,this.hover=$10665505e2eb0736$export$3f60957f5dbf3876,this.device=$69dd4358dca59ad6$export$91cea577896d70d9,this.lib=$ehsFN.lib,this.render=$ehsFN.lib.render.bind($ehsFN.lib),this.form=$fb9ec3799c0f5369$export$6210fa4921d2a466,this.sticky=$a1e3f49e5a065fbf$export$4bd4b47501432316,this.slider=$a4da403316380ec6$export$b38bf4f33e9e4c25,this.initialized=!1}init(){this.initialized||(this.device.init(),this.modal.init(),this.animate.init(),this.appear.init(),this.lazyload.init(),this.loadmore.init(),this.sheets.init(),this.dropdown.init(),this.scroll.init(),this.sticky.init(),this.slider.init(),$10665505e2eb0736$export$3f60957f5dbf3876.init(),this.initialized=!0)}}let $e5904712fb6120b1$var$x=new $e5904712fb6120b1$var$X;window.x=$e5904712fb6120b1$var$x,window.x.id=$e5904712fb6120b1$var$x.lib.id,window.x.qs=$e5904712fb6120b1$var$x.lib.qs,window.x.qsa=$e5904712fb6120b1$var$x.lib.qsa,x.init(),window.element1=e=>{let t=-360*e.progress;e.element.style.transform="rotate("+t+"deg)"},window.element2=e=>{let t=180*e.progress;e.element.style.transform="rotate("+t+"deg)"},window.element3=e=>{let t=120*e.progress;e.element.style.transform="rotate("+t+"deg)"},window.headerAnimation=e=>{let t=100,i=qs(".header"),s=qs(".header-logo img"),n=t-e.progress*t/2,r=1-.5*e.progress;i.style.height=n+"px",s.style.transform="scale("+r+")",x.lib.switchClass(i,"header_compact",1==e.progress)},window.onload=()=>{x.lib.transitionsOn()};

package/cheatsheet.html

@@ -0,0 +1,427 @@
+<!DOCTYPE html>
+<html lang="ru">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>CSS Framework Cheatsheet</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
+            background: #f0f2f5;
+            padding: 16px;
+            font-size: 13px;
+            line-height: 1.4;
+        }
+
+        /* Контейнер для компактного отображения */
+        .cheatsheet {
+            max-width: 1400px;
+            margin: 0 auto;
+            background: white;
+            border-radius: 12px;
+            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+            overflow: hidden;
+        }
+
+        /* Заголовок */
+        .header {
+            background: #1a1a2e;
+            color: white;
+            padding: 16px 20px;
+            border-bottom: 3px solid #08e;
+        }
+
+        .header h1 {
+            font-size: 20px;
+            margin-bottom: 4px;
+        }
+
+        .header p {
+            opacity: 0.7;
+            font-size: 12px;
+        }
+
+        /* Сетка для таблиц */
+        .grid-cards {
+            display: grid;
+            grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
+            gap: 1px;
+            background: #ddd;
+        }
+
+        .card {
+            background: white;
+            padding: 12px 14px;
+            min-width: 0;
+        }
+
+        .card-title {
+            font-weight: 700;
+            font-size: 14px;
+            color: #08e;
+            border-left: 3px solid #08e;
+            padding-left: 8px;
+            margin-bottom: 10px;
+            margin-top: 4px;
+        }
+
+        .card-title:first-child {
+            margin-top: 0;
+        }
+
+        .class-list {
+            display: flex;
+            flex-wrap: wrap;
+            gap: 4px 6px;
+            margin-bottom: 8px;
+        }
+
+        .class-item {
+            font-family: 'SF Mono', 'Fira Code', monospace;
+            font-size: 11px;
+            background: #f5f7fa;
+            padding: 2px 6px;
+            border-radius: 4px;
+            color: #d63384;
+            border: 1px solid #e9ecef;
+            white-space: nowrap;
+        }
+
+        .class-item-prefix {
+            background: #e8f0fe;
+            color: #0066cc;
+        }
+
+        .badge {
+            display: inline-block;
+            font-size: 9px;
+            background: #e9ecef;
+            padding: 1px 4px;
+            border-radius: 4px;
+            margin-left: 4px;
+            font-family: monospace;
+            font-weight: normal;
+        }
+
+        .note {
+            font-size: 10px;
+            color: #6c757d;
+            margin-top: 6px;
+            border-top: 1px solid #f0f0f0;
+            padding-top: 6px;
+        }
+
+        hr {
+            margin: 8px 0;
+            border: none;
+            border-top: 1px solid #eee;
+        }
+
+        .subtitle {
+            font-weight: 600;
+            font-size: 12px;
+            color: #495057;
+            margin: 8px 0 4px 0;
+        }
+
+        @media print {
+            body {
+                background: white;
+                padding: 0;
+            }
+            .cheatsheet {
+                box-shadow: none;
+            }
+            .card {
+                break-inside: avoid;
+            }
+            .grid-cards {
+                gap: 0;
+            }
+        }
+    </style>
+</head>
+<body>
+<div class="cheatsheet">
+    <div class="header">
+        <h1>📄 CSS Framework Cheatsheet</h1>
+        <p>Все классы в одном месте · s/m/l/xl — адаптивные брейкпоинты (640/768/1024/1280px)</p>
+    </div>
+
+    <div class="grid-cards">
+
+        <!-- ======================= -->
+        <!-- BUTTONS -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">🔘 Buttons</div>
+            <div class="class-list">
+                <span class="class-item">.button</span>
+                <span class="class-item">.button--label</span>
+                <span class="class-item">.button--primary</span>
+                <span class="class-item">.button--success</span>
+                <span class="class-item">.button--warning</span>
+                <span class="class-item">.button--danger</span>
+                <span class="class-item">.button--white</span>
+                <span class="class-item">.button--black</span>
+                <span class="class-item">.button--clear</span>
+                <span class="class-item">.button--dropdown</span>
+                <span class="class-item">.buttons-group</span>
+            </div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- COLORS & BG -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">🎨 Colors & Backgrounds</div>
+            <div class="class-list">
+                <span class="class-item">.color-primary</span>
+                <span class="class-item">.color-success</span>
+                <span class="class-item">.color-warning</span>
+                <span class="class-item">.color-danger</span>
+                <span class="class-item">.color-error</span>
+                <span class="class-item">.color-grey</span>
+            </div>
+            <div class="class-list">
+                <span class="class-item">.bg-primary</span>
+                <span class="class-item">.bg-success</span>
+                <span class="class-item">.bg-warning</span>
+                <span class="class-item">.bg-danger</span>
+                <span class="class-item">.bg-error</span>
+                <span class="class-item">.bg-grey</span>
+            </div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- FLEX -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">🧩 Flex <span class="badge">+ s/m/l/xl</span></div>
+            <div class="subtitle">Включение</div>
+            <div class="class-list"><span class="class-item">.flex</span><span class="class-item">.s:flex</span><span class="class-item">.m:flex</span><span class="class-item">.l:flex</span><span class="class-item">.xl:flex</span></div>
+            <div class="subtitle">Направление / Wrap</div>
+            <div class="class-list"><span class="class-item">.fr</span><span class="class-item">.fc</span><span class="class-item">.fw</span><span class="class-item">.fnw</span><span class="class-item badge">s/m/l/xl:*</span></div>
+            <div class="subtitle">Align-items</div>
+            <div class="class-list"><span class="class-item">.ais</span><span class="class-item">.aifs</span><span class="class-item">.aic</span><span class="class-item">.aife</span></div>
+            <div class="subtitle">Justify-content</div>
+            <div class="class-list"><span class="class-item">.jcfs</span><span class="class-item">.jcc</span><span class="class-item">.jcfe</span><span class="class-item">.jcsb</span><span class="class-item">.jcsa</span><span class="class-item">.jcse</span></div>
+            <div class="subtitle">Flex-колонки</div>
+            <div class="class-list"><span class="class-item">.c1/2</span><span class="class-item">.c1/3</span><span class="class-item">.c2/3</span><span class="class-item">.c1/4</span><span class="class-item">.c3/4</span><span class="class-item">.c1/6</span><span class="class-item">.c5/6</span><span class="class-item">.c1/12</span><span class="class-item">.c11/12</span><span class="class-item badge">+ s/m/l/xl</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- GRID -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📐 Grid <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.grid</span><span class="class-item">.g1</span><span class="class-item">.g2</span><span class="class-item">.g3</span><span class="class-item">.g4</span><span class="class-item">.g5</span><span class="class-item">.g6</span><span class="class-item">.g7</span><span class="class-item">.g8</span><span class="class-item">.g9</span><span class="class-item">.g10</span><span class="class-item">.g11</span><span class="class-item">.g12</span></div>
+            <div class="subtitle">Колонки (span)</div>
+            <div class="class-list"><span class="class-item">.c1</span><span class="class-item">.c2</span><span class="class-item">.c3</span>…<span class="class-item">.c12</span></div>
+            <div class="subtitle">Диапазон</div>
+            <div class="class-list"><span class="class-item">.c1/12</span><span class="class-item">.c2/12</span><span class="class-item">.c5/11</span><span class="class-item">.c6/12</span><span class="class-item badge">+ s/m/l/xl</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- FLOW / SPACE / STICKY -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📏 Flow & Vertical Space</div>
+            <div class="class-list"><span class="class-item">.flow</span><span class="class-item">.flow.s0</span>…<span class="class-item">.flow.s10</span><span class="class-item badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.space0</span>…<span class="class-item">.space10</span><span class="class-item badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.sticky</span><span class="class-item badge">+ s/m/l/xl</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- UTILITIES (текст, позиционирование, видимость) -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">⚙️ Утилиты</div>
+            <div class="class-list">
+                <span class="class-item">.antialiased</span>
+                <span class="class-item">.container</span>
+                <span class="class-item">.unselectable</span>
+                <span class="class-item">.unclickable</span>
+                <span class="class-item">.upper</span>
+                <span class="class-item">.lower</span>
+                <span class="class-item">.capitalize</span>
+                <span class="class-item">.nowrap</span>
+                <span class="class-item">.hyphens</span>
+                <span class="class-item">.pointer</span>
+                <span class="class-item">.toe</span>
+                <span class="class-item">.oh</span>
+                <span class="class-item">.rel</span>
+                <span class="class-item">.abs</span>
+                <span class="class-item">.ins</span>
+                <span class="class-item">.break-word</span>
+                <span class="class-item">.visually-hidden</span>
+                <span class="class-item">.invisible</span>
+                <span class="class-item">.scroll-responsive</span>
+                <span class="class-item">.fullscreen</span>
+                <span class="class-item">.no-print</span>
+                <span class="class-item">.touch-show</span>
+                <span class="class-item">.touch-hide</span>
+            </div>
+            <div class="subtitle">Line Clamp</div>
+            <div class="class-list"><span class="class-item">.lc1</span><span class="class-item">.lc2</span><span class="class-item">.lc3</span><span class="class-item">.lc4</span><span class="class-item">.lc5</span><span class="class-item badge">+ s/m/l/xl</span></div>
+            <div class="subtitle">Object-fit</div>
+            <div class="class-list"><span class="class-item">.fit-none</span><span class="class-item">.fit-cover</span><span class="class-item">.fit-contain</span><span class="class-item badge">+ s/m/l/xl</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- SHOW / HIDE -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">👁️ Show / Hide <span class="badge">s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.hidden</span><span class="class-item">.hidden-next</span><span class="class-item">.block</span><span class="class-item">.inline</span><span class="class-item">.inline-block</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- MARGIN, PADDING, GAP -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📐 Margin <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.m0</span>…<span class="class-item">.m12</span><span class="class-item">.m0n</span>…<span class="class-item">.m12n</span></div>
+            <div class="class-list"><span class="class-item">.mx0</span>…<span class="class-item">.mx12</span><span class="class-item">.my0</span>…<span class="class-item">.my12</span></div>
+            <div class="class-list"><span class="class-item">.mt0</span>…<span class="class-item">.mt12</span><span class="class-item">.mb0</span>…<span class="class-item">.mb12</span></div>
+            <div class="class-list"><span class="class-item">.ml0</span>…<span class="class-item">.ml12</span><span class="class-item">.mr0</span>…<span class="class-item">.mr12</span></div>
+            <div class="class-list"><span class="class-item">.ma</span><span class="class-item">.mxa</span><span class="class-item">.mya</span><span class="class-item">.mta</span><span class="class-item">.mba</span><span class="class-item">.mla</span><span class="class-item">.mra</span></div>
+        </div>
+
+        <div class="card">
+            <div class="card-title">📦 Padding <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.p0</span>…<span class="class-item">.p12</span><span class="class-item">.px0</span>…<span class="class-item">.px12</span><span class="class-item">.py0</span>…<span class="class-item">.py12</span></div>
+            <div class="class-list"><span class="class-item">.pt0</span>…<span class="class-item">.pt12</span><span class="class-item">.pb0</span>…<span class="class-item">.pb12</span></div>
+            <div class="class-list"><span class="class-item">.pl0</span>…<span class="class-item">.pl12</span><span class="class-item">.pr0</span>…<span class="class-item">.pr12</span></div>
+        </div>
+
+        <div class="card">
+            <div class="card-title">🔲 Gap <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.gap0</span>…<span class="class-item">.gap12</span><span class="class-item">.gapx0</span>…<span class="class-item">.gapx12</span><span class="class-item">.gapy0</span>…<span class="class-item">.gapy12</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- POSITION (top/bottom/left/right/z-index) -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📍 Position offsets <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.t0</span>…<span class="class-item">.t12</span><span class="class-item">.t0n</span>…<span class="class-item">.t12n</span></div>
+            <div class="class-list"><span class="class-item">.b0</span>…<span class="class-item">.b12</span><span class="class-item">.b0n</span>…<span class="class-item">.b12n</span></div>
+            <div class="class-list"><span class="class-item">.l0</span>…<span class="class-item">.l12</span><span class="class-item">.l0n</span>…<span class="class-item">.l12n</span></div>
+            <div class="class-list"><span class="class-item">.r0</span>…<span class="class-item">.r12</span><span class="class-item">.r0n</span>…<span class="class-item">.r12n</span></div>
+            <div class="class-list"><span class="class-item">.z0</span>…<span class="class-item">.z12</span><span class="class-item badge">+ s/m/l/xl</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- OPACITY -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">🌀 Opacity</div>
+            <div class="class-list"><span class="class-item">.op0</span><span class="class-item">.op1</span><span class="class-item">.op2</span><span class="class-item">.op3</span><span class="class-item">.op4</span><span class="class-item">.op5</span><span class="class-item">.op6</span><span class="class-item">.op7</span><span class="class-item">.op8</span><span class="class-item">.op9</span><span class="class-item">.op10</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- RATIO -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📐 Ratio <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list">
+                <span class="class-item">.ratio1x1</span><span class="class-item">.ratio2x1</span><span class="class-item">.ratio3x1</span><span class="class-item">.ratio4x1</span>
+                <span class="class-item">.ratio3x2</span><span class="class-item">.ratio4x3</span><span class="class-item">.ratio16x9</span>
+                <span class="class-item">.ratio1x2</span><span class="class-item">.ratio1x3</span><span class="class-item">.ratio1x4</span>
+                <span class="class-item">.ratio2x3</span><span class="class-item">.ratio3x4</span><span class="class-item">.ratio9x16</span>
+            </div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- WIDTH (w, max, min) -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📏 Width <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.max</span></div>
+            <div class="class-list"><span class="class-item">.w10</span>…<span class="class-item">.w190</span> step 10</div>
+            <div class="class-list"><span class="class-item">.w200</span>…<span class="class-item">.w380</span> step 20</div>
+            <div class="class-list"><span class="class-item">.w400</span>…<span class="class-item">.w1600</span> step 100</div>
+            <div class="class-list"><span class="class-item">.max10</span>…<span class="class-item">.max1600</span> (аналогично)</div>
+            <div class="class-list"><span class="class-item">.min10</span>…<span class="class-item">.min1600</span> (аналогично)</div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- TEXT ALIGN -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📌 Text align <span class="badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.al</span><span class="class-item">.ar</span><span class="class-item">.ac</span><span class="class-item">.aj</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- BORDER RADIUS / SHADOW / ORDER -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">🎨 Border Radius, Shadow, Order</div>
+            <div class="class-list"><span class="class-item">.br0</span>…<span class="class-item">.br12</span><span class="class-item">.br100</span><span class="class-item badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.sh0</span>…<span class="class-item">.sh10</span><span class="class-item badge">+ s/m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.o0</span>…<span class="class-item">.o12</span><span class="class-item badge">+ s/m/l/xl</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- ICON -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">🔷 Icon</div>
+            <div class="class-list"><span class="class-item">.icon</span><span class="class-item">.icon.s10</span>…<span class="class-item">.icon.s60</span> step 2 <span class="badge">+ m/l</span></div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- LINKS -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">🔗 Links</div>
+            <div class="class-list">
+                <span class="class-item">a</span><span class="class-item">a.link</span><span class="class-item">a.hover</span><span class="class-item">a.active</span>
+                <span class="class-item">a.link--noline</span><span class="class-item">a.link--underline</span>
+                <span class="class-item">a.link--dashed</span><span class="class-item">a.link--dotted</span><span class="class-item">a.link--wavy</span>
+            </div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- SCROLL -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📜 Scroll</div>
+            <div class="class-list">
+                <span class="class-item">.scroll</span>
+                <span class="class-item">.scroll--contain</span>
+                <span class="class-item">.scroll--x-proximity</span>
+                <span class="class-item">.scroll--x-mandatory</span>
+            </div>
+        </div>
+
+        <!-- ======================= -->
+        <!-- TYPOGRAPHY (h, fs, fw, ls, lh) -->
+        <!-- ======================= -->
+        <div class="card">
+            <div class="card-title">📝 Typography</div>
+            <div class="class-list"><span class="class-item">.h1</span>…<span class="class-item">.h6</span><span class="class-item">.mono</span><span class="class-item">.italic</span><span class="class-item">.strike</span></div>
+            <div class="class-list"><span class="class-item">.fs10</span>…<span class="class-item">.fs19</span> step 1 <span class="badge">+ m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.fs20</span><span class="class-item">.fs22</span>…<span class="class-item">.fs64</span> step 2 <span class="badge">+ m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.fw100</span>…<span class="class-item">.fw900</span> step 100 <span class="badge">+ m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.ls0</span>…<span class="class-item">.ls4</span><span class="class-item badge">+ m/l/xl</span></div>
+            <div class="class-list"><span class="class-item">.lh0</span>…<span class="class-item">.lh9</span><span class="class-item badge">+ m/l/xl</span> (1.0–1.9)</div>
+        </div>
+
+    </div>
+    <div class="note" style="padding: 12px 16px; background: #f8f9fa; border-top: 1px solid #ddd; font-size: 11px;">
+        🧠 <strong>Примечание:</strong> <code>.s:</code> — 640px, <code>.m:</code> — 768px, <code>.l:</code> — 1024px, <code>.xl:</code> — 1280px.<br>
+        📐 Отступы <code>.m0–m12</code> используют CSS-переменные <code>--space-0</code> … <code>--space-12</code>.<br>
+        🎯 <code>.c1/2</code> = ширина 50%, <code>.c1/3</code> ≈ 33.33%, <code>.c2/3</code> ≈ 66.66% и т.д.
+    </div>
+</div>
+</body>
+</html>