:root{--fg: #000000;--bg: #ffffff;--fg-subtle: #666666;--surface: #f4f4f4;--border: #dddddd}*{box-sizing:border-box}body{margin:0;min-height:100dvh;color:var(--fg);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,sans-serif;line-height:1.7}main{max-width:40rem;margin:0 auto;padding:2rem 1.5rem 4rem}#spinner{display:flex;justify-content:center;align-items:center;min-height:500px}.embed h1{font-size:1.25rem}.embed p{color:var(--fg-subtle);font-size:.875rem}.snippet{position:relative}.snippet pre{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1rem 6rem 1rem 1rem;overflow-x:auto;font-size:.75rem;line-height:1.5}.snippet button{position:absolute;top:.5rem;right:.5rem;border:1px solid var(--border);border-radius:6px;background:var(--bg);color:var(--fg);font:inherit;font-size:.75rem;padding:.25rem .75rem;cursor:pointer}.snippet button:hover:enabled{background:var(--surface)}.snippet button:disabled{cursor:default;opacity:.5}.gif h1,.multi h1{font-size:1.25rem}.gif p,.multi p{color:var(--fg-subtle);font-size:.875rem}.multi pre{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1rem;overflow-x:auto;font-size:.75rem;line-height:1.5}.multi-demo{display:flex;align-items:flex-end;gap:2rem;padding:1rem 0}.gif-grid{display:flex;gap:1.5rem;flex-wrap:wrap}.gif-grid figure{margin:0}.gif img{display:block;border:1px solid var(--border);border-radius:8px}.gif figcaption{margin-top:.5rem;font-size:.875rem}.gif a{color:var(--fg)}
