:root{--bg: #fafafa;--bg-secondary: #f5f5f4;--text: #171717;--text-muted: #525252;--border: #d4d4d4;--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-serif: "Cormorant Garamond", Georgia, serif;--content-width: 640px;--text-base: 1rem;--text-lg: 1.05rem;--text-sm: .9rem;--text-xs: .8rem;--line-height-body: 1.75;--line-height-tight: 1.5;--ether-bg: rgba(139, 92, 246, .12);--fire-bg: rgba(236, 72, 153, .12);--air-bg: rgba(250, 204, 21, .15);--water-bg: rgba(20, 184, 166, .12);--earth-bg: rgba(34, 197, 94, .12);--ether-text: rgb(124, 58, 237);--fire-text: rgb(219, 39, 119);--air-text: rgb(161, 98, 7);--water-text: rgb(13, 148, 136);--earth-text: rgb(22, 163, 74);--ether-medium: rgba(139, 92, 246, .5);--fire-medium: rgba(236, 72, 153, .5);--air-medium: rgba(250, 204, 21, .6);--water-medium: rgba(20, 184, 166, .5);--earth-medium: rgba(34, 197, 94, .5);--success-bg: rgba(34, 197, 94, .12);--warning-bg: rgba(250, 204, 21, .15);--error-bg: rgba(239, 68, 68, .12);--info-bg: rgba(120, 120, 120, .1);--success-text: rgb(22, 163, 74);--warning-text: rgb(161, 98, 7);--error-text: rgb(185, 28, 28);--info-text: var(--text-muted);--btn-primary-bg: #171717;--btn-primary-text: #ffffff;--btn-primary-hover: #262626;--btn-secondary-bg: transparent;--btn-secondary-border: var(--border);--btn-secondary-text: var(--text);--btn-secondary-hover-bg: var(--bg-secondary);--quadrant-in-body: rgba(236, 72, 153, .45);--quadrant-up-spirit: rgba(245, 158, 11, .55);--quadrant-out-flow: rgba(20, 184, 166, .45);--quadrant-down-matter: rgba(34, 197, 94, .45);--quadrant-meta: rgba(139, 92, 246, .45);--quadrant-default: rgba(120, 120, 120, .35);--quadrant-in-body-hover: rgba(236, 72, 153, .18);--quadrant-up-spirit-hover: rgba(245, 158, 11, .22);--quadrant-out-flow-hover: rgba(20, 184, 166, .18);--quadrant-down-matter-hover: rgba(34, 197, 94, .18);--quadrant-meta-hover: rgba(139, 92, 246, .18);--quadrant-default-hover: rgba(120, 120, 120, .12)}@media (prefers-color-scheme: dark){:root{--bg: #171717;--bg-secondary: #262626;--text: #e5e5e5;--text-muted: #a3a3a3;--border: #333333;--ether-bg: rgba(167, 139, 250, .15);--fire-bg: rgba(244, 114, 182, .15);--air-bg: rgba(250, 204, 21, .15);--water-bg: rgba(45, 212, 191, .15);--earth-bg: rgba(74, 222, 128, .15);--ether-text: rgb(196, 181, 253);--fire-text: rgb(249, 168, 212);--air-text: rgb(253, 224, 71);--water-text: rgb(94, 234, 212);--earth-text: rgb(134, 239, 172);--ether-medium: rgba(167, 139, 250, .5);--fire-medium: rgba(244, 114, 182, .5);--air-medium: rgba(250, 204, 21, .55);--water-medium: rgba(45, 212, 191, .5);--earth-medium: rgba(74, 222, 128, .5);--success-bg: rgba(74, 222, 128, .15);--warning-bg: rgba(250, 204, 21, .15);--error-bg: rgba(248, 113, 113, .15);--info-bg: rgba(160, 160, 160, .1);--success-text: rgb(134, 239, 172);--warning-text: rgb(253, 224, 71);--error-text: rgb(252, 165, 165);--info-text: var(--text-muted);--btn-primary-bg: #e5e5e5;--btn-primary-text: #171717;--btn-primary-hover: #d4d4d4;--quadrant-in-body: rgba(244, 114, 182, .45);--quadrant-up-spirit: rgba(250, 204, 21, .5);--quadrant-out-flow: rgba(45, 212, 191, .45);--quadrant-down-matter: rgba(74, 222, 128, .45);--quadrant-meta: rgba(167, 139, 250, .45);--quadrant-default: rgba(160, 160, 160, .35);--quadrant-in-body-hover: rgba(244, 114, 182, .18);--quadrant-up-spirit-hover: rgba(250, 204, 21, .2);--quadrant-out-flow-hover: rgba(45, 212, 191, .18);--quadrant-down-matter-hover: rgba(74, 222, 128, .18);--quadrant-meta-hover: rgba(167, 139, 250, .18);--quadrant-default-hover: rgba(160, 160, 160, .12)}}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--line-height-body);letter-spacing:-.01em;-webkit-font-smoothing:antialiased;min-height:100vh}.site-nav{position:fixed;top:0;left:0;right:0;z-index:1000;background:#fafafaeb;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,.06);padding:0 24px;height:52px;display:flex;align-items:center;justify-content:center}@media (prefers-color-scheme: dark){.site-nav{background:#171717eb;border-bottom:1px solid rgba(255,255,255,.06)}}.site-nav .wordmark{font-family:var(--font-serif);font-size:1.5rem;font-weight:500;font-style:italic;color:var(--text);text-decoration:none;letter-spacing:.02em;margin-right:auto}.site-nav .wordmark:hover{opacity:.6}.nav-links{display:flex;align-items:center;gap:1.5rem}.nav-links a{font-family:var(--font-sans);font-size:.9375rem;font-weight:400;color:var(--text-muted);text-decoration:none;transition:opacity .15s ease}.nav-links a:hover{opacity:.6}.nav-links a.active{color:var(--text)}.nav-links a.auth-link{padding:.375rem .75rem;border:1px solid var(--border);border-radius:4px;transition:all .15s ease}.nav-links a.auth-link:hover{background:var(--bg-secondary);opacity:1}.nav-links a.auth-link.active{background:var(--bg-secondary)}main{max-width:var(--content-width);margin:0 auto;padding:100px 24px 60px}main.wide{max-width:1200px}h1{font-family:var(--font-sans);font-size:1.75rem;font-weight:500;line-height:1.3;color:var(--text);margin:0 0 .75rem}h2{font-family:var(--font-sans);font-size:1.375rem;font-weight:500;color:var(--text);margin:2rem 0 .75rem}h3{font-family:var(--font-sans);font-size:1.125rem;font-weight:500;line-height:1.4;color:var(--text);margin:1.5rem 0 .25rem}p{margin:0 0 1rem}em,i{font-style:italic}strong,b{font-weight:600}a{color:var(--text);text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:2px;transition:text-decoration-color .15s}a:hover{text-decoration-color:var(--text)}a[data-quadrants]{text-decoration:none;background-image:var(--link-gradient);background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;transition:background-image .15s ease,background-size .15s ease}a[data-quadrants]:hover{background-image:var(--link-gradient-hover);background-size:100% 40%}blockquote{margin:1.5rem 0;padding:0;border:none;font-family:var(--font-serif);font-style:italic;font-size:1.1875rem;color:var(--text-muted)}ul,ol{margin:.75rem 0;padding-left:1.25rem}li{margin-bottom:.375rem;line-height:1.5}li::marker{color:var(--text-muted)}code{font-family:SF Mono,Menlo,monospace;font-size:.875em;background:var(--border);padding:.15em .35em;border-radius:3px}pre{background:var(--border);padding:1rem;margin:1.25rem 0;overflow-x:auto;border-radius:4px}pre code{background:none;padding:0;font-size:.8125rem}hr{display:none}::selection{background:var(--text);color:var(--bg)}@view-transition{navigation: auto;}::view-transition-old(root),::view-transition-new(root){animation-duration:.2s}.mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:8px;margin-right:-8px;flex-direction:column;justify-content:center;align-items:center;gap:5px;z-index:1001}.hamburger-line{display:block;width:22px;height:2px;background:var(--text);transition:transform .2s ease,opacity .2s ease}.mobile-menu-toggle.open .hamburger-line:nth-child(1){transform:translateY(7px) rotate(45deg)}.mobile-menu-toggle.open .hamburger-line:nth-child(2){opacity:0}.mobile-menu-toggle.open .hamburger-line:nth-child(3){transform:translateY(-7px) rotate(-45deg)}@media (max-width: 640px){html{font-size:15px}.site-nav{padding:0 16px;height:52px;flex-wrap:wrap}.site-nav .wordmark{font-size:1.375rem}.mobile-menu-toggle{display:flex}.nav-links{display:none;position:absolute;top:52px;left:0;right:0;background:#fafafafa;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,.06);padding:16px 24px 24px;flex-direction:column;gap:0}.nav-links.open{display:flex}.nav-links a{font-size:1rem;padding:12px 0;border-bottom:1px solid var(--border)}.nav-links a:last-child{border-bottom:none}main{padding:84px 16px 40px}}@media (max-width: 640px) and (prefers-color-scheme: dark){.nav-links{background:#171717fa;border-bottom:1px solid rgba(255,255,255,.06)}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}.back-to-top{position:fixed;bottom:24px;right:24px;width:44px;height:44px;border-radius:50%;background:var(--bg-secondary);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .2s ease,visibility .2s ease,background .2s ease,color .2s ease;z-index:100}.back-to-top.visible{opacity:1;visibility:visible}.back-to-top:hover{background:var(--text);color:var(--bg);border-color:var(--text)}@media (max-width: 640px){.back-to-top{bottom:16px;right:16px;width:40px;height:40px}}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.9375rem;font-weight:500;font-family:var(--font-sans);line-height:1;text-decoration:none;border-radius:6px;cursor:pointer;transition:all .15s ease}.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text);border:1px solid var(--btn-primary-bg)}.btn-primary:hover{background:var(--btn-primary-hover);border-color:var(--btn-primary-hover)}.btn-secondary{background:var(--btn-secondary-bg);color:var(--btn-secondary-text);border:1px solid var(--btn-secondary-border)}.btn-secondary:hover{background:var(--btn-secondary-hover-bg)}.btn-ghost{background:transparent;color:var(--text-muted);border:none;padding:.5rem .75rem}.btn-ghost:hover{color:var(--text)}.element-tag{display:inline-flex;align-items:center;padding:.125rem .5rem;font-size:.75rem;font-weight:500;border-radius:10px}.element-tag.ether{background:var(--ether-bg);color:var(--ether-text)}.element-tag.fire{background:var(--fire-bg);color:var(--fire-text)}.element-tag.air{background:var(--air-bg);color:var(--air-text)}.element-tag.water{background:var(--water-bg);color:var(--water-text)}.element-tag.earth{background:var(--earth-bg);color:var(--earth-text)}.callout{padding:1rem 1.25rem;border-radius:6px;margin:1rem 0}.callout-info{background:var(--info-bg);border-left:3px solid var(--text-muted)}.callout-success{background:var(--success-bg);border-left:3px solid var(--success-text)}.callout-warning{background:var(--warning-bg);border-left:3px solid var(--warning-text)}.callout-error{background:var(--error-bg);border-left:3px solid var(--error-text)}
