.article-header .search-input{margin-bottom:var(--spacing-8)}.article-header__title{font-size:var(--font-size-2xl);font-weight:var(--font-weight-extrabold);margin-bottom:var(--spacing-4);background:linear-gradient(to right,var(--color-primary),var(--color-purple-500) 40%,var(--color-pink-500));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0);line-height:1.2}@media(min-width:768px){.article-header__title{font-size:var(--font-size-5xl)}}.article-header__description{font-size:var(--font-size-base);color:var(--color-gray-600);max-width:48rem;margin-bottom:var(--spacing-8)}@media(min-width:768px){.article-header__description{font-size:var(--font-size-xl)}}.article-header__metadata{display:flex;align-items:center;gap:var(--spacing-3);flex-wrap:wrap}.article-header__meta-item{display:flex;align-items:center;font-size:var(--font-size-sm);color:var(--color-gray-500);gap:var(--spacing-1)}.article-header__meta-item i{margin-right:var(--spacing-1)}.article-header__meta-item--clickable{cursor:pointer;padding:var(--spacing-1) var(--spacing-2);margin:calc(var(--spacing-1)*-1) calc(var(--spacing-2)*-1);border-radius:var(--radius-md);-webkit-user-select:none;user-select:none;transition:background-color opacity ease}.article-header__meta-item--clickable:hover{background-color:hsla(0,0%,100%,.05)}.article-header__meta-item--clickable:focus{outline:2px solid var(--color-primary);outline-offset:2px}.article-header__meta-item--clickable:active{opacity:.7}.article-header__meta-item--beginner{color:var(--color-green-600)}.article-header__meta-item--web{color:var(--color-blue-600)}.article-header__meta-item--desktop{color:var(--color-purple-600)}.article-header__meta-item--mobile{color:var(--color-orange-600)}.article-header__meta-item--android{color:var(--color-green-600)}.article-header__meta-item--ios{color:var(--color-gray-600)}.article-header__meta-item--windows{color:var(--color-cyan-600)}.article-header__meta-item--mac{color:var(--color-gray-600)}.article-header__meta-item--linux{color:var(--color-yellow-600)}.article-header__meta-text{font-weight:var(--font-weight-medium)}.article-header__platform-container{display:flex;align-items:center;justify-content:center;gap:var(--spacing-3)}.article-header__separator{width:.25rem;height:.25rem;background-color:var(--color-gray-300);border-radius:var(--radius-full)}.article-main-content{padding:0 var(--spacing-8) var(--spacing-8);position:relative}.article-tabs{margin-bottom:var(--spacing-6)}@media(min-width:768px){.article-tabs{margin-bottom:var(--spacing-8)}}.article-tabs__container{position:relative;display:flex;align-items:center}.article-tabs__list{display:flex;border-bottom:1px solid var(--color-gray-200);gap:var(--spacing-2);overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.article-tabs__list::-webkit-scrollbar{display:none}@media(min-width:768px){.article-tabs__list{gap:0;overflow-x:visible}}.article-tabs__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:10;display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background-color:var(--color-white);border:1px solid var(--color-gray-200);border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.1);cursor:pointer;transition:all .2s ease}.article-tabs__arrow:hover{background-color:var(--color-gray-50);border-color:var(--color-gray-300)}.article-tabs__arrow:active{transform:translateY(-50%) scale(.95)}.article-tabs__arrow i{font-size:var(--font-size-xs);color:var(--color-gray-600)}.article-tabs__arrow--left{left:-8px}@media(min-width:640px){.article-tabs__arrow--left{left:-12px}}.article-tabs__arrow--right{right:-8px}@media(min-width:640px){.article-tabs__arrow--right{right:-12px}}@media(min-width:768px){.article-tabs__arrow{display:none}}.article-tabs__button{padding:var(--spacing-2) var(--spacing-4);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);color:var(--color-gray-500);background-color:rgba(0,0,0,0);border:none;border-bottom:2px solid rgba(0,0,0,0);cursor:pointer;transition:all .2s ease;white-space:nowrap;flex-shrink:0}@media(min-width:768px){.article-tabs__button{padding:var(--spacing-3) var(--spacing-6);font-size:var(--font-size-sm)}}.article-tabs__button i{margin-right:var(--spacing-1);font-size:var(--font-size-xs)}@media(min-width:768px){.article-tabs__button i{margin-right:var(--spacing-2);font-size:inherit}}.article-tabs__button:hover{color:var(--color-gray-700)}.article-tabs__button--active{color:var(--color-primary);border-bottom-color:var(--color-primary);background-color:var(--color-white);border-radius:var(--radius-md) var(--radius-md) 0 0}:root{--color-primary:#17bed0;--color-primary-dark:#15abbe;--color-primary-light:rgba(23,190,208,0.1);--color-primary-5:rgba(23,190,208,0.05);--color-primary-10:rgba(23,190,208,0.1);--color-primary-20:rgba(23,190,208,0.2);--color-gray-50:#f9fafb;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-gray-900:#111827;--color-success:#10b981;--color-warning:#f59e0b;--color-error:#ef4444;--color-info:#3b82f6;--color-green-100:#d1fae5;--color-green-500:#10b981;--color-green-600:#059669;--color-green-700:#047857;--color-blue-100:#dbeafe;--color-blue-600:#2563eb;--color-blue-700:#1d4ed8;--color-red-100:#fee2e2;--color-red-200:#fecaca;--color-red-500:#ef4444;--color-red-600:#dc2626;--color-red-700:#b91c1c;--color-yellow-500:#eab308;--color-yellow-600:#ca8a04;--color-orange-600:#ea580c;--color-cyan-600:#0891b2;--color-purple-50:#faf5ff;--color-purple-100:#f3e8ff;--color-purple-200:#e9d5ff;--color-purple-400:#c084fc;--color-purple-500:#a855f7;--color-purple-600:#9333ea;--color-purple-700:#7e22ce;--color-pink-50:#fdf2f8;--color-pink-200:#fbcfe8;--color-pink-500:#ec4899;--color-white:#ffffff;--color-black:#000000;--color-transparent:transparent;--spacing-0:0;--spacing-1:0.25rem;--spacing-2:0.5rem;--spacing-3:0.75rem;--spacing-4:1rem;--spacing-5:1.25rem;--spacing-6:1.5rem;--spacing-8:2rem;--spacing-10:2.5rem;--spacing-12:3rem;--spacing-16:4rem;--spacing-20:5rem;--font-size-xs:0.75rem;--font-size-sm:0.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-size-5xl:3rem;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--line-height-tight:1.25;--line-height-normal:1.5;--line-height-relaxed:1.625;--radius-sm:0.125rem;--radius-base:0.25rem;--radius-md:0.375rem;--radius-lg:0.5rem;--radius-xl:0.75rem;--radius-2xl:1rem;--radius-full:9999px;--shadow-sm:0 1px 2px 0 rgb(0 0 0/0.05);--shadow-base:0 1px 3px 0 rgb(0 0 0/0.1),0 1px 2px -1px rgb(0 0 0/0.1);--shadow-md:0 4px 6px -1px rgb(0 0 0/0.1),0 2px 4px -2px rgb(0 0 0/0.1);--shadow-lg:0 10px 15px -3px rgb(0 0 0/0.1),0 4px 6px -4px rgb(0 0 0/0.1);--shadow-xl:0 20px 25px -5px rgb(0 0 0/0.1),0 8px 10px -6px rgb(0 0 0/0.1);--z-index-dropdown:10;--z-index-sticky:20;--z-index-header:50;--z-index-modal:100;--z-index-tooltip:200}.article-platform-content{padding:var(--spacing-8) var(--spacing-8);position:relative}@media(min-width:768px){.article-platform-content{padding:var(--spacing-1) var(--spacing-12)}}.article-platform-content__tab{display:none}.article-platform-content__tab--active{display:block}