*{box-sizing:border-box}body{margin:0;background:#fafafa;color:#141419;font-family:system-ui,-apple-system,sans-serif;line-height:1.75}a{color:#4f46e5;text-underline-offset:4px}header,footer,main{max-width:1120px;margin:auto;padding:24px}header{display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid #ddd}header a{text-decoration:none;font-weight:650}nav{display:flex;gap:20px}.intro{padding:42px 0 28px}.eyebrow{font:12px monospace;letter-spacing:.08em;color:#666}h1{font-size:clamp(34px,5vw,60px);line-height:1.12;letter-spacing:-.04em;max-width:920px;margin:16px 0 22px}h2{font-size:28px;line-height:1.25;margin-top:42px;letter-spacing:-.02em}h3{line-height:1.3}p{margin:16px 0}.lead{font-size:19px;max-width:740px;color:#555}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.card{padding:26px;border:1px solid #ddd;border-radius:18px;background:white}.card h2{font-size:25px;margin:12px 0}.card a{text-decoration:none}.article{max-width:760px}.contents{background:#f0f0f6;padding:20px 24px;border-radius:16px}.contents ol{padding-left:20px}.contents a{display:inline-block;padding:4px 0}.meta{color:#666;font-size:13px}.cta{margin:40px 0;padding:24px;background:#eeedff;border-radius:18px}.sources{font-size:14px}footer{border-top:1px solid #ddd;margin-top:40px;font-size:14px}.related{display:flex;flex-wrap:wrap;gap:16px}a:focus-visible{outline:2px solid #4f46e5;outline-offset:4px}@media(max-width:600px){main,header,footer{padding:20px}.cards{grid-template-columns:1fr}.intro{padding-top:26px}h2{font-size:25px}nav{gap:14px}.lead{font-size:17px}}@media(prefers-color-scheme:dark){body{background:#0a0d14;color:#f4f4f5}.card{background:#111620;border-color:#30343c}a{color:#a9a4ff}.lead,.meta,.eyebrow{color:#b0b3bf}.contents,.cta{background:#171b2b}header,footer{border-color:#30343c}}
:root{--page:#090d15;--panel:#101726;--ink:#f8fafc;--muted:#94a3b8;--line:rgba(148,163,184,.17);--accent:#a5a0ff}
html[data-theme="light"]{--page:#fff;--panel:#f8f8fb;--ink:#0b0b0c;--muted:#71717a;--line:#e4e4e7;--accent:#4f46e5}
body{background:var(--page);color:var(--ink);font-family:'Plus Jakarta Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--accent)}header,footer{border-color:var(--line)}header{align-items:center;position:sticky;top:0;background:var(--page);z-index:5}nav{align-items:center;font-size:13px}header>a{color:var(--ink)}.eyebrow,.meta{font-family:'JetBrains Mono',monospace;color:var(--muted)}.lead,.card p{color:var(--muted)}.card{background:var(--panel);border-color:var(--line);border-radius:20px;transition:transform .2s,border-color .2s}.card:hover{transform:translateY(-4px);border-color:var(--accent)}.card h2 a{color:var(--ink)}.contents,.cta{background:var(--panel);border:1px solid var(--line)}.article{margin-inline:auto}.intro{padding-block:56px 32px}h1{font-weight:750}footer{color:var(--muted)}.blog-theme-toggle{width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:var(--panel);color:var(--ink);font-size:20px;cursor:pointer}section[id]{scroll-margin-top:90px}@media(max-width:600px){header{gap:10px;font-size:12px}nav{gap:12px;font-size:12px}.intro{padding-block:30px 22px}}@media(prefers-reduced-motion:reduce){.card{transition:none}.card:hover{transform:none}}

.site-brand-logo{display:inline-flex;background:#fff;border-radius:10px;padding:2px 6px;align-items:center}.site-brand-logo img{display:block;width:140px;height:47px;object-fit:contain}@media(max-width:600px){.site-brand-logo img{width:110px;height:37px}}

/* Transparent animated emblem, without a rectangular logo plate. */
.site-brand-logo { background: transparent !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
.site-brand-logo img { width: 64px !important; height: 64px !important; object-fit: contain; animation: emblem-float 4s ease-in-out infinite; transition: filter .25s; }
.header-brand-logo img { width: 64px !important; height: 64px !important; }
html.dark .site-brand-logo img, html[data-theme="dark"] .site-brand-logo img { filter: drop-shadow(0 0 1px #c4b5fd) drop-shadow(0 0 7px rgba(99,102,241,.25)); }
.site-brand-logo:hover img { animation-play-state: paused; filter: drop-shadow(0 0 8px rgba(99,102,241,.55)); }
@keyframes emblem-float { 0%,100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-3px) rotate(3deg); } }
@media(max-width:639px) { .header-brand-logo img { width: 44px !important; height: 44px !important; } }
@media(prefers-reduced-motion:reduce) { .site-brand-logo img { animation: none; } }

/* Four vector pieces assemble into the original logo. */
.site-brand-logo .animated-brand-emblem { display: block; width: 64px; height: 64px; overflow: visible; }
.logo-piece { transform-box: fill-box; transform-origin: center; }
html.dark .logo-piece:not(.logo-piece-4), html[data-theme="dark"] .logo-piece:not(.logo-piece-4) { fill: #e4e4e7; }
.logo-piece-1 { --piece-x: -110px; --piece-y: -65px; --piece-angle: -16deg; }
.logo-piece-2 { --piece-x: 0px; --piece-y: 130px; --piece-angle: 10deg; }
.logo-piece-3 { --piece-x: 110px; --piece-y: -50px; --piece-angle: 16deg; }
.logo-piece-4 { --piece-x: 0px; --piece-y: -100px; --piece-angle: -40deg; }
.is-assembling .logo-piece { animation: logo-assemble 1.25s cubic-bezier(.22,1.25,.36,1) both; }
.is-assembling .logo-piece-2 { animation-delay: .08s; }
.is-assembling .logo-piece-3 { animation-delay: .16s; }
.is-assembling .logo-piece-4 { animation-delay: .28s; }
@keyframes logo-assemble {
  0% { opacity: 0; transform: translate(var(--piece-x),var(--piece-y)) rotate(var(--piece-angle)) scale(.85); }
  18% { opacity: 1; }
  75% { transform: translate(0,0) rotate(0) scale(1.035); }
  100% { opacity: 1; transform: translate(0,0) rotate(0) scale(1); }
}
@media(max-width:639px) { .header-brand-logo .animated-brand-emblem { width: 44px; height: 44px; } }
@media(prefers-reduced-motion:reduce) { .is-assembling .logo-piece { animation: none; } }

/* Slower orbit-to-lock choreography, shared by loading and hover. */
.is-assembling .logo-piece { animation-name: logo-orbit-lock; animation-duration: 2.7s; animation-timing-function: cubic-bezier(.22,.8,.25,1); }
.is-assembling .logo-piece-2 { animation-delay: .12s; }
.is-assembling .logo-piece-3 { animation-delay: .24s; }
.is-assembling .logo-piece-4 { animation-delay: .4s; }
@keyframes logo-orbit-lock {
  0% { opacity: 0; transform: translate(var(--piece-x),var(--piece-y)) rotate(var(--piece-angle)) scale(.55); }
  20% { opacity: 1; transform: translate(var(--piece-x),var(--piece-y)) rotate(calc(var(--piece-angle) + 35deg)) scale(.82); }
  48% { opacity: 1; transform: translate(calc(var(--piece-x) * .55),calc(var(--piece-y) * .55)) rotate(-8deg) scale(.95); }
  75% { transform: translate(0,0) rotate(0) scale(1.025); }
  87% { transform: translate(0,0) rotate(0) scale(.985); }
  100% { opacity: 1; transform: none; }
}
.brand-loading-screen { position: fixed; inset: 0; z-index: 10000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; background: #fafafa; color: #111113; transition: opacity .6s, visibility .6s; }
html.dark .brand-loading-screen, html[data-theme="dark"] .brand-loading-screen { background: #090d15; color: #e4e4e7; }
.brand-loading-stage { position: relative; width: 180px; height: 180px; display: grid; place-items: center; }
.brand-loading-stage svg { width: 130px; height: 130px; overflow: visible; position: relative; z-index: 1; }
.brand-loading-orbit { position: absolute; inset: -12px; border: 1px solid rgba(99,102,241,.15); border-top-color: #6366f1; border-radius: 50%; animation: loading-orbit 3.4s ease-in-out both; }
.brand-loading-name { font: 10px var(--font-mono,monospace); letter-spacing: .22em; }
.brand-loading-progress { width: 100px; height: 2px; background: rgba(99,102,241,.16); overflow: hidden; }
.brand-loading-progress::after { content: ''; display: block; height: 100%; background: #6366f1; transform-origin: left; animation: loading-progress 3.4s ease-in-out both; }
.brand-loading-screen.is-finished { opacity: 0; visibility: hidden; pointer-events: none; }
@keyframes loading-orbit { 0% { transform: rotate(-120deg) scale(.8); opacity: 0; } 30% { opacity: 1; } 80% { transform: rotate(220deg) scale(1); opacity: 1; } 100% { transform: rotate(270deg) scale(1.12); opacity: 0; } }
@keyframes loading-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media(prefers-reduced-motion:reduce) { .is-assembling .logo-piece { animation: none; } .brand-loading-screen { display:none; } }
/* Desktop logo cursor takes over from the loading emblem. */
.logo-cursor { position:fixed; left:0; top:0; width:30px; height:30px; z-index:20000; pointer-events:none; transform:translate(-50%,-50%); opacity:0; transition:opacity .2s; }
.logo-cursor svg { display:block; width:100%; height:100%; overflow:visible; }
.logo-cursor path:not([fill="#5146F5"]) { fill:var(--foreground,#111113); }
.logo-cursor.is-visible { opacity:1; }
.logo-cursor.is-interactive { width:38px; height:38px; }
@media(hover:hover) and (pointer:fine) { html.has-logo-cursor,html.has-logo-cursor * { cursor:none !important; } }
@media(prefers-reduced-motion:reduce) { .logo-cursor { transition:none; } }

html[data-theme="dark"] .logo-cursor path:not([fill="#5146F5"]) { fill:#e4e4e7; }

.cursor-preference { display:block; width:fit-content; margin:16px auto; padding:10px 16px; min-height:44px; border:1px solid rgba(120,120,120,.3); border-radius:999px; color:inherit; background:transparent; font:12px inherit; }
.cursor-preference:focus-visible { outline:2px solid #6366f1; outline-offset:3px; }
.brand-loading-screen { transition-duration:.35s; }
.brand-loading-screen .is-assembling .logo-piece { animation-duration:.65s; animation-delay:0s; }
.brand-loading-screen .brand-loading-progress::after { animation-duration:1s; }
@media(prefers-reduced-motion:reduce) { #faq details[open] summary::after { transform:rotate(45deg); } }

.theme-store-card{padding:0;overflow:hidden}.theme-store-card img{width:100%;height:260px;object-fit:cover;object-position:top;display:block}.theme-card-content{padding:26px}.store-toolbar,.store-card-footer{display:flex;justify-content:space-between;gap:16px;align-items:center}.store-toolbar{padding:18px 0;margin-bottom:18px;border-block:1px solid var(--line);font-size:13px;color:var(--muted)}.store-card-footer{font-size:13px;margin-top:24px}.theme-product{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;padding:30px 0;align-items:center}.theme-product>img{width:100%;height:360px;object-fit:cover;object-position:top;border-radius:20px;border:1px solid var(--line)}.store-buy-actions{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-top:24px}.store-primary{display:inline-block;padding:14px 20px;background:#5146f5;color:white;border-radius:999px;text-decoration:none}.article details{border-bottom:1px solid var(--line);padding:18px 0}.article summary{cursor:pointer;font-weight:600;min-height:32px}@media(max-width:750px){.theme-product{grid-template-columns:1fr;gap:24px}.theme-store-grid{grid-template-columns:1fr}.theme-product>img{height:260px}}
