@charset "UTF-8";
@keyframes fadeIn { from { opacity: 0; }
  to { opacity: 1; } }
@keyframes slideUp { from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); } }
*, *::before, *::after { box-sizing: border-box; }

html { font-size: 16px; scroll-behavior: smooth; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

body { margin: 0; padding: 0; font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 1rem; font-weight: 400; line-height: 1.5; color: #111827; background-color: #ffffff; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

h1, h2, h3, h4, h5, h6 { font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-weight: 700; line-height: 1.25; color: #111827; margin-bottom: 1rem; margin-top: 0; }

h1 { font-size: 2.25rem; line-height: 1.25; }
@media (min-width: 640px) { h1 { font-size: 3rem; } }
@media (min-width: 1024px) { h1 { font-size: 3.75rem; } }

h2 { font-size: 1.875rem; line-height: 1.25; }
@media (min-width: 640px) { h2 { font-size: 2.25rem; } }

h3 { font-size: 1.5rem; line-height: 1.375; }
@media (min-width: 640px) { h3 { font-size: 1.875rem; } }

h4 { font-size: 1.25rem; line-height: 1.375; }
@media (min-width: 640px) { h4 { font-size: 1.5rem; } }

h5 { font-size: 1.125rem; line-height: 1.5; }
@media (min-width: 640px) { h5 { font-size: 1.25rem; } }

h6 { font-size: 1rem; line-height: 1.5; }
@media (min-width: 640px) { h6 { font-size: 1.125rem; } }

p { margin: 0 0 1rem 0; line-height: 1.625; }

a { color: #2563eb; text-decoration: none; transition: 150ms ease; }
a:hover { color: #1e40af; text-decoration: underline; }
a:focus { outline: 2px solid #2563eb; outline-offset: 2px; border-radius: 0.125rem; }

ul, ol { margin: 0 0 1rem 0; padding-left: 1.5rem; }

li { margin-bottom: 0.25rem; line-height: 1.625; }

code { font-family: "JetBrains Mono", "Fira Code", "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace; font-size: 0.875em; background: #f9fafb; padding: 0.25rem 0.5rem; border-radius: 0.25rem; color: #374151; }

pre { font-family: "JetBrains Mono", "Fira Code", "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace; background: #111827; color: #f3f4f6; padding: 1rem; border-radius: 0.5rem; overflow-x: auto; margin: 0 0 1rem 0; }
pre code { background: none; padding: 0; color: inherit; }

.highlight { background: #f8f9fa; border-radius: 0.5rem; padding: 1rem; margin: 1rem 0; overflow-x: auto; font-family: "JetBrains Mono", "Fira Code", "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace; font-size: 0.875em; line-height: 1.625; }
.highlight .c { color: #6a737d; font-style: italic; }
.highlight .err { color: #cb2431; }
.highlight .k { color: #d73a49; font-weight: bold; }
.highlight .o { color: #d73a49; }
.highlight .cm { color: #6a737d; font-style: italic; }
.highlight .cp { color: #d73a49; font-weight: bold; }
.highlight .c1 { color: #6a737d; font-style: italic; }
.highlight .cs { color: #6a737d; font-weight: bold; font-style: italic; }
.highlight .gd { color: #cb2431; background-color: #ffeef0; }
.highlight .ge { font-style: italic; }
.highlight .gr { color: #cb2431; }
.highlight .gh { color: #005cc5; font-weight: bold; }
.highlight .gi { color: #22863a; background-color: #f0fff4; }
.highlight .go { color: #6a737d; }
.highlight .gp { color: #6a737d; }
.highlight .gs { font-weight: bold; }
.highlight .gu { color: #6f42c1; font-weight: bold; }
.highlight .gt { color: #cb2431; }
.highlight .kc { color: #005cc5; font-weight: bold; }
.highlight .kd { color: #d73a49; font-weight: bold; }
.highlight .kn { color: #d73a49; font-weight: bold; }
.highlight .kp { color: #d73a49; font-weight: bold; }
.highlight .kr { color: #d73a49; font-weight: bold; }
.highlight .kt { color: #d73a49; font-weight: bold; }
.highlight .ld { color: #032f62; }
.highlight .m { color: #005cc5; }
.highlight .s { color: #032f62; }
.highlight .na { color: #6f42c1; }
.highlight .nb { color: #005cc5; }
.highlight .nc { color: #6f42c1; font-weight: bold; }
.highlight .no { color: #005cc5; }
.highlight .nd { color: #6f42c1; font-weight: bold; }
.highlight .ni { color: #6a737d; }
.highlight .ne { color: #cb2431; font-weight: bold; }
.highlight .nf { color: #6f42c1; font-weight: bold; }
.highlight .nl { color: #6a737d; font-weight: bold; }
.highlight .nn { color: #6a737d; }
.highlight .nt { color: #22863a; font-weight: bold; }
.highlight .nv { color: #e36209; }
.highlight .ow { color: #d73a49; font-weight: bold; }
.highlight .w { color: #6a737d; }
.highlight .mf { color: #005cc5; }
.highlight .mh { color: #005cc5; }
.highlight .mi { color: #005cc5; }
.highlight .mo { color: #005cc5; }
.highlight .sb { color: #032f62; }
.highlight .sc { color: #032f62; }
.highlight .sd { color: #032f62; }
.highlight .s2 { color: #032f62; }
.highlight .se { color: #032f62; }
.highlight .sh { color: #032f62; }
.highlight .si { color: #005cc5; }
.highlight .sx { color: #032f62; }
.highlight .sr { color: #032f62; }
.highlight .s1 { color: #032f62; }
.highlight .ss { color: #005cc5; }
.highlight .bp { color: #005cc5; }
.highlight .vc { color: #e36209; }
.highlight .vg { color: #e36209; }
.highlight .vi { color: #e36209; }
.highlight .il { color: #005cc5; }
.language-bash .highlight .nv, .language-shell .highlight .nv { color: #e36209; }
.language-bash .highlight .nb, .language-shell .highlight .nb { color: #005cc5; }
.language-python .highlight .kn { color: #d73a49; }
.language-python .highlight .nn { color: #6f42c1; }
.language-python .highlight .nd { color: #6f42c1; }
.language-javascript .highlight .nx, .language-js .highlight .nx { color: #24292e; }
.language-javascript .highlight .p, .language-js .highlight .p { color: #24292e; }
.language-json .highlight .nt { color: #005cc5; }
.language-json .highlight .s2 { color: #032f62; }
.language-yaml .highlight .nt, .language-yml .highlight .nt { color: #22863a; }
.language-yaml .highlight .s, .language-yml .highlight .s { color: #032f62; }

img { max-width: 100%; height: auto; border-radius: 0.5rem; }

img.lazy { opacity: 0; transition: opacity 0.3s ease-in-out; }
img.lazy.lazy-loaded { opacity: 1; }
img.lazy.lazy-fade-in { animation: fadeIn 0.3s ease-in-out; }
img.lazy.lazy-error { opacity: 0.5; filter: grayscale(100%); }

@keyframes fadeIn { from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); } }
img[data-srcset] { background: #f9fafb; min-height: 200px; display: block; }

.image-placeholder { background: linear-gradient(90deg, #f9fafb 25%, rgba(249, 250, 251, 0.5) 50%, #f9fafb 75%); background-size: 200% 100%; animation: loading 1.5s infinite; }

@keyframes loading { 0% { background-position: 200% 0; }
  100% { background-position: -200% 0; } }
table { width: 100%; border-collapse: collapse; margin: 0 0 1rem 0; }

th, td { padding: 0.75rem 1rem; text-align: left; border-bottom: 1px solid #e5e7eb; }

th { font-weight: 600; color: #111827; background: #f9fafb; }

blockquote { margin: 0 0 1rem 0; padding: 1rem 1.5rem; border-left: 4px solid #2563eb; background: #f9fafb; border-radius: 0 0.5rem 0.5rem 0; }
blockquote p:last-child { margin-bottom: 0; }

hr { border: none; height: 1px; background: #e5e7eb; margin: 2rem 0; }

::selection { background: rgba(37, 99, 235, 0.2); color: #111827; }

::-moz-selection { background: rgba(37, 99, 235, 0.2); color: #111827; }

:focus { outline: 3px solid #2563eb; outline-offset: 2px; border-radius: 0.125rem; }

:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2); }

:focus:not(:focus-visible) { outline: none; }

@media (prefers-reduced-motion: no-preference) { :focus-visible { transition: outline-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; } }
@media (prefers-contrast: high) { :focus-visible { outline: 4px solid; outline-color: Highlight; box-shadow: 0 0 0 2px HighlightText; }
  a:focus-visible { outline-color: LinkText; } }
button:focus-visible, .btn:focus-visible, .search-btn:focus-visible, a.btn:focus-visible, a.search-btn:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2); }

input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid #2563eb; outline-offset: 1px; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1); }

.sr-only, .skip-links .skip-link:not(:focus) { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

.sr-only-focusable:focus, .sr-only-focusable:active { position: static !important; width: auto !important; height: auto !important; padding: inherit !important; margin: inherit !important; overflow: visible !important; clip: auto !important; white-space: inherit !important; }

.skip-link { position: absolute; top: -48px; left: 1rem; background: #2563eb; color: white; padding: 0.75rem 1.5rem; text-decoration: none; border-radius: 0.5rem; z-index: 1070; font-weight: 600; font-size: 0.875rem; transition: top 0.2s ease; }
.skip-link:focus { top: 1rem; outline: 3px solid white; outline-offset: 2px; }
.skip-link:hover { background: #1e40af; text-decoration: underline; }

.skip-links { position: absolute; top: 0; left: 0; z-index: 1070; }
.skip-links .skip-link { display: block; margin-bottom: 0.5rem; }

@media (prefers-reduced-motion: reduce) { .skip-link { transition: none; } }
[class^="icon-"], [class*=" icon-"] { display: inline-block; width: 1em; height: 1em; vertical-align: middle; background-size: contain; background-repeat: no-repeat; background-position: center; }

.icon-windows { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230078d4'%3E%3Cpath d='M0 3.449L9.75 2.1v9.451H0m10.949-9.602L24 0v11.4H10.949M0 12.6h9.75v9.451L0 20.699M10.949 12.6H24V24l-13.051-1.351'/%3E%3C/svg%3E"); }

.icon-apple { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000000'%3E%3Cpath d='M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z'/%3E%3C/svg%3E"); }

.icon-linux { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc624'%3E%3Cpath d='M12.504 0c-.155 0-.315.008-.48.021-4.226.333-3.105 4.807-3.17 6.298-.076 1.092-.3 1.953-1.05 3.02-.885 1.051-2.127 2.75-2.716 4.521-.278.832-.41 1.684-.287 2.489a.424.424 0 00-.11.135c-.26.268-.45.6-.663.839-.199.199-.485.267-.797.4-.313.136-.658.269-.864.68-.09.189-.136.394-.132.602 0 .199.027.4.055.536.058.399.116.728.04.97-.249.68-.28 1.145-.106 1.484.174.334.535.47.94.601.81.2 1.91.135 2.774.6.926.466 1.866.67 2.616.47.526-.116.97-.464 1.208-.946.587-.003 1.23-.269 2.26-.334.699-.058 1.574.267 2.577.2.025.134.063.198.114.333l.003.003c.391.778 1.113 1.132 1.884 1.071.771-.06 1.592-.536 2.257-1.306.631-.765 1.683-1.084 2.378-1.503.348-.199.629-.469.649-.853.023-.4-.2-.811-.714-1.376v-.097l-.003-.003c-.17-.2-.25-.535-.338-.926-.085-.401-.182-.786-.492-1.046h-.003c-.059-.054-.123-.067-.188-.135a.357.357 0 00-.19-.064c.431-1.278.264-2.55-.173-3.694-.533-1.41-1.465-2.638-2.175-3.483-.796-1.005-1.576-1.957-1.56-3.368.026-2.152.236-6.133-3.544-6.139zm.529 3.405h.013c.213 0 .396.062.584.198.19.135.33.332.438.533.105.259.158.459.166.724 0-.02.006-.04.006-.06v.105a.086.086 0 01-.004-.021l-.004-.024a1.807 1.807 0 01-.15.706.953.953 0 01-.213.335.71.71 0 01-.088.066c-.16.119-.335.152-.538.138-.306-.018-.608-.157-.800-.366-.131-.134-.23-.299-.262-.477-.06-.334-.052-.644.148-.943.129-.193.293-.257.462-.309.275-.08.521-.069.626.063-.024-.005-.049-.008-.075-.011-.252-.034-.494.052-.677.183-.221.157-.31.422-.25.676.061.254.249.46.532.556.504.169 1.06-.024 1.189-.36.13-.335-.101-.735-.598-.905-.497-.17-1.007.024-1.138.36-.13.335.101.735.598.905z'/%3E%3C/svg%3E"); }

.icon-download { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpolyline points='7,10 12,15 17,10'/%3E%3Cline x1='12' y1='15' x2='12' y2='3'/%3E%3C/svg%3E"); }

.icon-browser { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='18' height='18' rx='2' ry='2'/%3E%3Ccircle cx='9' cy='9' r='2'/%3E%3Cpath d='M21 15l-3.086-3.086a2 2 0 0 0-2.828 0L6 21'/%3E%3C/svg%3E"); }

.icon-video { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='23,7 16,12 23,17'/%3E%3Crect x='1' y='5' width='15' height='14' rx='2' ry='2'/%3E%3C/svg%3E"); }

.icon-queue { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='8' y1='6' x2='21' y2='6'/%3E%3Cline x1='8' y1='12' x2='21' y2='12'/%3E%3Cline x1='8' y1='18' x2='21' y2='18'/%3E%3Cline x1='3' y1='6' x2='3.01' y2='6'/%3E%3Cline x1='3' y1='12' x2='3.01' y2='12'/%3E%3Cline x1='3' y1='18' x2='3.01' y2='18'/%3E%3C/svg%3E"); }

.icon-resume { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolygon points='5,3 19,12 5,21'/%3E%3C/svg%3E"); }

.icon-platform { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232563eb' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='3' width='20' height='14' rx='2' ry='2'/%3E%3Cline x1='8' y1='21' x2='16' y2='21'/%3E%3Cline x1='12' y1='17' x2='12' y2='21'/%3E%3C/svg%3E"); }

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; } }
.container { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .container { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .container { padding-left: 2rem; padding-right: 2rem; } }

.container-sm { width: 100%; max-width: 640px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .container-sm { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .container-sm { padding-left: 2rem; padding-right: 2rem; } }

.container-lg { width: 100%; max-width: 1024px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .container-lg { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .container-lg { padding-left: 2rem; padding-right: 2rem; } }

.container-xl { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .container-xl { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .container-xl { padding-left: 2rem; padding-right: 2rem; } }

.container-2xl { width: 100%; max-width: 1536px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; }
@media (min-width: 640px) { .container-2xl { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .container-2xl { padding-left: 2rem; padding-right: 2rem; } }

.grid { display: grid; gap: 1.5rem; }

.grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }

.grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 639px) { .grid-cols-2 { grid-template-columns: 1fr; } }

.grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 639px) { .grid-cols-3 { grid-template-columns: 1fr; } }
@media (min-width: 640px) and (max-width: 1023px) { .grid-cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.grid-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 639px) { .grid-cols-4 { grid-template-columns: 1fr; } }
@media (min-width: 640px) and (max-width: 1023px) { .grid-cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.grid-auto-fit { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1.5rem; }

.grid-auto-fill { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 1.5rem; }

.flex { display: flex; }

.flex-col { flex-direction: column; }

.flex-row { flex-direction: row; }

.flex-wrap { flex-wrap: wrap; }

.flex-nowrap { flex-wrap: nowrap; }

.items-start { align-items: flex-start; }

.items-center { align-items: center; }

.items-end { align-items: flex-end; }

.items-stretch { align-items: stretch; }

.justify-start { justify-content: flex-start; }

.justify-center { justify-content: center; }

.justify-end { justify-content: flex-end; }

.justify-between { justify-content: space-between; }

.justify-around { justify-content: space-around; }

.justify-evenly { justify-content: space-evenly; }

.gap-1 { gap: 0.25rem; }

.gap-2 { gap: 0.5rem; }

.gap-3 { gap: 0.75rem; }

.gap-4 { gap: 1rem; }

.gap-5 { gap: 1.25rem; }

.gap-6 { gap: 1.5rem; }

.gap-8 { gap: 2rem; }

.gap-10 { gap: 2.5rem; }

.gap-12 { gap: 3rem; }

.gap-16 { gap: 4rem; }

.m-0 { margin: 0; }

.m-1 { margin: 0.25rem; }

.m-2 { margin: 0.5rem; }

.m-3 { margin: 0.75rem; }

.m-4 { margin: 1rem; }

.m-6 { margin: 1.5rem; }

.m-8 { margin: 2rem; }

.mt-0 { margin-top: 0; }

.mt-1 { margin-top: 0.25rem; }

.mt-2 { margin-top: 0.5rem; }

.mt-3 { margin-top: 0.75rem; }

.mt-4 { margin-top: 1rem; }

.mt-6 { margin-top: 1.5rem; }

.mt-8 { margin-top: 2rem; }

.mt-12 { margin-top: 3rem; }

.mt-16 { margin-top: 4rem; }

.mb-0 { margin-bottom: 0; }

.mb-1 { margin-bottom: 0.25rem; }

.mb-2 { margin-bottom: 0.5rem; }

.mb-3 { margin-bottom: 0.75rem; }

.mb-4 { margin-bottom: 1rem; }

.mb-6 { margin-bottom: 1.5rem; }

.mb-8 { margin-bottom: 2rem; }

.mb-12 { margin-bottom: 3rem; }

.mb-16 { margin-bottom: 4rem; }

.ml-0 { margin-left: 0; }

.ml-1 { margin-left: 0.25rem; }

.ml-2 { margin-left: 0.5rem; }

.ml-3 { margin-left: 0.75rem; }

.ml-4 { margin-left: 1rem; }

.ml-6 { margin-left: 1.5rem; }

.ml-8 { margin-left: 2rem; }

.mr-0 { margin-right: 0; }

.mr-1 { margin-right: 0.25rem; }

.mr-2 { margin-right: 0.5rem; }

.mr-3 { margin-right: 0.75rem; }

.mr-4 { margin-right: 1rem; }

.mr-6 { margin-right: 1.5rem; }

.mr-8 { margin-right: 2rem; }

.mx-auto { margin-left: auto; margin-right: auto; }

.p-0 { padding: 0; }

.p-1 { padding: 0.25rem; }

.p-2 { padding: 0.5rem; }

.p-3 { padding: 0.75rem; }

.p-4 { padding: 1rem; }

.p-6 { padding: 1.5rem; }

.p-8 { padding: 2rem; }

.pt-0 { padding-top: 0; }

.pt-1 { padding-top: 0.25rem; }

.pt-2 { padding-top: 0.5rem; }

.pt-3 { padding-top: 0.75rem; }

.pt-4 { padding-top: 1rem; }

.pt-6 { padding-top: 1.5rem; }

.pt-8 { padding-top: 2rem; }

.pt-12 { padding-top: 3rem; }

.pt-16 { padding-top: 4rem; }

.pb-0 { padding-bottom: 0; }

.pb-1 { padding-bottom: 0.25rem; }

.pb-2 { padding-bottom: 0.5rem; }

.pb-3 { padding-bottom: 0.75rem; }

.pb-4 { padding-bottom: 1rem; }

.pb-6 { padding-bottom: 1.5rem; }

.pb-8 { padding-bottom: 2rem; }

.pb-12 { padding-bottom: 3rem; }

.pb-16 { padding-bottom: 4rem; }

.pl-0 { padding-left: 0; }

.pl-1 { padding-left: 0.25rem; }

.pl-2 { padding-left: 0.5rem; }

.pl-3 { padding-left: 0.75rem; }

.pl-4 { padding-left: 1rem; }

.pl-6 { padding-left: 1.5rem; }

.pl-8 { padding-left: 2rem; }

.pr-0 { padding-right: 0; }

.pr-1 { padding-right: 0.25rem; }

.pr-2 { padding-right: 0.5rem; }

.pr-3 { padding-right: 0.75rem; }

.pr-4 { padding-right: 1rem; }

.pr-6 { padding-right: 1.5rem; }

.pr-8 { padding-right: 2rem; }

.w-full { width: 100%; }

.w-auto { width: auto; }

.w-fit { width: fit-content; }

.h-full { height: 100%; }

.h-auto { height: auto; }

.h-screen { height: 100vh; }

.block { display: block; }

.inline { display: inline; }

.inline-block { display: inline-block; }

.hidden { display: none; }

.relative { position: relative; }

.absolute { position: absolute; }

.fixed { position: fixed; }

.sticky { position: sticky; }

.text-left { text-align: left; }

.text-center { text-align: center; }

.text-right { text-align: right; }

.text-justify { text-align: justify; }

.text-xs { font-size: 0.75rem; }

.text-sm { font-size: 0.875rem; }

.text-base { font-size: 1rem; }

.text-lg { font-size: 1.125rem; }

.text-xl { font-size: 1.25rem; }

.text-2xl { font-size: 1.5rem; }

.text-3xl { font-size: 1.875rem; }

.text-4xl { font-size: 2.25rem; }

.font-light { font-weight: 300; }

.font-normal { font-weight: 400; }

.font-medium { font-weight: 500; }

.font-semibold { font-weight: 600; }

.font-bold { font-weight: 700; }

.text-primary { color: #111827; }

.text-secondary { color: #374151; }

.text-muted { color: #6b7280; }

.text-light { color: #9ca3af; }

.bg-primary { background-color: #ffffff; }

.bg-secondary { background-color: #f9fafb; }

.bg-tertiary { background-color: #f3f4f6; }

.border { border: 1px solid #e5e7eb; }

.border-t { border-top: 1px solid #e5e7eb; }

.border-b { border-bottom: 1px solid #e5e7eb; }

.border-l { border-left: 1px solid #e5e7eb; }

.border-r { border-right: 1px solid #e5e7eb; }

.rounded { border-radius: 0.25rem; }

.rounded-sm { border-radius: 0.125rem; }

.rounded-md { border-radius: 0.375rem; }

.rounded-lg { border-radius: 0.5rem; }

.rounded-xl { border-radius: 0.75rem; }

.rounded-2xl { border-radius: 1rem; }

.rounded-full { border-radius: 9999px; }

.shadow-sm { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }

.shadow { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); }

.shadow-md { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }

.shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }

.shadow-xl { box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }

.shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); }

@media (max-width: 639px) { .mobile\:hidden { display: none; }
  .mobile\:block { display: block; }
  .mobile\:flex { display: flex; }
  .mobile\:grid { display: grid; }
  .mobile\:text-center { text-align: center; }
  .mobile\:text-left { text-align: left; } }
@media (min-width: 640px) { .tablet\:hidden { display: none; }
  .tablet\:block { display: block; }
  .tablet\:flex { display: flex; }
  .tablet\:grid { display: grid; }
  .tablet\:text-center { text-align: center; }
  .tablet\:text-left { text-align: left; } }
@media (min-width: 1024px) { .desktop\:hidden { display: none; }
  .desktop\:block { display: block; }
  .desktop\:flex { display: flex; }
  .desktop\:grid { display: grid; }
  .desktop\:text-center { text-align: center; }
  .desktop\:text-left { text-align: left; } }
.hero { padding: 4rem 0 5rem 0; background: linear-gradient(135deg, #ffffff 0%, #f9fafb 100%); position: relative; overflow: hidden; }
@media (max-width: 639px) { .hero { padding: 3rem 0 4rem 0; } }
.hero::before { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: radial-gradient(circle at 25% 25%, rgba(37, 99, 235, 0.05) 0%, transparent 50%), radial-gradient(circle at 75% 75%, rgba(59, 130, 246, 0.05) 0%, transparent 50%); pointer-events: none; }

.hero-content { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center; position: relative; z-index: 1; }
@media (max-width: 639px) { .hero-content { grid-template-columns: 1fr; gap: 2rem; text-align: center; } }
@media (min-width: 640px) and (max-width: 1023px) { .hero-content { gap: 2rem; } }

@media (max-width: 639px) { .hero-text { order: 2; } }

.hero-badge { display: flex; gap: 0.75rem; margin-bottom: 1.5rem; }
@media (max-width: 639px) { .hero-badge { justify-content: center; } }

.hero-title { font-size: 3rem; font-weight: 800; line-height: 1.25; color: #111827; margin-bottom: 1.5rem; }
@media (max-width: 639px) { .hero-title { font-size: 2.25rem; } }
@media (min-width: 640px) and (max-width: 1023px) { .hero-title { font-size: 2.25rem; } }

.hero-highlight { color: #2563eb; position: relative; }
.hero-highlight::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 3px; background: linear-gradient(90deg, #2563eb, #3b82f6); border-radius: 9999px; }

.hero-subtitle { font-size: 1.25rem; line-height: 1.625; color: #374151; margin-bottom: 2rem; }
@media (max-width: 639px) { .hero-subtitle { font-size: 1.125rem; } }

.hero-stats { display: flex; gap: 2rem; margin-bottom: 2rem; }
@media (max-width: 639px) { .hero-stats { justify-content: center; gap: 1.5rem; } }

.hero-stat { text-align: center; }

.hero-stat-number { font-size: 1.875rem; font-weight: 700; color: #2563eb; line-height: 1; }
@media (max-width: 639px) { .hero-stat-number { font-size: 1.5rem; } }

.hero-stat-label { font-size: 0.875rem; color: #6b7280; font-weight: 500; margin-top: 0.25rem; }

.hero-actions { display: flex; gap: 1rem; margin-bottom: 2rem; }
@media (max-width: 639px) { .hero-actions { flex-direction: column; align-items: center; gap: 0.75rem; } }

.hero-features { display: flex; flex-direction: column; gap: 0.75rem; }
@media (max-width: 639px) { .hero-features { align-items: center; } }

.hero-feature { display: flex; align-items: center; gap: 0.75rem; font-size: 0.875rem; color: #374151; font-weight: 500; }

.hero-feature-icon { width: 16px; height: 16px; color: #10b981; flex-shrink: 0; }

.hero-visual { position: relative; }
@media (max-width: 639px) { .hero-visual { order: 1; } }

.hero-image-container { position: relative; aspect-ratio: 4/3; border-radius: 1rem; overflow: hidden; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); background: #ffffff; }

.hero-image-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%); border: 2px dashed #d1d5db; border-radius: 1rem; padding: 2rem; text-align: center; }

.hero-placeholder-icon { width: 64px; height: 64px; color: #6b7280; margin-bottom: 1rem; }

.hero-placeholder-text h3 { font-size: 1.125rem; font-weight: 600; color: #111827; margin-bottom: 0.5rem; }
.hero-placeholder-text p { font-size: 0.875rem; color: #6b7280; margin: 0; }

.hero-floating-elements { position: absolute; top: 0; left: 0; right: 0; bottom: 0; pointer-events: none; }

.hero-floating-card { position: absolute; background: #ffffff; border-radius: 0.5rem; padding: 0.75rem 1rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); display: flex; align-items: center; gap: 0.5rem; font-size: 0.875rem; font-weight: 500; color: #111827; animation: float 6s ease-in-out infinite; }
@media (max-width: 639px) { .hero-floating-card { display: none; } }

.hero-floating-card-1 { top: 15%; right: 10%; animation-delay: 0s; }

.hero-floating-card-2 { bottom: 25%; left: 5%; animation-delay: 2s; }

.hero-floating-card-3 { top: 60%; right: 15%; animation-delay: 4s; }

.hero-floating-icon { font-size: 1.125rem; }

@keyframes float { 0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-10px); } }
.features { padding: 5rem 0; background: #ffffff; position: relative; }
@media (max-width: 639px) { .features { padding: 4rem 0; } }

.features-header { text-align: center; margin-bottom: 4rem; }
@media (max-width: 639px) { .features-header { margin-bottom: 3rem; } }

.section-title { font-size: 2.25rem; font-weight: 700; color: #111827; margin-bottom: 1rem; }
@media (max-width: 639px) { .section-title { font-size: 1.875rem; } }

.section-subtitle { font-size: 1.25rem; color: #374151; max-width: 600px; margin: 0 auto; line-height: 1.625; }
@media (max-width: 639px) { .section-subtitle { font-size: 1.125rem; } }

.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); gap: 2rem; }
@media (max-width: 639px) { .features-grid { grid-template-columns: 1fr; gap: 1.5rem; } }
@media (min-width: 640px) and (max-width: 1023px) { .features-grid { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; } }

.feature-card { background: #ffffff; border-radius: 1rem; overflow: hidden; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); position: relative; border: 1px solid #e5e7eb; }
.feature-card:hover { transform: translateY(-8px); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25); border-color: rgba(37, 99, 235, 0.2); }
.feature-card:hover .feature-screenshot .screenshot-placeholder { background: linear-gradient(135deg, rgba(37, 99, 235, 0.1) 0%, rgba(59, 130, 246, 0.1) 100%); border-color: rgba(37, 99, 235, 0.3); }
.feature-card:hover .feature-screenshot .screenshot-overlay { opacity: 1; transform: translateY(0); }
.feature-card:hover .feature-screenshot .screenshot-image { transform: scale(1.05); }
.feature-card:hover .feature-icon { background: #2563eb; color: white; transform: scale(1.1); }
.feature-card:hover .feature-action { opacity: 1; transform: translateX(0); }
.feature-card:hover .feature-action .icon-arrow-right { transform: translateX(4px); }
.feature-card:nth-child(1) { animation: fadeInUp 0.6s ease-out 0s both; }
.feature-card:nth-child(2) { animation: fadeInUp 0.6s ease-out 0.1s both; }
.feature-card:nth-child(3) { animation: fadeInUp 0.6s ease-out 0.2s both; }
.feature-card:nth-child(4) { animation: fadeInUp 0.6s ease-out 0.3s both; }
.feature-card:nth-child(5) { animation: fadeInUp 0.6s ease-out 0.4s both; }
.feature-card:nth-child(6) { animation: fadeInUp 0.6s ease-out 0.5s both; }

.feature-screenshot { position: relative; aspect-ratio: 16/10; overflow: hidden; background: #f9fafb; }

.screenshot-placeholder { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; background: linear-gradient(135deg, #f9fafb 0%, #f3f4f6 100%); border: 2px dashed #d1d5db; transition: all 0.3s ease; position: relative; }

.screenshot-icon { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; background: rgba(37, 99, 235, 0.1); border-radius: 0.75rem; color: #2563eb; font-size: 1.5rem; margin-bottom: 0.75rem; transition: all 0.3s ease; }

.screenshot-overlay { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0, 0, 0, 0.7)); padding: 1rem; opacity: 0; transform: translateY(10px); transition: all 0.3s ease; }

.screenshot-label { color: white; font-size: 0.875rem; font-weight: 500; text-align: center; display: block; }

.screenshot-image { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; display: none; }
.screenshot-image.loaded { display: block; }

.feature-content { padding: 1.5rem; }
@media (max-width: 639px) { .feature-content { padding: 1.25rem; } }

.feature-icon { width: 56px; height: 56px; background: rgba(37, 99, 235, 0.1); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; color: #2563eb; font-size: 1.5rem; margin-bottom: 1rem; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

.feature-title { font-size: 1.25rem; font-weight: 600; color: #111827; margin-bottom: 0.75rem; line-height: 1.25; }

.feature-description { color: #374151; line-height: 1.625; margin-bottom: 1rem; flex: 1; }

.feature-action { display: flex; align-items: center; gap: 0.5rem; color: #2563eb; font-size: 0.875rem; font-weight: 500; opacity: 0; transform: translateX(-10px); transition: all 0.3s ease; cursor: pointer; }
.feature-action .icon-arrow-right { font-size: 0.75rem; transition: transform 0.3s ease; }

@keyframes fadeInUp { from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); } }
.icon-download::before { content: "⬇"; }

.icon-browser::before { content: "🌐"; }

.icon-video::before { content: "🎥"; }

.icon-queue::before { content: "📋"; }

.icon-resume::before { content: "▶"; }

.icon-platform::before { content: "💻"; }

.icon-arrow-right::before { content: "→"; }

[class^="icon-"], [class*=" icon-"] { font-style: normal; font-weight: normal; line-height: 1; display: inline-block; }

.screenshot-loading { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; gap: 0.5rem; opacity: 0; transition: opacity 0.3s ease; }
.screenshot-loading.show { opacity: 1; }

.loading-spinner { width: 24px; height: 24px; border: 2px solid #e5e7eb; border-radius: 9999px; border-top-color: #2563eb; animation: spin 1s linear infinite; }

.loading-text { font-size: 0.75rem; color: #6b7280; font-weight: 500; }

.feature-tags { display: flex; gap: 0.5rem; margin-top: 0.75rem; flex-wrap: wrap; }

.feature-tag { display: inline-flex; align-items: center; padding: 0.25rem 0.5rem; background: rgba(37, 99, 235, 0.1); color: #2563eb; font-size: 0.75rem; font-weight: 500; border-radius: 9999px; transition: all 0.2s ease; }
.feature-card:hover .feature-tag { background: rgba(37, 99, 235, 0.2); transform: scale(1.05); }

.features-cta { text-align: center; margin-top: 5rem; padding: 3rem 2rem; background: linear-gradient(135deg, rgba(37, 99, 235, 0.05) 0%, rgba(59, 130, 246, 0.05) 100%); border-radius: 1rem; border: 1px solid rgba(37, 99, 235, 0.1); }
@media (max-width: 639px) { .features-cta { margin-top: 4rem; padding: 2rem 1rem; } }

.features-cta-title { font-size: 1.5rem; font-weight: 700; color: #111827; margin-bottom: 0.75rem; }
@media (max-width: 639px) { .features-cta-title { font-size: 1.25rem; } }

.features-cta-description { font-size: 1.125rem; color: #374151; margin-bottom: 1.5rem; max-width: 500px; margin-left: auto; margin-right: auto; line-height: 1.625; }
@media (max-width: 639px) { .features-cta-description { font-size: 1rem; } }

.feature-card:hover .feature-title { color: #2563eb; }
.feature-card:hover .feature-description { color: #111827; }
.feature-card:hover .feature-tags .feature-tag { animation: tagPulse 0.6s ease-in-out; }

@keyframes tagPulse { 0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); } }
@keyframes spin { to { transform: rotate(360deg); } }
@media (max-width: 639px) { .features-grid { grid-template-columns: 1fr; }
  .feature-card:hover { transform: translateY(-4px); }
  .feature-screenshot { aspect-ratio: 16/9; }
  .feature-action { opacity: 1; transform: translateX(0); }
  .feature-tags { justify-content: center; } }
@media (min-width: 640px) and (max-width: 1023px) { .features-grid { grid-template-columns: repeat(2, 1fr); } }
.home .page-heading { display: none; }

.btn, .search-btn { display: inline-flex; align-items: center; justify-content: center; border: none; border-radius: 0.5rem; font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-weight: 600; text-decoration: none; cursor: pointer; transition: all 200ms ease; white-space: nowrap; user-select: none; padding: 0.75rem 1.5rem; font-size: 0.875rem; cursor: pointer; user-select: none; }
.btn:focus, .search-btn:focus { outline: 2px solid #2563eb; outline-offset: 2px; }
.btn:disabled, .search-btn:disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }
.btn:focus-visible, .search-btn:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2); }
.btn:disabled, .search-btn:disabled, .btn[aria-disabled="true"], [aria-disabled="true"].search-btn { opacity: 0.5; cursor: not-allowed; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .btn, .search-btn { transition: none; } }
.btn:focus-visible, .search-btn:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2); }
@media (prefers-contrast: high) { .btn, .search-btn { border: 2px solid #9ca3af; } }
.btn.btn-primary, .search-btn { background: #2563eb; color: white; }
.btn.btn-primary:hover:not(:disabled), .search-btn:hover:not(:disabled) { background: #1e40af; transform: translateY(-1px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.btn.btn-primary:active, .search-btn:active { transform: translateY(0); }
.btn.btn-primary:focus-visible, .search-btn:focus-visible { outline: 3px solid white; outline-offset: 2px; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2); }
.btn.btn-secondary, .btn-secondary.search-btn { background: transparent; color: #2563eb; border: 2px solid #2563eb; }
.btn.btn-secondary:hover:not(:disabled), .btn-secondary.search-btn:hover:not(:disabled) { background: #2563eb; color: white; transform: translateY(-1px); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); }
.btn.btn-outline, .btn-outline.search-btn { background: transparent; color: #111827; border: 1px solid #d1d5db; }
.btn.btn-outline:hover:not(:disabled), .btn-outline.search-btn:hover:not(:disabled) { background: #f9fafb; border-color: #9ca3af; }
.btn.btn-ghost, .btn-ghost.search-btn { background: transparent; color: #374151; }
.btn.btn-ghost:hover:not(:disabled), .btn-ghost.search-btn:hover:not(:disabled) { background: #f9fafb; color: #111827; }
.btn.btn-success, .btn-success.search-btn { background: #10b981; color: white; }
.btn.btn-success:hover:not(:disabled), .btn-success.search-btn:hover:not(:disabled) { background: #0c8a60; transform: translateY(-1px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.btn.btn-warning, .btn-warning.search-btn { background: #f59e0b; color: white; }
.btn.btn-warning:hover:not(:disabled), .btn-warning.search-btn:hover:not(:disabled) { background: #c57f08; transform: translateY(-1px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.btn.btn-error, .btn-error.search-btn { background: #ef4444; color: white; }
.btn.btn-error:hover:not(:disabled), .btn-error.search-btn:hover:not(:disabled) { background: #eb1515; transform: translateY(-1px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.btn.btn-xs, .btn-xs.search-btn { padding: 0.25rem 0.75rem; font-size: 0.75rem; }
.btn.btn-sm, .btn-sm.search-btn { padding: 0.5rem 1rem; font-size: 0.875rem; }
.btn.btn-lg, .btn-lg.search-btn { padding: 1rem 2rem; font-size: 1.125rem; }
.btn.btn-xl, .btn-xl.search-btn { padding: 1.25rem 2.5rem; font-size: 1.25rem; }
.btn.btn-icon, .btn-icon.search-btn { gap: 0.5rem; }
.btn.btn-icon .icon, .btn-icon.search-btn .icon { width: 1em; height: 1em; }
.btn.btn-full, .btn-full.search-btn { width: 100%; }
.btn.btn-group, .btn-group.search-btn { border-radius: 0; }
.btn.btn-group:first-child, .btn-group.search-btn:first-child { border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem; }
.btn.btn-group:last-child, .btn-group.search-btn:last-child { border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; }
.btn.btn-group:not(:last-child), .btn-group.search-btn:not(:last-child) { border-right: none; }

.card, .feature-card, .docs-pagination-link { background: #ffffff; border: 1px solid #e5e7eb; border-radius: 0.75rem; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); transition: all 200ms ease; padding: 1.5rem; }
.card.card-hover:hover, .feature-card:hover, .docs-pagination-link:hover { transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); border-color: #d1d5db; }
.card.card-compact, .card-compact.feature-card, .card-compact.docs-pagination-link { padding: 1rem; }
.card.card-spacious, .card-spacious.feature-card, .card-spacious.docs-pagination-link { padding: 2rem; }
.card .card-header, .feature-card .card-header, .docs-pagination-link .card-header { margin-bottom: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #e5e7eb; }
.card .card-header .card-title, .feature-card .card-header .card-title, .docs-pagination-link .card-header .card-title { margin: 0; font-size: 1.25rem; font-weight: 600; color: #111827; }
.card .card-header .card-subtitle, .feature-card .card-header .card-subtitle, .docs-pagination-link .card-header .card-subtitle { margin: 0.25rem 0 0 0; font-size: 0.875rem; color: #6b7280; }
.card .card-body, .feature-card .card-body, .docs-pagination-link .card-body { flex: 1; }
.card .card-body p:last-child, .feature-card .card-body p:last-child, .docs-pagination-link .card-body p:last-child { margin-bottom: 0; }
.card .card-footer, .feature-card .card-footer, .docs-pagination-link .card-footer { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid #e5e7eb; display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; }
.card.card-bordered, .card-bordered.feature-card, .card-bordered.docs-pagination-link { border: 2px solid #d1d5db; }
.card.card-elevated, .card-elevated.feature-card, .card-elevated.docs-pagination-link { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
.card.card-flat, .card-flat.feature-card, .card-flat.docs-pagination-link { box-shadow: none; border: 1px solid #e5e7eb; }

.feature-card { text-align: center; height: 100%; display: flex; flex-direction: column; }
.feature-card .feature-icon { width: 48px; height: 48px; margin: 0 auto 1rem auto; background: rgba(37, 99, 235, 0.1); border-radius: 0.75rem; display: flex; align-items: center; justify-content: center; color: #2563eb; font-size: 1.5rem; }
.feature-card .feature-title { font-size: 1.125rem; font-weight: 600; margin-bottom: 0.5rem; color: #111827; }
.feature-card .feature-description { color: #374151; line-height: 1.625; flex: 1; }

.form-group { margin-bottom: 1rem; }

.form-label { display: block; margin-bottom: 0.5rem; font-weight: 500; color: #111827; font-size: 0.875rem; }

.form-input, .form-textarea, .form-select, .docs-search-input, .search-input { width: 100%; padding: 0.75rem 1rem; border: 1px solid #d1d5db; border-radius: 0.5rem; font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 1rem; line-height: 1.5; color: #111827; background: #ffffff; transition: all 200ms ease; }
.form-input::placeholder, .form-textarea::placeholder, .form-select::placeholder, .docs-search-input::placeholder, .search-input::placeholder { color: #6b7280; }
.form-input:focus, .form-textarea:focus, .form-select:focus, .docs-search-input:focus, .search-input:focus { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1); }
.form-input:disabled, .form-textarea:disabled, .form-select:disabled, .docs-search-input:disabled, .search-input:disabled { background: #f9fafb; color: #6b7280; cursor: not-allowed; }
.form-input.form-input-sm, .form-input-sm.form-textarea, .form-input-sm.form-select, .form-input-sm.docs-search-input, .form-input-sm.search-input { padding: 0.5rem 0.75rem; font-size: 0.875rem; }
.form-input.form-input-lg, .form-input-lg.form-textarea, .form-input-lg.form-select, .form-input-lg.docs-search-input, .form-input-lg.search-input { padding: 1rem 1.25rem; font-size: 1.125rem; }
.form-input.form-input-error, .form-input-error.form-textarea, .form-input-error.form-select, .form-input-error.docs-search-input, .form-input-error.search-input { border-color: #ef4444; }
.form-input.form-input-error:focus, .form-input-error.form-textarea:focus, .form-input-error.form-select:focus, .form-input-error.docs-search-input:focus, .form-input-error.search-input:focus { border-color: #ef4444; box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1); }
.form-input.form-input-success, .form-input-success.form-textarea, .form-input-success.form-select, .form-input-success.docs-search-input, .form-input-success.search-input { border-color: #10b981; }
.form-input.form-input-success:focus, .form-input-success.form-textarea:focus, .form-input-success.form-select:focus, .form-input-success.docs-search-input:focus, .form-input-success.search-input:focus { border-color: #10b981; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.1); }

.form-textarea { min-height: 120px; resize: vertical; }

.form-select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e"); background-position: right 0.75rem center; background-repeat: no-repeat; background-size: 16px 12px; padding-right: 2.5rem; appearance: none; }

.form-checkbox, .form-radio { appearance: none; width: 16px; height: 16px; border: 2px solid #d1d5db; border-radius: 0.125rem; background: #ffffff; cursor: pointer; position: relative; margin-right: 0.5rem; }
.form-checkbox:checked, .form-radio:checked { background: #2563eb; border-color: #2563eb; }
.form-checkbox:checked::after, .form-radio:checked::after { content: ''; position: absolute; top: 1px; left: 4px; width: 4px; height: 8px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.form-checkbox:focus, .form-radio:focus { outline: 2px solid #2563eb; outline-offset: 2px; }

.form-radio { border-radius: 9999px; }
.form-radio:checked::after { top: 2px; left: 2px; width: 8px; height: 8px; border: none; background: white; border-radius: 9999px; transform: none; }

.form-help { margin-top: 0.25rem; font-size: 0.75rem; color: #6b7280; }

.form-error { margin-top: 0.25rem; font-size: 0.75rem; color: #ef4444; }

.badge { display: inline-flex; align-items: center; padding: 0.25rem 0.75rem; font-size: 0.75rem; font-weight: 500; border-radius: 9999px; white-space: nowrap; }
.badge.badge-primary { background: rgba(37, 99, 235, 0.1); color: #2563eb; }
.badge.badge-secondary { background: #f9fafb; color: #374151; }
.badge.badge-success { background: rgba(16, 185, 129, 0.1); color: #085b40; }
.badge.badge-warning { background: rgba(245, 158, 11, 0.1); color: #945f06; }
.badge.badge-error { background: rgba(239, 68, 68, 0.1); color: #eb1515; }
.badge.badge-lg { padding: 0.5rem 1rem; font-size: 0.875rem; }

.alert { padding: 1rem; border-radius: 0.5rem; border: 1px solid transparent; margin-bottom: 1rem; }
.alert.alert-info { background: rgba(59, 130, 246, 0.1); border-color: rgba(59, 130, 246, 0.2); color: #094fc2; }
.alert.alert-success { background: rgba(16, 185, 129, 0.1); border-color: rgba(16, 185, 129, 0.2); color: #085b40; }
.alert.alert-warning { background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.2); color: #634004; }
.alert.alert-error { background: rgba(239, 68, 68, 0.1); border-color: rgba(239, 68, 68, 0.2); color: #eb1515; }

.spinner { display: inline-block; width: 20px; height: 20px; border: 2px solid #e5e7eb; border-radius: 9999px; border-top-color: #2563eb; animation: spin 1s ease-in-out infinite; }
.spinner.spinner-sm { width: 16px; height: 16px; }
.spinner.spinner-lg { width: 32px; height: 32px; border-width: 3px; }

@keyframes spin { to { transform: rotate(360deg); } }
.nav-tabs { display: flex; border-bottom: 1px solid #e5e7eb; margin-bottom: 1.5rem; }
.nav-tabs .nav-tab { padding: 0.75rem 1rem; text-decoration: none; color: #6b7280; border-bottom: 2px solid transparent; transition: all 200ms ease; }
.nav-tabs .nav-tab:hover { color: #111827; border-bottom-color: #d1d5db; }
.nav-tabs .nav-tab.active { color: #2563eb; border-bottom-color: #2563eb; font-weight: 500; }

.breadcrumb { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.5rem; font-size: 0.875rem; }
.breadcrumb .breadcrumb-item { color: #6b7280; }
.breadcrumb .breadcrumb-item:not(:last-child)::after { content: '/'; margin-left: 0.5rem; color: #9ca3af; }
.breadcrumb .breadcrumb-item:last-child { color: #111827; font-weight: 500; }
.breadcrumb .breadcrumb-item a { color: inherit; text-decoration: none; }
.breadcrumb .breadcrumb-item a:hover { color: #2563eb; }

.feature-ripple { position: absolute; border-radius: 50%; background: rgba(37, 99, 235, 0.3); transform: scale(0); animation: ripple 0.6s linear; pointer-events: none; z-index: 1; }

@keyframes ripple { to { transform: scale(4); opacity: 0; } }
.feature-card.animate-in { animation: slideInUp 0.6s ease-out forwards; }
.feature-card:focus { outline: 2px solid #2563eb; outline-offset: 2px; }
.feature-card:hover .feature-content { transform: translateY(-2px); }

@keyframes slideInUp { from { opacity: 0; transform: translateY(30px); }
  to { opacity: 1; transform: translateY(0); } }
@media (max-width: 639px) { .btn.mobile\:btn-full, .mobile\:btn-full.search-btn { width: 100%; }
  .card, .feature-card, .docs-pagination-link { padding: 1rem; }
  .feature-card { text-align: left; }
  .feature-card .feature-icon { margin: 0 0 0.75rem 0; }
  .feature-card:hover { transform: translateY(-2px); }
  .feature-card:hover .feature-content { transform: none; } }
entation Components .docs-layout { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; display: grid; grid-template-columns: 250px 1fr; gap: 2rem; margin-top: 2rem; }
@media (min-width: 640px) { entation Components .docs-layout { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { entation Components .docs-layout { padding-left: 2rem; padding-right: 2rem; } }
@media (max-width: 639px) { entation Components .docs-layout { grid-template-columns: 1fr; gap: 1rem; } }

@media (max-width: 639px) { .docs-sidebar { order: 2; } }

.docs-nav { position: sticky; top: 5rem; }
@media (max-width: 639px) { .docs-nav { position: static; background: #f9fafb; padding: 1rem; border-radius: 0.5rem; } }

.docs-nav-title { font-size: 1.125rem; font-weight: 600; margin-bottom: 1rem; color: #111827; }

.docs-nav-list { list-style: none; margin: 0; padding: 0; }

.docs-nav-item { margin-bottom: 0.5rem; }

.docs-nav-link { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; color: #374151; text-decoration: none; border-radius: 0.375rem; font-size: 0.875rem; transition: 150ms ease; }
.docs-nav-link:hover { background: #f9fafb; color: #111827; }
.docs-nav-link.active { background: rgba(37, 99, 235, 0.1); color: #2563eb; font-weight: 500; }

.docs-nav-icon { font-size: 1rem; opacity: 0.8; flex-shrink: 0; }

.docs-nav-footer { margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid #e5e7eb; }
.docs-nav-footer .docs-nav-help { font-size: 0.75rem; color: #6b7280; margin: 0; }
.docs-nav-footer .docs-nav-help a { color: #2563eb; text-decoration: none; }
.docs-nav-footer .docs-nav-help a:hover { text-decoration: underline; }

.docs-nav-sublist { list-style: none; margin: 0.5rem 0 0 0; padding: 0; }

.docs-nav-sublink { display: block; padding: 0.25rem 0.75rem 0.25rem 1.5rem; color: #6b7280; text-decoration: none; font-size: 0.75rem; transition: 150ms ease; }
.docs-nav-sublink:hover { color: #374151; }
.docs-nav-sublink.active { color: #2563eb; font-weight: 500; }

.docs-content { min-width: 0; }
@media (max-width: 639px) { .docs-content { order: 1; } }

.docs-header { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 1px solid #e5e7eb; }
.docs-header h1 { margin-bottom: 0.5rem; }

.docs-description { font-size: 1.125rem; color: #374151; margin: 0; line-height: 1.625; }

.docs-body h2, .docs-body h3, .docs-body h4, .docs-body h5, .docs-body h6 { margin-top: 2rem; margin-bottom: 1rem; }
.docs-body h2:first-child, .docs-body h3:first-child, .docs-body h4:first-child, .docs-body h5:first-child, .docs-body h6:first-child { margin-top: 0; }
.docs-body h2 { padding-bottom: 0.5rem; border-bottom: 1px solid #e5e7eb; }
.docs-body pre { position: relative; }
.docs-body pre::before { content: attr(data-lang); position: absolute; top: 0.5rem; right: 0.75rem; font-size: 0.75rem; color: #9ca3af; text-transform: uppercase; font-weight: 500; }
.docs-body table { font-size: 0.875rem; }
.docs-body table th { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 600; }
.docs-body .callout { padding: 1rem; border-radius: 0.5rem; margin: 1.5rem 0; border-left: 4px solid; }
.docs-body .callout.callout-info { background: rgba(59, 130, 246, 0.05); border-color: #3b82f6; }
.docs-body .callout.callout-info .callout-title { color: #3b82f6; }
.docs-body .callout.callout-warning { background: rgba(245, 158, 11, 0.05); border-color: #f59e0b; }
.docs-body .callout.callout-warning .callout-title { color: #945f06; }
.docs-body .callout.callout-success { background: rgba(16, 185, 129, 0.05); border-color: #10b981; }
.docs-body .callout.callout-success .callout-title { color: #085b40; }
.docs-body .callout.callout-error { background: rgba(239, 68, 68, 0.05); border-color: #ef4444; }
.docs-body .callout.callout-error .callout-title { color: #eb1515; }
.docs-body .callout-title { font-weight: 600; margin-bottom: 0.5rem; font-size: 0.875rem; }

.docs-footer { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid #e5e7eb; }

.docs-pagination { margin-top: 2rem; }

.docs-pagination-content { display: flex; justify-content: space-between; gap: 1rem; }
@media (max-width: 639px) { .docs-pagination-content { flex-direction: column; } }

.docs-pagination-link { padding: 1rem; text-decoration: none; color: #111827; flex: 1; max-width: 300px; }
.docs-pagination-link.docs-pagination-prev { text-align: left; }
.docs-pagination-link.docs-pagination-next { text-align: right; margin-left: auto; }
@media (max-width: 639px) { .docs-pagination-link.docs-pagination-next { margin-left: 0; } }

.docs-pagination-direction { display: block; font-size: 0.75rem; color: #6b7280; font-weight: 500; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.25rem; }

.docs-pagination-title { display: block; font-weight: 500; color: #111827; }

.download-section { padding: 4rem 0; background: linear-gradient(135deg, #ffffff 0%, #f9fafb 100%); text-align: center; }
.download-section .section-title { font-size: 2.25rem; font-weight: 700; margin-bottom: 1rem; color: #111827; }
@media (max-width: 639px) { .download-section .section-title { font-size: 1.875rem; } }
.download-section .section-subtitle { font-size: 1.125rem; color: #374151; margin-bottom: 3rem; max-width: 600px; margin-left: auto; margin-right: auto; }
@media (max-width: 639px) { .download-section .section-subtitle { font-size: 1rem; margin-bottom: 2rem; } }

.primary-download { margin-bottom: 2rem; }
.primary-download .download-btn.primary { background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%); color: white; border: none; padding: 1.5rem 2rem; font-size: 1.125rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); transform: scale(1.05); }
.primary-download .download-btn.primary:hover { transform: scale(1.08) translateY(-2px); box-shadow: 0 20px 40px rgba(37, 99, 235, 0.3); }
.primary-download .download-btn.primary .download-version { font-size: 0.875rem; opacity: 0.9; font-weight: 400; }

.download-buttons { display: flex; justify-content: center; gap: 1.5rem; margin-bottom: 3rem; flex-wrap: wrap; }
@media (max-width: 639px) { .download-buttons { flex-direction: column; align-items: center; gap: 1rem; } }

.download-btn { display: flex; align-items: center; gap: 1rem; padding: 1rem 1.5rem; background: white; border: 2px solid #e5e7eb; border-radius: 0.75rem; text-decoration: none; color: #111827; transition: all 0.3s ease; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); min-width: 200px; }
.download-btn:hover { border-color: #2563eb; transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }
.download-btn:hover .download-icon { background: rgba(37, 99, 235, 0.1); color: #2563eb; transform: scale(1.1); }
.download-btn:active { transform: translateY(-2px); }
.download-btn.detected { border-color: #2563eb; background: rgba(37, 99, 235, 0.05); }
.download-btn.detected .download-icon { background: rgba(37, 99, 235, 0.1); color: #2563eb; }
@media (max-width: 639px) { .download-btn { width: 100%; max-width: 300px; } }

.download-icon { width: 48px; height: 48px; background: #f9fafb; border-radius: 0.5rem; display: flex; align-items: center; justify-content: center; font-size: 1.5rem; color: #6b7280; transition: all 0.3s ease; flex-shrink: 0; }
.download-icon .icon-windows { color: #0078d4; }
.download-icon .icon-apple { color: #000000; }
.download-icon .icon-linux { color: #fcc624; }
.download-icon .icon-download { color: #2563eb; }

.download-info { display: flex; flex-direction: column; align-items: flex-start; text-align: left; }
.download-info .download-platform { font-weight: 600; font-size: 1rem; color: #111827; margin-bottom: 0.25rem; }
.download-info .download-label { font-size: 0.875rem; color: #374151; }
.download-info .download-version { font-size: 0.75rem; color: #6b7280; margin-top: 0.25rem; }

.installation-guides { margin: 3rem 0; max-width: 800px; margin-left: auto; margin-right: auto; text-align: left; }
.installation-guides h3 { text-align: center; font-size: 1.5rem; font-weight: 600; margin-bottom: 1.5rem; color: #111827; }

.guide-tabs { display: flex; justify-content: center; gap: 0.5rem; margin-bottom: 2rem; border-bottom: 1px solid #e5e7eb; }
@media (max-width: 639px) { .guide-tabs { flex-wrap: wrap; } }

.guide-tab { padding: 0.75rem 1.5rem; background: transparent; border: none; border-bottom: 2px solid transparent; color: #6b7280; font-weight: 500; cursor: pointer; transition: all 0.3s ease; }
.guide-tab:hover { color: #111827; border-bottom-color: #d1d5db; }
.guide-tab.active { color: #2563eb; border-bottom-color: #2563eb; }
@media (max-width: 639px) { .guide-tab { flex: 1; min-width: 80px; padding: 0.5rem 1rem; font-size: 0.875rem; } }

.guide-content { background: white; border-radius: 0.75rem; padding: 2rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); }
@media (max-width: 639px) { .guide-content { padding: 1.5rem; } }

.guide-panel { display: none; }
.guide-panel.active { display: block; animation: fadeInUp 0.3s ease-out; }
.guide-panel h4 { font-size: 1.25rem; font-weight: 600; margin-bottom: 1rem; color: #111827; display: flex; align-items: center; gap: 0.75rem; }
.guide-panel h4::before { content: ''; width: 24px; height: 24px; background-size: contain; background-repeat: no-repeat; }
.guide-panel[data-guide="windows"] h4::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%230078d4'%3E%3Cpath d='M0 3.449L9.75 2.1v9.451H0m10.949-9.602L24 0v11.4H10.949M0 12.6h9.75v9.451L0 20.699M10.949 12.6H24V24l-13.051-1.351'/%3E%3C/svg%3E"); }
.guide-panel[data-guide="macos"] h4::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000000'%3E%3Cpath d='M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z'/%3E%3C/svg%3E"); }
.guide-panel[data-guide="linux"] h4::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23fcc624'%3E%3Cpath d='M12.504 0c-.155 0-.315.008-.48.021-4.226.333-3.105 4.807-3.17 6.298-.076 1.092-.3 1.953-1.05 3.02-.885 1.051-2.127 2.75-2.716 4.521-.278.832-.41 1.684-.287 2.489a.424.424 0 00-.11.135c-.26.268-.45.6-.663.839-.199.199-.485.267-.797.4-.313.136-.658.269-.864.68-.09.189-.136.394-.132.602 0 .199.027.4.055.536.058.399.116.728.04.97-.249.68-.28 1.145-.106 1.484.174.334.535.47.94.601.81.2 1.91.135 2.774.6.926.466 1.866.67 2.616.47.526-.116.97-.464 1.208-.946.587-.003 1.23-.269 2.26-.334.699-.058 1.574.267 2.577.2.025.134.063.198.114.333l.003.003c.391.778 1.113 1.132 1.884 1.071.771-.06 1.592-.536 2.257-1.306.631-.765 1.683-1.084 2.378-1.503.348-.199.629-.469.649-.853.023-.4-.2-.811-.714-1.376v-.097l-.003-.003c-.17-.2-.25-.535-.338-.926-.085-.401-.182-.786-.492-1.046h-.003c-.059-.054-.123-.067-.188-.135a.357.357 0 00-.19-.064c.431-1.278.264-2.55-.173-3.694-.533-1.41-1.465-2.638-2.175-3.483-.796-1.005-1.576-1.957-1.56-3.368.026-2.152.236-6.133-3.544-6.139zm.529 3.405h.013c.213 0 .396.062.584.198.19.135.33.332.438.533.105.259.158.459.166.724 0-.02.006-.04.006-.06v.105a.086.086 0 01-.004-.021l-.004-.024a1.807 1.807 0 01-.15.706.953.953 0 01-.213.335.71.71 0 01-.088.066c-.16.119-.335.152-.538.138-.306-.018-.608-.157-.800-.366-.131-.134-.23-.299-.262-.477-.06-.334-.052-.644.148-.943.129-.193.293-.257.462-.309.275-.08.521-.069.626.063-.024-.005-.049-.008-.075-.011-.252-.034-.494.052-.677.183-.221.157-.31.422-.25.676.061.254.249.46.532.556.504.169 1.06-.024 1.189-.36.13-.335-.101-.735-.598-.905-.497-.17-1.007.024-1.138.36-.13.335.101.735.598.905z'/%3E%3C/svg%3E"); }
.guide-panel ol, .guide-panel ul { margin: 1rem 0; padding-left: 1.5rem; }
.guide-panel ol li, .guide-panel ul li { margin-bottom: 0.5rem; line-height: 1.625; }
.guide-panel ol li code, .guide-panel ul li code { background: #f9fafb; padding: 0.25rem 0.5rem; border-radius: 0.125rem; font-size: 0.875rem; color: #111827; }
.guide-panel p { margin: 1rem 0; line-height: 1.625; }
.guide-panel p strong { color: #111827; }

@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); } }
.code-copy-btn { position: absolute; top: 0.75rem; right: 0.75rem; background: rgba(17, 24, 39, 0.8); color: #d1d5db; border: 1px solid rgba(75, 85, 99, 0.5); border-radius: 0.375rem; padding: 0.5rem 0.75rem; font-size: 0.75rem; font-weight: 500; cursor: pointer; transition: all 0.2s ease; display: flex; align-items: center; gap: 0.25rem; z-index: 10; }
.code-copy-btn:hover { background: rgba(31, 41, 55, 0.9); color: white; border-color: rgba(107, 114, 128, 0.7); transform: translateY(-1px); }
.code-copy-btn:active { transform: translateY(0); }
.code-copy-btn svg { width: 14px; height: 14px; flex-shrink: 0; }

.docs-toc { background: #f9fafb; border-radius: 0.5rem; padding: 1.5rem; margin-bottom: 2rem; }
.docs-toc h3 { font-size: 1.125rem; font-weight: 600; margin: 0 0 1rem 0; color: #111827; }

.toc-list { list-style: none; margin: 0; padding: 0; }

.toc-item { margin-bottom: 0.5rem; }
.toc-item.toc-h3 { margin-left: 1rem; }
.toc-item.toc-h3 .toc-link { font-size: 0.875rem; color: #6b7280; }
.toc-item.toc-h4 { margin-left: 2rem; }
.toc-item.toc-h4 .toc-link { font-size: 0.75rem; color: #6b7280; }

.toc-link { display: block; padding: 0.25rem 0.5rem; color: #374151; text-decoration: none; border-radius: 0.125rem; font-size: 0.875rem; transition: all 0.2s ease; }
.toc-link:hover { background: rgba(37, 99, 235, 0.1); color: #2563eb; }
.toc-link.active { background: rgba(37, 99, 235, 0.1); color: #2563eb; font-weight: 500; border-left: 3px solid #2563eb; padding-left: calc(0.5rem - 3px); }

.docs-search { position: relative; margin-bottom: 1.5rem; }

.docs-search-input { width: 100%; padding-left: 2.5rem; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m19 19-4-4m0-7A7 7 0 1 1 1 8a7 7 0 0 1 14 0Z'/%3e%3c/svg%3e"); background-position: left 0.75rem center; background-repeat: no-repeat; background-size: 16px 16px; }
.docs-search-input::placeholder { color: #6b7280; }
.docs-search-input:focus + .docs-search-results { display: block; }

.docs-search-results { position: absolute; top: 100%; left: 0; right: 0; background: white; border: 1px solid #e5e7eb; border-radius: 0.5rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); max-height: 400px; overflow-y: auto; z-index: 50; display: none; margin-top: 0.25rem; }

.search-result { padding: 0.75rem 1rem; border-bottom: 1px solid #e5e7eb; cursor: pointer; transition: background-color 0.2s ease; }
.search-result:hover { background: #f9fafb; }
.search-result:last-child { border-bottom: none; }

.search-result-heading { font-size: 0.875rem; font-weight: 500; color: #2563eb; margin-bottom: 0.25rem; }

.search-result-snippet { font-size: 0.875rem; color: #374151; line-height: 1.625; }
.search-result-snippet mark { background: rgba(245, 158, 11, 0.3); color: #111827; padding: 0 0.25rem; border-radius: 0.125rem; }

.search-no-results { padding: 1rem; text-align: center; color: #6b7280; font-size: 0.875rem; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .lazy { transition: none !important; }
  .feature-card:hover { transform: none !important; } }
@media (prefers-contrast: high) { .btn, .search-btn { border-width: 2px; }
  .btn:focus-visible, .search-btn:focus-visible { outline: 4px solid Highlight; outline-offset: 2px; }
  .card, .feature-card, .docs-pagination-link { border: 2px solid #9ca3af; }
  .form-input, .form-textarea, .form-select, .docs-search-input, .search-input { border-width: 2px; }
  .form-input:focus-visible, .form-textarea:focus-visible, .form-select:focus-visible, .docs-search-input:focus-visible, .search-input:focus-visible { outline: 4px solid Highlight; border-color: Highlight; }
  .nav-link:focus-visible, .docs-nav-link:focus-visible, .footer-link:focus-visible { outline: 4px solid Highlight; background: HighlightText; color: Highlight; }
  .feature-card { border: 2px solid #9ca3af; }
  .feature-card:focus-visible { outline: 4px solid Highlight; border-color: Highlight; }
  .download-btn { border-width: 2px; }
  .download-btn:focus-visible { outline: 4px solid Highlight; border-color: Highlight; } }
@media print { .btn, .search-btn, .code-copy-btn, .docs-search, .docs-nav, .sw-notification { display: none !important; }
  .docs-layout { grid-template-columns: 1fr; }
  .docs-content { max-width: none; }
  pre { background: #f3f4f6 !important; color: #111827 !important; border: 1px solid #9ca3af; }
  .card, .feature-card, .docs-pagination-link { border: 1px solid #9ca3af; box-shadow: none; } }
.download-alternatives { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid #e5e7eb; }
.download-alternatives p { margin-bottom: 0.75rem; color: #6b7280; font-size: 0.875rem; }
.download-alternatives .alt-link { display: inline-block; margin: 0 0.75rem; color: #2563eb; text-decoration: none; font-weight: 500; font-size: 0.875rem; }
.download-alternatives .alt-link:hover { text-decoration: underline; }
@media (max-width: 639px) { .download-alternatives .alt-link { display: block; margin: 0.5rem 0; } }

.error-page { min-height: 80vh; display: flex; align-items: center; justify-content: center; padding: 2rem 0; }
@media (max-width: 639px) { .error-page { min-height: 70vh; padding: 1.5rem 0; } }

.error-container { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; max-width: 800px; text-align: center; padding: 2rem; }
@media (min-width: 640px) { .error-container { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .error-container { padding-left: 2rem; padding-right: 2rem; } }
@media (max-width: 639px) { .error-container { padding: 1rem; } }

.error-icon { margin-bottom: 2rem; color: rgba(239, 68, 68, 0.6); }
.error-icon svg { width: 120px; height: 120px; }
@media (max-width: 639px) { .error-icon svg { width: 80px; height: 80px; } }

.error-content { margin-bottom: 3rem; }
@media (max-width: 639px) { .error-content { margin-bottom: 2rem; } }

.error-title { font-size: 3rem; font-weight: 700; color: #111827; margin-bottom: 1rem; }
@media (max-width: 639px) { .error-title { font-size: 2.25rem; } }

.error-description { font-size: 1.125rem; color: #374151; line-height: 1.625; max-width: 600px; margin: 0 auto; }
@media (max-width: 639px) { .error-description { font-size: 1rem; } }

.error-actions { display: flex; justify-content: center; gap: 1rem; margin-bottom: 3rem; }
@media (max-width: 639px) { .error-actions { flex-direction: column; align-items: center; margin-bottom: 2rem; }
  .error-actions .btn, .error-actions .search-btn { width: 100%; max-width: 280px; } }
.error-actions .btn, .error-actions .search-btn { display: flex; align-items: center; gap: 0.5rem; }
.error-actions .btn svg, .error-actions .search-btn svg { flex-shrink: 0; }

.error-search { margin-bottom: 3rem; }
@media (max-width: 639px) { .error-search { margin-bottom: 2rem; } }
.error-search h3 { font-size: 1.25rem; font-weight: 600; color: #111827; margin-bottom: 1rem; }

.search-container { position: relative; max-width: 500px; margin: 0 auto 1rem auto; display: flex; gap: 0.5rem; }

.search-input { flex: 1; padding-right: 3rem; font-size: 1rem; }
.search-input:focus { border-color: #2563eb; box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1); }

.search-btn { padding: 0.75rem; flex-shrink: 0; }
.search-btn svg { width: 16px; height: 16px; }

.search-results { position: absolute; top: 100%; left: 0; right: 0; background: white; border: 1px solid #e5e7eb; border-radius: 0.5rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); max-height: 300px; overflow-y: auto; z-index: 50; display: none; margin-top: 0.25rem; text-align: left; }

.search-result { border-bottom: 1px solid #e5e7eb; }
.search-result:last-child { border-bottom: none; }
.search-result .result-link { display: block; padding: 0.75rem 1rem; text-decoration: none; color: #111827; transition: background-color 0.2s ease; }
.search-result .result-link:hover { background: #f9fafb; }

.result-title { font-weight: 500; color: #2563eb; margin-bottom: 0.25rem; font-size: 0.875rem; }

.result-description { font-size: 0.875rem; color: #374151; line-height: 1.625; }

.no-results { padding: 1rem; text-align: center; color: #6b7280; font-size: 0.875rem; }

.error-help { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-bottom: 3rem; text-align: left; }
@media (max-width: 639px) { .error-help { grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 2rem; } }

.help-section h3 { font-size: 1.125rem; font-weight: 600; color: #111827; margin-bottom: 1rem; text-align: center; }
@media (max-width: 639px) { .help-section h3 { text-align: left; } }

.help-links { list-style: none; margin: 0; padding: 0; }

.help-link { display: flex; align-items: center; gap: 0.75rem; padding: 0.75rem 1rem; color: #374151; text-decoration: none; border-radius: 0.5rem; transition: all 0.2s ease; margin-bottom: 0.5rem; }
.help-link:hover { background: #f9fafb; color: #111827; transform: translateX(4px); }
.help-link:hover svg { color: #2563eb; }
.help-link svg { flex-shrink: 0; color: #6b7280; transition: color 0.2s ease; }

.error-contact { padding-top: 2rem; border-top: 1px solid #e5e7eb; }
.error-contact p { font-size: 1rem; color: #374151; margin-bottom: 1rem; }

.contact-link { display: inline-flex; align-items: center; gap: 0.5rem; color: #2563eb; text-decoration: none; font-weight: 500; padding: 0.5rem 1rem; border-radius: 0.5rem; transition: all 0.2s ease; }
.contact-link:hover { background: rgba(37, 99, 235, 0.1); transform: translateY(-1px); }
.contact-link:hover svg { transform: translate(2px, -2px); }
.contact-link svg { flex-shrink: 0; transition: transform 0.2s ease; }

.error-page { display: table; width: 100%; }
.error-page .error-container { display: table-cell; vertical-align: middle; }

@supports not (display: grid) { .error-help { display: block; }
  .error-help .help-section { float: left; width: 48%; margin-right: 4%; }
  .error-help .help-section:last-child { margin-right: 0; }
  @media (max-width: 639px) { .error-help .help-section { float: none; width: 100%; margin-right: 0; margin-bottom: 1.5rem; } }
  .error-help::after { content: ''; display: table; clear: both; } }
@media (prefers-contrast: high) { .error-icon { color: #ef4444; }
  .help-link { border: 1px solid #d1d5db; }
  .help-link:hover { border-color: #2563eb; }
  .search-input { border-width: 2px; } }
@media (prefers-reduced-motion: reduce) { .help-link:hover { transform: none; }
  .contact-link:hover { transform: none; }
  .contact-link:hover svg { transform: none; } }
@media print { .error-page { min-height: auto; }
  .error-search, .search-results { display: none !important; }
  .error-actions .btn, .error-actions .search-btn { border: 2px solid #9ca3af; color: #111827 !important; background: transparent !important; }
  .help-link { color: #111827 !important; }
  .help-link::after { content: " (" attr(href) ")"; font-size: 0.75rem; color: #6b7280; } }
.focus-trap { position: relative; }
.focus-trap:focus-within { outline: 2px solid #2563eb; outline-offset: 2px; }

.skip-links { position: absolute; top: 0; left: 0; z-index: 1080; }
.skip-links .skip-link { position: absolute; top: -48px; left: 1rem; background: #2563eb; color: white; padding: 0.75rem 1.5rem; text-decoration: none; border-radius: 0.5rem; font-weight: 600; font-size: 0.875rem; transition: top 0.2s ease; white-space: nowrap; }
.skip-links .skip-link:focus { top: 1rem; outline: 3px solid white; outline-offset: 2px; }
.skip-links .skip-link:hover { background: #1e40af; text-decoration: underline; }
.skip-links .skip-link:nth-child(2) { left: calc(1rem + 180px); }
.skip-links .skip-link:nth-child(3) { left: calc(1rem + 360px); }

.sr-only, .skip-links .skip-link:not(:focus) { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

.sr-only-focusable:focus, .sr-only-focusable:active { position: static !important; width: auto !important; height: auto !important; padding: inherit !important; margin: inherit !important; overflow: visible !important; clip: auto !important; white-space: inherit !important; }

.keyboard-nav-active :focus-visible { outline: 3px solid #2563eb !important; outline-offset: 2px !important; box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2) !important; }
.keyboard-nav-active button:focus-visible, .keyboard-nav-active a:focus-visible, .keyboard-nav-active input:focus-visible, .keyboard-nav-active textarea:focus-visible, .keyboard-nav-active select:focus-visible, .keyboard-nav-active [tabindex]:focus-visible { outline: 3px solid #2563eb !important; outline-offset: 2px !important; }
.keyboard-nav-active .feature-card:focus-visible, .keyboard-nav-active .card:focus-visible, .keyboard-nav-active .feature-card:focus-visible, .keyboard-nav-active .docs-pagination-link:focus-visible { outline: 3px solid #2563eb !important; outline-offset: 2px !important; transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(37, 99, 235, 0.2) !important; }

.high-contrast { color: #111827; }
.high-contrast a { color: #1e40af; text-decoration: underline; }
.high-contrast a:hover, .high-contrast a:focus { color: #173083; text-decoration: underline; }
.high-contrast .text-muted { color: #374151; }
.high-contrast .btn-secondary { border-color: #1e40af; color: #1e40af; }
.high-contrast .btn-secondary:hover, .high-contrast .btn-secondary:focus { background: #1e40af; border-color: #1e40af; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .feature-card:hover { transform: none !important; }
  .download-btn:hover { transform: none !important; }
  .btn:hover, .search-btn:hover { transform: none !important; }
  :focus-visible { transition: outline-color 0.01ms !important; } }
@media (prefers-contrast: high) { :root { --text-primary: CanvasText; --text-secondary: CanvasText; --bg-primary: Canvas; --bg-secondary: Canvas; --border-color: CanvasText; --link-color: LinkText; --focus-color: Highlight; }
  body { background: Canvas; color: CanvasText; }
  a { color: LinkText; }
  a:focus-visible { outline: 4px solid Highlight; background: HighlightText; color: Highlight; }
  .btn, .search-btn { border: 2px solid CanvasText; background: Canvas; color: CanvasText; }
  .btn:hover, .search-btn:hover, .btn:focus, .search-btn:focus { background: CanvasText; color: Canvas; }
  .btn.btn-primary, .search-btn { background: CanvasText; color: Canvas; }
  .btn.btn-primary:hover, .search-btn:hover, .btn.btn-primary:focus, .search-btn:focus { background: Canvas; color: CanvasText; border-color: CanvasText; }
  .card, .feature-card, .docs-pagination-link, .feature-card { border: 2px solid CanvasText; background: Canvas; }
  .card:focus-visible, .feature-card:focus-visible, .docs-pagination-link:focus-visible, .feature-card:focus-visible { outline: 4px solid Highlight; border-color: Highlight; }
  input, textarea, select { border: 2px solid CanvasText; background: Canvas; color: CanvasText; }
  input:focus, textarea:focus, select:focus { outline: 4px solid Highlight; border-color: Highlight; }
  .nav-link, .docs-nav-link { color: CanvasText; }
  .nav-link:hover, .nav-link:focus, .docs-nav-link:hover, .docs-nav-link:focus { background: CanvasText; color: Canvas; }
  .nav-link.active, .docs-nav-link.active { background: CanvasText; color: Canvas; } }
@media (prefers-reduced-data: reduce) { .hero-floating-elements, .screenshot-image { display: none; }
  .hero-image-placeholder { display: flex; } }
@media (forced-colors: active) { .btn, .search-btn { forced-color-adjust: none; border: 2px solid ButtonText; background: ButtonFace; color: ButtonText; }
  .btn:hover, .search-btn:hover, .btn:focus, .search-btn:focus { background: Highlight; color: HighlightText; border-color: Highlight; }
  .card, .feature-card, .docs-pagination-link, .feature-card { forced-color-adjust: none; border: 1px solid CanvasText; background: Canvas; }
  .card:focus, .feature-card:focus, .docs-pagination-link:focus, .feature-card:focus { outline: 3px solid Highlight; }
  a { forced-color-adjust: none; color: LinkText; }
  a:visited { color: VisitedText; }
  a:focus { outline: 3px solid Highlight; background: Highlight; color: HighlightText; } }
@media (pointer: coarse) { .btn, .search-btn, .nav-link, .download-btn, .feature-card, .guide-tab { min-height: 44px; min-width: 44px; }
  .nav-list { gap: 0.5rem; }
  .download-buttons { gap: 1rem; }
  .features-grid { gap: 1.5rem; } }
@media print { body { background: white !important; color: black !important; }
  a { color: black !important; text-decoration: underline !important; }
  a[href^="http"]:after { content: " (" attr(href) ")"; font-size: 0.8em; color: #666; }
  .btn, .search-btn, .nav-toggle, .skip-links, .code-copy-btn { display: none !important; }
  h1, h2, h3, h4, h5, h6 { color: black !important; page-break-after: avoid; }
  .feature-card, .card, .feature-card, .docs-pagination-link, .guide-panel { page-break-inside: avoid; } }
[dir="rtl"] .skip-links .skip-link { left: auto; right: 1rem; }
[dir="rtl"] .skip-links .skip-link:nth-child(2) { right: calc(1rem + 180px); }
[dir="rtl"] .skip-links .skip-link:nth-child(3) { right: calc(1rem + 360px); }
[dir="rtl"] .docs-nav-icon { margin-left: 0.5rem; margin-right: 0; }
[dir="rtl"] .breadcrumb-item:not(:last-child)::after { content: '\\'; margin-right: 0.5rem; margin-left: 0; }

.error-state [aria-invalid="true"] { border-color: #ef4444; }
.error-state [aria-invalid="true"]:focus { outline-color: #ef4444; box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.2); }
.error-state .error-message { color: #ef4444; font-weight: 500; }
.error-state .error-message::before { content: "⚠ "; font-weight: bold; }

.loading-state [aria-busy="true"] { position: relative; }
.loading-state [aria-busy="true"]::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.8); display: flex; align-items: center; justify-content: center; z-index: 10; }
.loading-state .loading-spinner { border: 2px solid #e5e7eb; border-top-color: #2563eb; border-radius: 50%; width: 20px; height: 20px; animation: spin 1s linear infinite; }

.notification { position: fixed; top: 1rem; right: 1rem; z-index: 1090; max-width: 400px; padding: 1rem; border-radius: 0.5rem; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }
.notification[role="alert"] { background: #ef4444; color: white; }
.notification[role="status"] { background: #10b981; color: white; }
.notification[aria-live="polite"] { background: #3b82f6; color: white; }
.notification .notification-close { position: absolute; top: 0.5rem; right: 0.5rem; background: transparent; border: none; color: inherit; font-size: 1.125rem; cursor: pointer; padding: 0.25rem; border-radius: 0.125rem; }
.notification .notification-close:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; }

.modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); z-index: 1050; display: flex; align-items: center; justify-content: center; }
.modal-overlay .modal { background: white; border-radius: 0.75rem; padding: 2rem; max-width: 90vw; max-height: 90vh; overflow-y: auto; position: relative; }
.modal-overlay .modal:focus { outline: none; }
.modal-overlay .modal .modal-close { position: absolute; top: 1rem; right: 1rem; background: transparent; border: none; font-size: 1.25rem; cursor: pointer; padding: 0.5rem; border-radius: 0.125rem; }
.modal-overlay .modal .modal-close:focus-visible { outline: 2px solid #2563eb; outline-offset: 1px; }

.tooltip { position: relative; }
.tooltip .tooltip-content { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: #111827; color: white; padding: 0.5rem 0.75rem; border-radius: 0.375rem; font-size: 0.875rem; white-space: nowrap; z-index: 1070; opacity: 0; pointer-events: none; transition: opacity 0.2s ease; }
.tooltip .tooltip-content::after { content: ""; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 4px solid transparent; border-top-color: #111827; }
.tooltip:hover .tooltip-content, .tooltip:focus-within .tooltip-content { opacity: 1; }

@media (min-resolution: 2dppx) { body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } }
.custom-focus .nav-link:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; background: rgba(37, 99, 235, 0.1); border-radius: 0.375rem; }
.custom-focus .feature-card:focus-visible { outline: 3px solid #2563eb; outline-offset: 4px; transform: translateY(-4px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04), 0 0 0 1px rgba(37, 99, 235, 0.2); }
.custom-focus .download-btn:focus-visible { outline: 3px solid #2563eb; outline-offset: 4px; transform: translateY(-2px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05), 0 0 0 1px rgba(37, 99, 235, 0.2); }
.custom-focus .guide-tab:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; background: rgba(37, 99, 235, 0.1); }

.heading-hierarchy h1 { font-size: 2.25rem; }
.heading-hierarchy h2 { font-size: 1.875rem; }
.heading-hierarchy h3 { font-size: 1.5rem; }
.heading-hierarchy h4 { font-size: 1.25rem; }
.heading-hierarchy h5 { font-size: 1.125rem; }
.heading-hierarchy h6 { font-size: 1rem; }
.heading-hierarchy h1, .heading-hierarchy h2, .heading-hierarchy h3, .heading-hierarchy h4, .heading-hierarchy h5, .heading-hierarchy h6 { font-weight: 600; line-height: 1.25; margin-bottom: 0.75rem; }
.heading-hierarchy h1:not(:first-child), .heading-hierarchy h2:not(:first-child), .heading-hierarchy h3:not(:first-child), .heading-hierarchy h4:not(:first-child), .heading-hierarchy h5:not(:first-child), .heading-hierarchy h6:not(:first-child) { margin-top: 1.5rem; }

.no-js .search-container, .no-js .js-only, .no-js .code-copy-btn, .no-js .download-notification { display: none !important; }
.no-js .no-js-fallback { display: block !important; }
.no-js .nav-menu { display: block !important; position: static !important; background: transparent !important; box-shadow: none !important; opacity: 1 !important; visibility: visible !important; transform: none !important; }
.no-js .skip-links .skip-link { position: static !important; width: auto !important; height: auto !important; padding: 0.5rem 1rem !important; margin: 0.5rem !important; overflow: visible !important; clip: auto !important; white-space: normal !important; display: inline-block !important; }
.no-js .guide-panel { display: block !important; margin-bottom: 1.5rem; }
.no-js .guide-panel:not(:last-child) { border-bottom: 1px solid #e5e7eb; padding-bottom: 1.5rem; }
.no-js .feature-card .feature-action { opacity: 1 !important; transform: none !important; }

.ie8 * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
.ie8 .error-help { zoom: 1; }
.ie8 .error-help:after { content: ""; display: table; clear: both; }
.ie8 .help-section { float: left; width: 48%; margin-right: 4%; }
.ie8 .help-section:last-child { margin-right: 0; }
.ie8 .btn, .ie8 .search-btn { display: inline-block; zoom: 1; *display: inline; }
.ie8 .form-input, .ie8 .form-textarea, .ie8 .form-select, .ie8 .docs-search-input, .ie8 .search-input, .ie8 .search-input { behavior: url(#default#VML); }

.no-flexbox .error-actions { text-align: center; }
.no-flexbox .error-actions .btn, .no-flexbox .error-actions .search-btn { display: inline-block; margin: 0 0.5rem 1rem 0.5rem; vertical-align: top; }
.no-flexbox .help-link { display: block; zoom: 1; }
.no-flexbox .help-link svg { float: left; margin-right: 0.75rem; margin-top: 2px; }
.no-flexbox .help-link:after { content: ""; display: table; clear: both; }
.no-flexbox .contact-link { display: inline-block; zoom: 1; }
.no-flexbox .contact-link svg { vertical-align: middle; margin-left: 0.5rem; }

.no-grid .error-help .help-section { float: left; width: 48%; margin-right: 4%; }
.no-grid .error-help .help-section:last-child { margin-right: 0; }
@media (max-width: 639px) { .no-grid .error-help .help-section { float: none; width: 100%; margin-right: 0; margin-bottom: 1.5rem; } }
.no-grid .error-help:after { content: ""; display: table; clear: both; }
.no-grid .docs-layout .docs-sidebar { float: left; width: 250px; margin-right: 2rem; }
@media (max-width: 639px) { .no-grid .docs-layout .docs-sidebar { float: none; width: 100%; margin-right: 0; margin-bottom: 1rem; } }
.no-grid .docs-layout .docs-content { margin-left: 258px; }
@media (max-width: 639px) { .no-grid .docs-layout .docs-content { margin-left: 0; } }
.no-grid .docs-layout:after { content: ""; display: table; clear: both; }

@media screen\9  { .error-page { display: table; width: 100%; height: 80vh; }
  .error-page .error-container { display: table-cell; vertical-align: middle; }
  .btn, .search-btn, .card, .feature-card, .docs-pagination-link, .search-input { behavior: url(PIE.htc); }
  .error-icon { filter: alpha(opacity=60); } }
@media screen and (-ms-high-contrast: active) { .error-icon { color: windowText; }
  .help-link { border: 1px solid windowText; }
  .help-link:hover { background: highlight; color: highlightText; }
  .btn, .search-btn { border: 2px solid windowText; }
  .btn:hover, .search-btn:hover { background: highlight; color: highlightText; } }
@media print { .error-page { display: block !important; height: auto !important; }
  .error-page .error-container { display: block !important; vertical-align: baseline !important; }
  .help-link:after, .contact-link:after { content: " (" attr(href) ")"; font-size: 0.8em; color: #666; }
  .search-container, .search-results, .error-actions { display: none !important; }
  .error-help .help-section { page-break-inside: avoid; margin-bottom: 1em; } }
@media (prefers-reduced-motion: reduce) { * { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  .help-link:hover { transform: none !important; }
  .contact-link:hover { transform: none !important; }
  .contact-link:hover svg { transform: none !important; } }
@media screen { .error-title { color: #1a1a1a; }
  .error-description { color: #4a4a4a; }
  .help-link { color: #666666; }
  .help-link:hover { color: #2563eb; background-color: #f8f9fa; }
  .btn-primary, .search-btn { background-color: #2563eb; color: #ffffff; }
  .btn-primary:hover, .search-btn:hover { background-color: #1e40af; }
  .btn-secondary { background-color: transparent; color: #2563eb; border: 2px solid #2563eb; }
  .btn-secondary:hover { background-color: #2563eb; color: #ffffff; } }
@font-face { font-family: 'system-ui-fallback'; src: local("system-ui"), local("-apple-system"), local("BlinkMacSystemFont"), local("Segoe UI"), local("Roboto"), local("Helvetica Neue"), local("Arial"), local("sans-serif"); }
.no-webfonts * { font-family: 'system-ui-fallback', Arial, sans-serif !important; }

.js-error .error-search .search-container { position: relative; }
.js-error .error-search .search-container:after { content: "Search temporarily unavailable"; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: rgba(255, 255, 255, 0.9); padding: 0.5rem 1rem; border-radius: 0.375rem; font-size: 0.875rem; color: #6b7280; pointer-events: none; }
.js-error .error-search .search-input, .js-error .error-search .search-btn { opacity: 0.5; pointer-events: none; }

.enhanced-accessibility .help-link, .enhanced-accessibility .btn, .enhanced-accessibility .search-btn { min-height: 44px; min-width: 44px; padding: 0.75rem 1rem; }
.enhanced-accessibility .help-link:focus, .enhanced-accessibility .btn:focus, .enhanced-accessibility .search-btn:focus, .enhanced-accessibility .search-input:focus { outline: 3px solid #2563eb; outline-offset: 2px; }
.enhanced-accessibility .error-description { color: #2d2d2d; }
.enhanced-accessibility .help-link { color: #1a1a1a; }
.enhanced-accessibility .help-link:hover { background-color: #e6f3ff; color: #0056b3; }

@media screen and (max-width: 640px) { .no-flexbox .error-actions .btn, .no-flexbox .error-actions .search-btn { display: block; width: 100%; max-width: 280px; margin: 0 auto 1rem auto; }
  .no-grid .error-help .help-section { float: none; width: 100%; margin-right: 0; margin-bottom: 1.5rem; } }
@media screen and (max-device-width: 480px) { .error-page { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
  .search-input { font-size: 16px; }
  .btn, .search-btn { -webkit-appearance: none; border-radius: 0; } }
@media screen and (-ms-high-contrast: active) { .error-icon svg { fill: windowText; }
  .help-link { border: 1px solid; }
  .help-link:hover, .help-link:focus { background: highlight; color: highlightText; border-color: highlightText; }
  .btn, .search-btn { border: 2px solid; }
  .btn:hover, .search-btn:hover, .btn:focus, .search-btn:focus { background: highlight; color: highlightText; border-color: highlightText; } }
@media (forced-colors: active) { .error-icon { color: canvasText; }
  .help-link { border: 1px solid canvasText; color: linkText; }
  .help-link:hover, .help-link:focus { background: highlight; color: highlightText; border-color: highlightText; }
  .btn, .search-btn { border: 2px solid buttonText; background: buttonFace; color: buttonText; }
  .btn:hover, .search-btn:hover, .btn:focus, .search-btn:focus { background: highlight; color: highlightText; border-color: highlightText; }
  .search-input { border: 1px solid canvasText; background: field; color: fieldText; } }
.site-header { background: #ffffff; border-bottom: 1px solid #e5e7eb; position: sticky; top: 0; z-index: 1020; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); }
.site-header .wrapper { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; display: flex; align-items: center; justify-content: space-between; padding-top: 1rem; padding-bottom: 1rem; }
@media (min-width: 640px) { .site-header .wrapper { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .site-header .wrapper { padding-left: 2rem; padding-right: 2rem; } }

.site-branding { display: flex; align-items: center; }

.site-title { display: flex; align-items: center; text-decoration: none; color: #111827; font-weight: 700; font-size: 1.25rem; transition: 150ms ease; }
.site-title:hover { color: #2563eb; }

.site-logo { margin-right: 0.5rem; border-radius: 0.5rem; width: 32px; height: 32px; }

.site-title-text { white-space: nowrap; }

.site-nav { position: relative; }

.nav-trigger { display: none; }

.nav-toggle { display: none; cursor: pointer; padding: 0.5rem; border-radius: 0.5rem; transition: 150ms ease; background: transparent; border: none; }
.nav-toggle:hover { background: rgba(17, 24, 39, 0.05); }
.nav-toggle:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2); }

.hamburger { display: flex; flex-direction: column; width: 24px; height: 18px; justify-content: space-between; }

.hamburger-line { width: 100%; height: 2px; background: #111827; border-radius: 0.125rem; transition: 150ms ease; }

.nav-menu { display: flex; align-items: center; gap: 1.5rem; }

.nav-list { display: flex; list-style: none; margin: 0; padding: 0; gap: 1.5rem; }

.nav-item { position: relative; }

.nav-link { text-decoration: none; color: #111827; font-weight: 500; padding: 0.5rem 1rem; border-radius: 0.5rem; transition: 150ms ease; position: relative; }
.nav-link:hover { color: #2563eb; background: rgba(37, 99, 235, 0.1); }
.nav-link[aria-current="page"] { color: #2563eb; font-weight: 600; }
.nav-link[aria-current="page"]::after { content: ''; position: absolute; bottom: -2px; left: 50%; transform: translateX(-50%); width: 20px; height: 2px; background: #2563eb; border-radius: 0.125rem; }
.nav-link:focus-visible { outline: 3px solid #2563eb; outline-offset: 2px; box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.2); }

.nav-link--external::after { content: '↗'; font-size: 0.8em; margin-left: 0.25rem; opacity: 0.7; }

.nav-cta { margin-left: 1rem; }

.site-footer { background: #f9fafb; border-top: 1px solid #e5e7eb; margin-top: 6rem; padding: 4rem 0 2rem; }

.footer-content { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 3rem; margin-bottom: 3rem; }
@media (min-width: 640px) { .footer-content { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .footer-content { padding-left: 2rem; padding-right: 2rem; } }

.footer-section h2, .footer-section h3 { margin-bottom: 1rem; color: #111827; }

.footer-heading { font-size: 1.5rem; font-weight: 700; margin-bottom: 0.5rem; }

.footer-section-title { font-size: 1.125rem; font-weight: 600; margin-bottom: 1rem; }

.footer-description { color: #374151; margin-bottom: 1.5rem; line-height: 1.625; }

.footer-stats { display: flex; gap: 1rem; flex-wrap: wrap; }

.footer-stat { display: flex; align-items: center; gap: 0.5rem; text-decoration: none; color: #6b7280; font-size: 0.875rem; padding: 0.25rem 0.75rem; border-radius: 0.5rem; transition: 150ms ease; }
.footer-stat:hover { color: #2563eb; background: rgba(37, 99, 235, 0.1); }

.footer-nav-list { list-style: none; margin: 0; padding: 0; }
.footer-nav-list li { margin-bottom: 0.5rem; }

.footer-link { color: #6b7280; text-decoration: none; transition: 150ms ease; }
.footer-link:hover { color: #2563eb; }

.contact-info { margin-bottom: 1.5rem; }

.contact-item { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.75rem; font-size: 0.875rem; }

.footer-bottom { width: 100%; max-width: 1280px; margin-left: auto; margin-right: auto; padding-left: 1rem; padding-right: 1rem; border-top: 1px solid #e5e7eb; padding-top: 1.5rem; }
@media (min-width: 640px) { .footer-bottom { padding-left: 1.5rem; padding-right: 1.5rem; } }
@media (min-width: 1024px) { .footer-bottom { padding-left: 2rem; padding-right: 2rem; } }

.footer-bottom-content { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; font-size: 0.875rem; color: #6b7280; }

@media (max-width: 639px) { .site-header .wrapper { padding-top: 0.75rem; padding-bottom: 0.75rem; }
  .nav-toggle { display: block; }
  .nav-menu { position: absolute; top: 100%; right: 0; background: #ffffff; border: 1px solid #e5e7eb; border-radius: 0.75rem; box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); padding: 1.5rem; min-width: 250px; transform: translateY(-10px); opacity: 0; visibility: hidden; transition: 200ms ease; flex-direction: column; align-items: stretch; gap: 1rem; }
  .nav-trigger:checked ~ .nav-menu { transform: translateY(0); opacity: 1; visibility: visible; }
  .nav-trigger:checked ~ .nav-toggle .hamburger-line:nth-child(1) { transform: rotate(45deg) translate(6px, 6px); }
  .nav-trigger:checked ~ .nav-toggle .hamburger-line:nth-child(2) { opacity: 0; }
  .nav-trigger:checked ~ .nav-toggle .hamburger-line:nth-child(3) { transform: rotate(-45deg) translate(6px, -6px); }
  .nav-list { flex-direction: column; gap: 0.5rem; width: 100%; }
  .nav-link { display: block; padding: 0.75rem; text-align: center; border-radius: 0.5rem; }
  .nav-link[aria-current="page"]::after { display: none; }
  .nav-cta { margin-left: 0; margin-top: 1rem; text-align: center; }
  .footer-content { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom-content { flex-direction: column; text-align: center; }
  .footer-stats { justify-content: center; } }
@media (max-width: 475px) { .site-title-text { display: none; }
  .nav-menu { left: 0; right: 0; min-width: auto; } }