@import "https://fonts.googleapis.com/css2?family=Crimson+Pro:wght@300;400;600&family=IBM+Plex+Mono:wght@400;500&display=swap";
:root{--bg-primary:#0a0a0a;--bg-secondary:#151515;--bg-tertiary:#1a1a1a;--bg-elevated:#202020;--accent-moss:#4a5a3f;--accent-forest:#2d3a28;--accent-bark:#3d3329;--accent-stone:#4a4a46;--text-primary:#e8e8e6;--text-secondary:#a8a8a6;--text-tertiary:#686866;--text-accent:#8a9a7f;--glow-subtle:#8a9a7f0d;--glow-medium:#8a9a7f1a;--glow-strong:#8a9a7f33;--border-subtle:#e8e8e614;--border-medium:#e8e8e61f;--border-strong:#e8e8e629;--font-serif:"Crimson Pro",serif;--font-mono:"IBM Plex Mono",monospace}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font-serif);color:var(--text-primary);background:var(--bg-primary);font-weight:300;line-height:1.7;overflow-x:hidden}body:before{content:"";background:radial-gradient(circle at 20% 30%,var(--glow-medium)0%,transparent 40%),radial-gradient(circle at 80% 70%,var(--glow-subtle)0%,transparent 50%),radial-gradient(circle at 50% 50%,var(--glow-medium)0%,transparent 60%);opacity:.4;z-index:-1;width:200%;height:200%;animation:60s ease-in-out infinite alternate ambient-drift;position:fixed;top:-50%;left:-50%}@keyframes ambient-drift{0%{transform:translate(0)scale(1)}to{transform:translate(-5%,-5%)scale(1.05)}}h1,h2,h3,h4,h5,h6{letter-spacing:-.02em;font-weight:400;line-height:1.3}h1{letter-spacing:-.03em;font-size:2.5rem;font-weight:300}h2{font-size:2rem}h3{font-size:1.5rem}p{margin-bottom:1rem}code{font-family:var(--font-mono);background:var(--bg-tertiary);color:var(--text-accent);padding:.2em .4em;font-size:.9em}pre{font-family:var(--font-mono);background:var(--bg-tertiary);border:1px solid var(--border-subtle);margin:1rem 0;padding:1rem;font-size:.875rem;overflow-x:auto}a{color:var(--text-accent);text-decoration:none;transition:color .2s}a:hover{color:var(--text-primary)}.branding-link:hover{color:var(--text-accent)!important}.footer-link:hover{color:var(--text-primary)!important}.footer-link-accent:hover{opacity:.8}.nav-link{color:var(--text-secondary);border:1px solid var(--border-subtle);background:var(--bg-secondary);align-items:center;gap:.375rem;padding:.5rem 1rem;font-size:.95rem;font-weight:400;transition:all .3s cubic-bezier(.34,1.56,.64,1);display:inline-flex;position:relative;overflow:hidden}.nav-link:before{content:"";background:var(--glow-subtle);opacity:0;transition:opacity .3s;position:absolute;inset:0}.nav-link:hover{color:var(--text-primary);border-color:var(--text-accent);background:var(--bg-tertiary);transform:translateY(-2px)}.nav-link:hover:before{opacity:1}.nav-link svg{transition:transform .3s}.nav-link:hover svg{transform:scale(1.1)rotate(-5deg)}button{font-family:var(--font-serif);cursor:pointer;color:inherit;background:0 0;border:none;padding:0;font-weight:400}.generate-button:not(:disabled):hover{box-shadow:0 4px 20px var(--glow-medium);transform:translateY(-2px);background:var(--accent-forest)!important}.generate-button:active:not(:disabled){transform:translateY(0)}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.container-narrow{max-width:800px;margin:0 auto;padding:0 2rem}.card{background:var(--bg-secondary);border:1px solid var(--border-medium);padding:2rem;transition:all .3s}.card:hover{background:var(--bg-tertiary);border-color:var(--border-strong);box-shadow:0 0 40px var(--glow-subtle)}.card-secondary{background:var(--bg-tertiary);border:1px solid var(--border-subtle)}.external-link-card:hover{border-color:var(--border-strong)}.border-color{border-color:var(--border-medium)}.waypoint-button{background:var(--bg-secondary);border:1px solid var(--border-medium);width:100%;color:var(--text-primary);text-align:left;align-items:center;gap:1rem;padding:1.25rem 1.5rem;transition:all .3s;display:flex;position:relative;overflow:hidden}.waypoint-button:before{content:"";background:linear-gradient(90deg,transparent,var(--glow-subtle),transparent);opacity:0;pointer-events:none;transition:opacity .3s;position:absolute;inset:0}.waypoint-button:hover{background:var(--bg-tertiary);border-color:var(--text-accent);transform:translate(4px)}.waypoint-button:hover:before{opacity:1}.waypoint-icon{width:24px;height:24px;color:var(--text-accent);flex-shrink:0;transition:color .3s}.waypoint-button:hover .waypoint-icon{color:var(--text-primary)}.waypoint-content{flex:1;min-width:0}.waypoint-name{margin-bottom:.25rem;font-size:1.125rem;font-weight:400}.waypoint-description{color:var(--text-secondary);font-size:.875rem}.copy-button:hover,.waypoint-button a:hover{color:var(--text-accent)!important}.loading{color:var(--text-tertiary);font-style:italic}body:after{content:"";opacity:.3;pointer-events:none;z-index:1;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E");position:fixed;inset:0}html{scroll-behavior:smooth}::selection{background:var(--accent-moss);color:var(--text-primary)}:focus-visible{outline:2px solid var(--text-accent);outline-offset:2px}.profile-stats-container{border-top:1px solid var(--border-medium);flex-direction:column;gap:1rem;padding-top:1rem;display:flex}.profile-stats-row{flex-wrap:wrap;gap:2rem;display:flex}.profile-stat-item,.profile-join-date{align-items:center;gap:.5rem;display:flex}.skeleton-shimmer{position:relative;overflow:hidden}.skeleton-shimmer:after{content:"";background:linear-gradient(110deg,transparent 0%,transparent 40%,var(--glow-medium)50%,transparent 60%,transparent 100%);animation:2.5s ease-in-out infinite skeleton-shimmer;position:absolute;inset:0;transform:translate(-100%)}@keyframes skeleton-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.skeleton-container{animation:.4s ease-out skeleton-fade-in}@keyframes skeleton-fade-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.content-fade-in{animation:.5s ease-out content-appear}@keyframes content-appear{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.feature-card-primary{background:linear-gradient(135deg,var(--bg-secondary)0%,var(--bg-tertiary)100%)}.feature-card-primary:hover{box-shadow:0 8px 60px var(--glow-medium);transform:rotate(-.5deg)translateY(-4px)!important}.feature-card-secondary:hover{box-shadow:0 4px 40px var(--glow-subtle);transform:rotate(.5deg)translateY(-2px)!important}.example-link{transition:all .4s cubic-bezier(.34,1.56,.64,1)}.example-link:hover{transform:rotate(0)translate(8px)scale(1.02)!important}.cta-card:hover{box-shadow:0 12px 80px var(--glow-strong);transform:rotate(-.2deg)scale(1.01)!important}.cta-button{position:relative;overflow:hidden}.cta-button:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1a,#0000);transition:transform .6s;position:absolute;inset:0;transform:translate(-100%)}.cta-button:hover:before{transform:translate(100%)}.cta-button:hover{box-shadow:0 4px 20px var(--glow-medium);transform:translateY(-2px);background:var(--accent-forest)!important}@keyframes float-gentle{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-10px)rotate(1deg)}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.005)}}.feature-card-primary,.feature-card-secondary{will-change:transform}@media (max-width:768px){html{font-size:14px}.container,.container-narrow{padding:0 1rem}.card{padding:1.5rem}h1{font-size:2rem}.profile-stats-row{gap:1rem}.profile-stat-item{flex:auto;min-width:0}.feature-card-primary,.feature-card-secondary,.example-link,.cta-card{transform:none!important}.feature-cards-grid{flex-direction:column!important;display:flex!important}.feature-card-primary,.feature-cards-secondary-stack{grid-column:unset!important}.examples-grid{flex-direction:column!important;gap:2rem!important;display:flex!important}.examples-heading{text-align:center;margin-bottom:1rem;grid-column:unset!important;position:static!important}.examples-links{grid-column:unset!important}@media (max-width:480px){.profile-stats-row{flex-direction:column;gap:.75rem}}}
