(READ ONLY) Margin is an open annotation layer for the internet. Powered by the AT Protocol.
margin.at
extension
web
atproto
comments
Margin TOS and Privacy Policy update, effective May 1st
+357
-231
+195
-146
web/src/pages/privacy.astro
+195
-146
web/src/pages/privacy.astro
···
1
1
---
2
2
import BaseLayout from '../layouts/StaticLayout.astro';
3
+
4
+
const lastUpdated = 'April 27, 2026';
5
+
const effectiveDate = 'May 1, 2026';
6
+
7
+
const sections = [
8
+
{ id: 'overview', title: 'Overview' },
9
+
{ id: 'data-collected', title: 'Data we collect' },
10
+
{ id: 'purposes', title: 'Purposes and legal bases' },
11
+
{ id: 'recipients', title: 'Recipients and transfers' },
12
+
{ id: 'retention', title: 'Retention' },
13
+
{ id: 'extension', title: 'Browser extension' },
14
+
{ id: 'cookies', title: 'Cookies' },
15
+
{ id: 'public-content', title: 'Public content' },
16
+
{ id: 'rights', title: 'Your rights' },
17
+
{ id: 'children', title: 'Children' },
18
+
{ id: 'contact', title: 'Contact' },
19
+
];
3
20
---
4
21
5
22
<BaseLayout title="Privacy Policy - Margin" description="Margin Privacy Policy">
6
-
<div class="max-w-3xl mx-auto py-12 px-4">
7
-
<a href="/home" class="inline-flex items-center gap-2 text-sm font-medium text-surface-500 hover:text-surface-900 dark:hover:text-white transition-colors mb-8">
8
-
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>
9
-
<span>Home</span>
10
-
</a>
23
+
<div class="min-h-screen bg-surface-100 dark:bg-surface-900">
24
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 pt-10 md:pt-14 pb-20">
25
+
<a href="/home" class="inline-flex items-center gap-1.5 text-sm font-medium text-surface-500 dark:text-surface-400 hover:text-surface-900 dark:hover:text-white transition-colors mb-8">
26
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>
27
+
Back
28
+
</a>
11
29
12
-
<div class="prose prose-surface dark:prose-invert max-w-none">
13
-
<h1 class="font-display font-bold text-3xl mb-2 text-surface-900 dark:text-white">Privacy Policy</h1>
14
-
<p class="text-surface-500 dark:text-surface-400 mb-8">Last updated: April 14, 2026</p>
30
+
<div class="lg:grid lg:grid-cols-[minmax(0,1fr)_200px] lg:gap-12">
31
+
<div class="bg-white dark:bg-surface-800 rounded-2xl px-5 sm:px-8 lg:px-12 py-10 md:py-14 lg:min-w-0">
32
+
<header class="mb-12">
33
+
<p class="text-xs font-semibold text-surface-500 dark:text-surface-400 uppercase tracking-wider mb-3">Legal</p>
34
+
<h1 class="font-display font-bold text-3xl md:text-4xl text-surface-900 dark:text-white tracking-tight mb-2">Privacy Policy</h1>
35
+
<p class="text-sm text-surface-500 dark:text-surface-400">Effective {effectiveDate} · Last updated {lastUpdated}</p>
36
+
</header>
15
37
16
-
<section class="mb-8">
17
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Overview</h2>
18
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
19
-
Margin is a web annotation tool built on the AT Protocol, operated by <strong>Padding Labs LLC</strong> ("we", "our", or "us"). It lets you highlight, take notes, and bookmark any webpage. Because Margin is built on the AT Protocol, your notes are stored as records in your Personal Data Server (PDS) — you own your content and can take it with you. You must be at least 13 years old to use Margin.
20
-
</p>
21
-
</section>
38
+
<details class="lg:hidden mb-10 rounded-xl border border-surface-200 dark:border-surface-700/60 overflow-hidden">
39
+
<summary class="cursor-pointer px-4 py-3 text-xs font-semibold text-surface-500 dark:text-surface-400 uppercase tracking-wider bg-surface-50 dark:bg-surface-900/40">On this page</summary>
40
+
<ol class="px-4 py-3 space-y-0.5 text-sm">
41
+
{sections.map((s) => (
42
+
<li><a href={`#${s.id}`} class="block py-1 text-surface-600 dark:text-surface-400">{s.title}</a></li>
43
+
))}
44
+
</ol>
45
+
</details>
22
46
23
-
<section class="mb-8">
24
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Data We Collect</h2>
47
+
<div class="space-y-12 max-w-2xl">
48
+
<section id="overview" data-toc-section class="scroll-mt-6">
49
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Overview</h2>
50
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Padding Labs LLC is the controller. We process the minimum needed to run Margin and do not sell your data.</p>
51
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">This Privacy Policy describes how Padding Labs LLC ("we", "us", "our") processes personal data in connection with Margin and the Margin Personal Data Server at margin.cafe (together, the "Service"). For purposes of the EU and UK General Data Protection Regulations, we are the controller of personal data we process to operate the Service.</p>
52
+
</section>
25
53
26
-
<h3 class="text-lg font-semibold text-surface-900 dark:text-white mb-2">Account Information</h3>
27
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
28
-
When you log in with your AT Protocol account (e.g. Bluesky), we access your:
29
-
</p>
30
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
31
-
<li>Decentralized Identifier (DID)</li>
32
-
<li>Handle (username)</li>
33
-
<li>Display name, avatar, bio, and website (for showing your profile)</li>
34
-
</ul>
54
+
<section id="data-collected" data-toc-section class="scroll-mt-6">
55
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Data we collect</h2>
56
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Identity from your AT Protocol account, the content you publish, and basic usage data.</p>
57
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
58
+
<p>We process the following categories of personal data:</p>
59
+
<ul class="list-disc pl-5 space-y-1.5 marker:text-surface-400 dark:marker:text-surface-600">
60
+
<li>Account identifiers obtained from your AT Protocol identity provider, including your decentralised identifier (DID), handle, display name, avatar, biography, and website.</li>
61
+
<li>OAuth access tokens, refresh tokens, and DPoP proof keys, used to maintain your authenticated session.</li>
62
+
<li>User Content, including the URL and title of pages you annotate, the text you select, surrounding context, your note text, tags, highlight colours, replies, likes, collections, and edit history.</li>
63
+
<li>Vector embeddings of your User Content and of public AT Protocol records, and an interest profile derived from those embeddings, used to generate recommendations on the Discover page.</li>
64
+
<li>Usage data, including IP address, browser type, operating system, extension version, and product analytics events such as page views and feature interactions.</li>
65
+
<li>For accounts on margin.cafe: your email address, used for account recovery and security notices, and a salted hash of your password. We do not store passwords in plain text.</li>
66
+
<li>Any correspondence you send to <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a>.</li>
67
+
</ul>
68
+
<p>We do not knowingly process special categories of personal data (such as health, biometric, or government identification data), and ask that you do not include such information in your User Content.</p>
69
+
</div>
70
+
</section>
35
71
36
-
<h3 class="text-lg font-semibold text-surface-900 dark:text-white mb-2">Notes & Content</h3>
37
-
<p class="text-surface-700 dark:text-surface-300 mb-4">When you create a note, we store:</p>
38
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
39
-
<li>The full URL of the page you noted on</li>
40
-
<li>The page title at the time of the note</li>
41
-
<li>The text you selected (up to 5,000 characters)</li>
42
-
<li>Surrounding context around your selection (up to 500 characters before and after), used to re-locate the note on the page</li>
43
-
<li>Any text you write as part of the note</li>
44
-
<li>Tags you apply</li>
45
-
<li>Highlight color (if set)</li>
46
-
<li>Replies and likes on notes</li>
47
-
<li>Collections you create, and which notes belong to them</li>
48
-
<li>An edit history of any changes you make to your notes</li>
49
-
</ul>
72
+
<section id="purposes" data-toc-section class="scroll-mt-6">
73
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Purposes and legal bases</h2>
74
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Performance of contract for the core Service. Legitimate interests for analytics, recommendations, and security.</p>
75
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
76
+
<p>Where the GDPR or UK GDPR applies, we rely on the following legal bases under Article 6(1):</p>
77
+
<ul class="list-disc pl-5 space-y-1.5 marker:text-surface-400 dark:marker:text-surface-600">
78
+
<li><strong>Performance of contract:</strong> authenticating you, storing and synchronising your User Content, and providing the core features of the Service.</li>
79
+
<li><strong>Legitimate interests:</strong> maintaining a server-side index of public AT Protocol records, generating recommendations, conducting product analytics, preventing abuse, and improving the Service.</li>
80
+
<li><strong>Consent:</strong> for analytics cookies in jurisdictions such as the EEA and the United Kingdom. You may withdraw consent at any time.</li>
81
+
<li><strong>Legal obligation:</strong> to comply with applicable law or valid legal process.</li>
82
+
</ul>
83
+
<p>We do not sell personal data, and we do not share personal data for cross-context behavioural advertising.</p>
84
+
</div>
85
+
</section>
50
86
51
-
<h3 class="text-lg font-semibold text-surface-900 dark:text-white mb-2">Overlay Lookups (Browser Extension)</h3>
52
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
53
-
When you browse the web with the extension enabled, it checks each page for existing notes. For these lookups, the extension computes a SHA-256 hash of the page URL locally and sends only that hash to our server — <strong>the raw URL is not sent for lookups.</strong> A hash cannot be reversed to recover the original URL. You can disable overlay lookups entirely by turning off page overlays in the extension settings.
54
-
</p>
55
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
56
-
Note: when you <em>create</em> a note, the full URL is included as part of the record stored on your PDS.
57
-
</p>
87
+
<section id="recipients" data-toc-section class="scroll-mt-6">
88
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Recipients and transfers</h2>
89
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Two sub-processors. Both are based in the United States.</p>
90
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
91
+
<p>We engage the following sub-processors:</p>
92
+
<ul class="list-disc pl-5 space-y-1.5 marker:text-surface-400 dark:marker:text-surface-600">
93
+
<li><strong>OpenAI</strong> generates vector embeddings of User Content and of public AT Protocol records under its API data usage policy. OpenAI does not use API inputs to train its models.</li>
94
+
<li><strong>PostHog</strong> provides product analytics. We identify users to PostHog by DID, handle, and display name.</li>
95
+
</ul>
96
+
<p>Where personal data is transferred from the European Economic Area, the United Kingdom, or Switzerland to a country without an adequacy decision, we rely on the European Commission's Standard Contractual Clauses (Decision 2021/914), supplemented by the UK International Data Transfer Addendum or the Swiss equivalent, as applicable.</p>
97
+
<p>We may also disclose personal data where required by law, to enforce these Terms, to protect users, or in connection with a merger, acquisition, or sale, subject to commitments at least as protective as this Policy.</p>
98
+
</div>
99
+
</section>
58
100
59
-
<h3 class="text-lg font-semibold text-surface-900 dark:text-white mb-2">Recommendations</h3>
60
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
61
-
To power the Discover page, we generate vector embeddings of your notes and public documents on the AT Protocol network. These embeddings are used to build an interest profile and surface relevant content. Your interest profile is stored on our server and is not shared with other users.
62
-
</p>
63
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
64
-
Embeddings are generated via the <strong>OpenAI</strong> API. The text content of your notes and public AT Protocol documents is sent to OpenAI for this purpose. OpenAI does not use API inputs to train their models — see their <a href="https://openai.com/policies/usage-policies/" class="text-primary-600 dark:text-primary-400 hover:text-primary-700 dark:hover:text-primary-300 hover:underline" target="_blank" rel="noopener noreferrer">API data usage policy</a>. Recommendations are only generated if you have used Margin to annotate content.
65
-
</p>
101
+
<section id="retention" data-toc-section class="scroll-mt-6">
102
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Retention</h2>
103
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Only as long as necessary, with short tails for backups, logs, and analytics.</p>
104
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
105
+
<ul class="list-disc pl-5 space-y-1.5 marker:text-surface-400 dark:marker:text-surface-600">
106
+
<li>Index of User Content: while the underlying record exists on the AT Protocol. Deletions propagate within 7 days, with up to 30 days in routine backups.</li>
107
+
<li>OAuth sessions: until expiry, revocation, or 90 days of inactivity.</li>
108
+
<li>Embeddings and recommendation profile: deleted within 30 days of account deletion.</li>
109
+
<li>Product analytics events: up to 12 months.</li>
110
+
<li>Server and security logs: up to 90 days.</li>
111
+
<li>margin.cafe account data: for the life of the account, deleted within 30 days of a verified deletion request, subject to any legal retention obligations.</li>
112
+
</ul>
113
+
<p>Once a record has federated to the wider AT Protocol, third parties may retain copies outside our control even after deletion from your Personal Data Server.</p>
114
+
</div>
115
+
</section>
66
116
67
-
<h3 class="text-lg font-semibold text-surface-900 dark:text-white mb-2">Analytics</h3>
68
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
69
-
We use <strong>PostHog</strong> for product analytics to understand how Margin is used and improve the product. Analytics events — such as page views, note creation, and feature interactions — are collected on the Margin website and server. These events may include the URL of the page being noted on, your browser type, and extension version. PostHog may set cookies for this purpose. We do not use analytics to track you across other websites or share analytics data with advertisers. See PostHog's <a href="https://posthog.com/privacy" class="text-primary-600 dark:text-primary-400 hover:text-primary-700 dark:hover:text-primary-300 hover:underline" target="_blank" rel="noopener noreferrer">privacy policy</a>.
70
-
</p>
117
+
<section id="extension" data-toc-section class="scroll-mt-6">
118
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Browser extension</h2>
119
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">URLs are hashed locally before lookup. Hashing reduces, but does not eliminate, what we can infer.</p>
120
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
121
+
<p>The Margin browser extension requests the following permissions: <code class="text-[13px] px-1 py-0.5 rounded bg-surface-100 dark:bg-surface-900 font-mono">storage</code>, <code class="text-[13px] px-1 py-0.5 rounded bg-surface-100 dark:bg-surface-900 font-mono">tabs</code>, <code class="text-[13px] px-1 py-0.5 rounded bg-surface-100 dark:bg-surface-900 font-mono">cookies</code>, <code class="text-[13px] px-1 py-0.5 rounded bg-surface-100 dark:bg-surface-900 font-mono">contextMenus</code>, <code class="text-[13px] px-1 py-0.5 rounded bg-surface-100 dark:bg-surface-900 font-mono">activeTab</code>, <code class="text-[13px] px-1 py-0.5 rounded bg-surface-100 dark:bg-surface-900 font-mono">scripting</code>, and on Chrome <code class="text-[13px] px-1 py-0.5 rounded bg-surface-100 dark:bg-surface-900 font-mono">sidePanel</code>. Host access is requested for all URLs so that notes can be displayed on any page.</p>
122
+
<p>To check whether a page contains annotations, the extension normalises the URL, computes a SHA-256 hash locally, and transmits only that hash to our server. We do not receive the underlying URL during this lookup. We note for transparency that SHA-256 is a one-way function but the URL space is enumerable: a party with a list of candidate URLs can match hashes back to URLs. Hashing therefore reduces, without fully eliminating, what we can infer about your browsing. We treat URL hashes as personal data. You may disable overlays in the extension settings.</p>
123
+
<p>When you create a note, the full URL is included in the record stored on your Personal Data Server, because the URL is the subject of the annotation.</p>
124
+
</div>
125
+
</section>
71
126
72
-
<h3 class="text-lg font-semibold text-surface-900 dark:text-white mb-2">Authentication</h3>
73
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
74
-
We store your OAuth session tokens (access token, refresh token, and DPoP proof key) in our database to keep you logged in. These are used solely for authenticating requests to the AT Protocol on your behalf and expire when your session ends.
75
-
</p>
76
-
</section>
127
+
<section id="cookies" data-toc-section class="scroll-mt-6">
128
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Cookies</h2>
129
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Strictly necessary cookies for sign-in. Analytics cookies require consent in the EEA and UK.</p>
130
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">We use a session cookie to maintain your authenticated session. PostHog sets analytics cookies. In the EEA, the United Kingdom, and other jurisdictions where prior consent is required, analytics cookies load only after you opt in. You may withdraw consent at any time through the cookie controls.</p>
131
+
</section>
77
132
78
-
<section class="mb-8">
79
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">How We Use Your Data</h2>
80
-
<p class="text-surface-700 dark:text-surface-300 mb-4">Your data is used to:</p>
81
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
82
-
<li>Display your notes on webpages via the browser extension</li>
83
-
<li>Sync your content across devices</li>
84
-
<li>Show your public notes to other users on the same page</li>
85
-
<li>Enable social features like replies and likes</li>
86
-
<li>Generate personalized content recommendations on the Discover page</li>
87
-
<li>Understand product usage and improve the service</li>
88
-
</ul>
89
-
<p class="text-surface-700 dark:text-surface-300">
90
-
<strong>We do not sell your data.</strong> We do not share your data with third parties for advertising or marketing purposes.
91
-
</p>
92
-
</section>
133
+
<section id="public-content" data-toc-section class="scroll-mt-6">
134
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Public content</h2>
135
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Notes federate publicly. Federated copies may persist after you delete.</p>
136
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">Notes published through the AT Protocol are broadcast on the public firehose and may be retrieved, copied, indexed, or cached by any third party subscribing to the network. Do not include in a note any information you do not wish to be public.</p>
137
+
</section>
93
138
94
-
<section class="mb-8">
95
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">The AT Protocol & Data Portability</h2>
96
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
97
-
Margin is built on the AT Protocol. Your notes, collections, and profile are stored as records in your Personal Data Server (PDS). This means:
98
-
</p>
99
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
100
-
<li>You own your content</li>
101
-
<li>You can export your full data repository from your PDS at any time</li>
102
-
<li>Your data is portable — you can use it with other AT Protocol-compatible services</li>
103
-
<li>You can migrate your account to a different PDS without losing your content</li>
104
-
</ul>
105
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
106
-
We also maintain a server-side index of public notes to power features like search, discovery, and the extension overlay. This index is derived from the public AT Protocol firehose and is used solely to operate the service.
107
-
</p>
139
+
<section id="rights" data-toc-section class="scroll-mt-6">
140
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Your rights</h2>
141
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Access, rectification, erasure, restriction, portability, objection, and withdrawal of consent.</p>
142
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
143
+
<p>Subject to applicable law, you may exercise the following rights in respect of personal data we hold about you: access, rectification, erasure, restriction of processing, portability, objection to processing based on our legitimate interests (including profiling), and withdrawal of consent where processing is based on consent. You may also lodge a complaint with your competent supervisory authority. Your AT Protocol repository remains independently exportable from your Personal Data Server at any time.</p>
144
+
<p>To exercise these rights, contact <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a>. We will respond within the timeframes required by applicable law (one month under the GDPR, extendable by a further two months for complex requests). We may need to verify your identity. We will not discriminate against you for exercising your rights.</p>
145
+
<p>If you reside in California, the CCPA and CPRA grant additional rights, including the right to know, delete, correct, and limit the use of sensitive personal information. We do not sell or share personal information for cross-context behavioural advertising.</p>
146
+
</div>
147
+
</section>
108
148
109
-
<h3 class="text-lg font-semibold text-surface-900 dark:text-white mb-2">Margin PDS (margin.cafe)</h3>
110
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
111
-
We operate an optional Personal Data Server at <strong>margin.cafe</strong>. If you create an account there, we additionally store:
112
-
</p>
113
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
114
-
<li>Your account credentials (password is hashed and never stored in plain text)</li>
115
-
<li>Your email address (for account recovery)</li>
116
-
<li>All AT Protocol data repositories you create on this server</li>
117
-
</ul>
118
-
<p class="text-surface-700 dark:text-surface-300">
119
-
Using margin.cafe is entirely optional — Margin works with any AT Protocol PDS. You can migrate your account to a different PDS at any time using standard AT Protocol account migration.
120
-
</p>
121
-
</section>
122
-
123
-
<section class="mb-8">
124
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Public Content</h2>
125
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
126
-
Notes you create are public by default on the AT Protocol network. This means they may be visible to:
127
-
</p>
128
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
129
-
<li>Other Margin users viewing the same webpage</li>
130
-
<li>Anyone on the AT Protocol network who subscribes to public records</li>
131
-
</ul>
132
-
</section>
133
-
134
-
<section class="mb-8">
135
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Browser Extension Permissions</h2>
136
-
<p class="text-surface-700 dark:text-surface-300 mb-4">The Margin browser extension requires the following permissions:</p>
137
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
138
-
<li><strong>All URLs:</strong> To display and create notes on any webpage. Overlay lookups use a local SHA-256 hash of the URL — the raw URL is only sent when you actively create a note.</li>
139
-
<li><strong>Storage:</strong> To save your preferences and session locally</li>
140
-
<li><strong>Cookies:</strong> To maintain your logged-in session</li>
141
-
<li><strong>Tabs:</strong> To know which page you're currently viewing</li>
142
-
</ul>
143
-
</section>
149
+
<section id="children" data-toc-section class="scroll-mt-6">
150
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Children</h2>
151
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Not directed to children under 13, or under 16 in the EEA and UK.</p>
152
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">The Service is not directed to children under 13 years of age, or under 16 in the European Economic Area, the United Kingdom, or other jurisdictions with a higher age of digital consent. We do not knowingly collect personal data from such children. If you believe a child has provided us with personal data, please contact <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a> and we will take appropriate steps to delete it.</p>
153
+
</section>
144
154
145
-
<section class="mb-8">
146
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Your Rights</h2>
147
-
<p class="text-surface-700 dark:text-surface-300 mb-4">You can:</p>
148
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
149
-
<li>Delete any note or reply you've created</li>
150
-
<li>Delete your collections</li>
151
-
<li>Export your full data repository from your PDS</li>
152
-
<li>Revoke Margin's OAuth access to your account at any time</li>
153
-
<li>Request deletion of your margin.cafe account by contacting us — deletion of AT Protocol data on your PDS is governed by your PDS provider</li>
154
-
</ul>
155
-
<p class="text-surface-700 dark:text-surface-300">
156
-
To exercise any of these rights, email us at <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:text-primary-700 dark:hover:text-primary-300 hover:underline">hello@margin.at</a>.
157
-
</p>
158
-
</section>
155
+
<section id="contact" data-toc-section class="scroll-mt-6">
156
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Contact</h2>
157
+
<address class="not-italic text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
158
+
<strong class="text-surface-900 dark:text-white">Padding Labs LLC</strong><br />
159
+
<a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a>
160
+
</address>
161
+
<p class="text-[13px] text-surface-500 dark:text-surface-400 mt-4">We may amend this Policy from time to time. The "Last updated" date reflects the most recent revision. For material changes we will provide reasonable advance notice.</p>
162
+
</section>
163
+
</div>
164
+
</div>
159
165
160
-
<section class="mb-8">
161
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Contact</h2>
162
-
<p class="text-surface-700 dark:text-surface-300">
163
-
For privacy questions or concerns, contact us at <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:text-primary-700 dark:hover:text-primary-300 hover:underline">hello@margin.at</a>
164
-
</p>
165
-
</section>
166
+
<aside class="hidden lg:block">
167
+
<details class="sticky top-6 group" open>
168
+
<summary class="cursor-pointer list-none flex items-center gap-1.5 py-2 text-[11px] font-semibold text-surface-400 dark:text-surface-500 uppercase tracking-[0.12em] hover:text-surface-700 dark:hover:text-surface-200 transition-colors">
169
+
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="transition-transform group-open:rotate-90"><path d="m9 18 6-6-6-6"/></svg>
170
+
On this page
171
+
</summary>
172
+
<ol class="mt-3 space-y-0.5 text-[13px]">
173
+
{sections.map((s) => (
174
+
<li>
175
+
<a href={`#${s.id}`} data-toc-link={s.id} class="toc-link block py-1 text-surface-500 dark:text-surface-500 hover:text-surface-900 dark:hover:text-white transition-colors leading-snug">{s.title}</a>
176
+
</li>
177
+
))}
178
+
</ol>
179
+
</details>
180
+
</aside>
181
+
</div>
166
182
</div>
167
183
</div>
184
+
185
+
<script>
186
+
const links = document.querySelectorAll<HTMLAnchorElement>('[data-toc-link]');
187
+
const sections = document.querySelectorAll<HTMLElement>('[data-toc-section]');
188
+
if (links.length && sections.length) {
189
+
const setActive = (id: string) => {
190
+
links.forEach((l) => {
191
+
if (l.dataset.tocLink === id) {
192
+
l.classList.add('text-primary-600', 'dark:text-primary-400', 'font-medium');
193
+
l.classList.remove('text-surface-500', 'dark:text-surface-500');
194
+
} else {
195
+
l.classList.remove('text-primary-600', 'dark:text-primary-400', 'font-medium');
196
+
l.classList.add('text-surface-500', 'dark:text-surface-500');
197
+
}
198
+
});
199
+
};
200
+
let current = sections[0].id;
201
+
setActive(current);
202
+
const obs = new IntersectionObserver(
203
+
(entries) => {
204
+
const visible = entries
205
+
.filter((e) => e.isIntersecting)
206
+
.sort((a, b) => (a.target as HTMLElement).offsetTop - (b.target as HTMLElement).offsetTop);
207
+
if (visible.length > 0) {
208
+
current = visible[0].target.id;
209
+
setActive(current);
210
+
}
211
+
},
212
+
{ rootMargin: '-15% 0px -70% 0px', threshold: 0 }
213
+
);
214
+
sections.forEach((s) => obs.observe(s));
215
+
}
216
+
</script>
168
217
</BaseLayout>
+162
-85
web/src/pages/terms.astro
+162
-85
web/src/pages/terms.astro
···
1
1
---
2
2
import BaseLayout from '../layouts/StaticLayout.astro';
3
+
4
+
const lastUpdated = 'April 27, 2026';
5
+
const effectiveDate = 'May 1, 2026';
6
+
7
+
const sections = [
8
+
{ id: 'agreement', title: 'Agreement' },
9
+
{ id: 'eligibility', title: 'Eligibility' },
10
+
{ id: 'your-content', title: 'Your content' },
11
+
{ id: 'acceptable-use', title: 'Acceptable use' },
12
+
{ id: 'suspension', title: 'Suspension and termination' },
13
+
{ id: 'copyright', title: 'Copyright (DMCA)' },
14
+
{ id: 'disclaimers', title: 'Disclaimers and liability' },
15
+
{ id: 'indemnity', title: 'Indemnity' },
16
+
{ id: 'governing-law', title: 'Governing law and changes' },
17
+
{ id: 'contact', title: 'Contact' },
18
+
];
3
19
---
4
20
5
21
<BaseLayout title="Terms of Service - Margin" description="Margin Terms of Service">
6
-
<div class="max-w-3xl mx-auto py-12 px-4">
7
-
<a href="/home" class="inline-flex items-center gap-2 text-sm font-medium text-surface-500 hover:text-surface-900 dark:hover:text-white transition-colors mb-8">
8
-
<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>
9
-
<span>Home</span>
10
-
</a>
22
+
<div class="min-h-screen bg-surface-100 dark:bg-surface-900">
23
+
<div class="max-w-7xl mx-auto px-4 sm:px-6 pt-10 md:pt-14 pb-20">
24
+
<a href="/home" class="inline-flex items-center gap-1.5 text-sm font-medium text-surface-500 dark:text-surface-400 hover:text-surface-900 dark:hover:text-white transition-colors mb-8">
25
+
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m12 19-7-7 7-7"/><path d="M19 12H5"/></svg>
26
+
Back
27
+
</a>
11
28
12
-
<div class="prose prose-surface dark:prose-invert max-w-none">
13
-
<h1 class="font-display font-bold text-3xl mb-2 text-surface-900 dark:text-white">Terms of Service</h1>
14
-
<p class="text-surface-500 dark:text-surface-400 mb-8">Last updated: April 14, 2026</p>
29
+
<div class="lg:grid lg:grid-cols-[minmax(0,1fr)_200px] lg:gap-12">
30
+
<div class="bg-white dark:bg-surface-800 rounded-2xl px-5 sm:px-8 lg:px-12 py-10 md:py-14 lg:min-w-0">
31
+
<header class="mb-12">
32
+
<p class="text-xs font-semibold text-surface-500 dark:text-surface-400 uppercase tracking-wider mb-3">Legal</p>
33
+
<h1 class="font-display font-bold text-3xl md:text-4xl text-surface-900 dark:text-white tracking-tight mb-2">Terms of Service</h1>
34
+
<p class="text-sm text-surface-500 dark:text-surface-400">Effective {effectiveDate} · Last updated {lastUpdated}</p>
35
+
</header>
15
36
16
-
<section class="mb-8">
17
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Overview</h2>
18
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
19
-
Margin is a web annotation tool built on the AT Protocol, operated by Padding Labs LLC ("we", "our", or "us"). By using Margin (the "Service"), you agree to these Terms. If you do not agree, please do not use the Service. You must be at least 13 years old to use Margin.
20
-
</p>
21
-
</section>
37
+
<details class="lg:hidden mb-10 rounded-xl border border-surface-200 dark:border-surface-700/60 overflow-hidden">
38
+
<summary class="cursor-pointer px-4 py-3 text-xs font-semibold text-surface-500 dark:text-surface-400 uppercase tracking-wider bg-surface-50 dark:bg-surface-900/40">On this page</summary>
39
+
<ol class="px-4 py-3 space-y-0.5 text-sm">
40
+
{sections.map((s) => (
41
+
<li><a href={`#${s.id}`} class="block py-1 text-surface-600 dark:text-surface-400">{s.title}</a></li>
42
+
))}
43
+
</ol>
44
+
</details>
22
45
23
-
<section class="mb-8">
24
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Open Source</h2>
25
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
26
-
Margin is open source software. The source code is publicly available and provided "as is", without warranty of any kind, express or implied. These Terms govern your use of the hosted service at margin.at, not the source code itself.
27
-
</p>
28
-
</section>
46
+
<div class="space-y-12 max-w-2xl">
47
+
<section id="agreement" data-toc-section class="scroll-mt-6">
48
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Agreement</h2>
49
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">These Terms govern your use of Margin. Using it means you accept them.</p>
50
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">These Terms of Service govern your access to and use of Margin, an open-source web annotation tool built on the AT Protocol, and the Margin Personal Data Server at margin.cafe (together, the "Service"), provided by Padding Labs LLC ("we", "us", "our"). By accessing or using the Service you agree to be bound by these Terms and by our <a href="/privacy" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">Privacy Policy</a>. If you do not agree, you must not use the Service.</p>
51
+
</section>
29
52
30
-
<section class="mb-8">
31
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Your Content</h2>
32
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
33
-
You retain full ownership of all notes and other content you create ("Your Content"). By using the Service, you grant Padding Labs LLC a limited, non-exclusive, royalty-free license to store, index, display, and sync Your Content solely as needed to operate and improve the Service.
34
-
</p>
35
-
<p class="text-surface-700 dark:text-surface-300">
36
-
Because Margin is built on the AT Protocol, Your Content is stored as records on your Personal Data Server (PDS). It is portable and exportable at any time — we do not lock you in.
37
-
</p>
38
-
</section>
53
+
<section id="eligibility" data-toc-section class="scroll-mt-6">
54
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Eligibility</h2>
55
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Be 13 or older (16 in the EEA and UK), legally able to agree, and not on a sanctions list.</p>
56
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">You must be at least 13 years of age to use the Service, or 16 if you reside in the European Economic Area, the United Kingdom, or another jurisdiction with a higher age of digital consent. You must have the legal capacity to enter into a binding agreement. You represent that you are not located in a country subject to comprehensive United States sanctions and that you are not on a U.S. government list of restricted parties.</p>
57
+
</section>
39
58
40
-
<section class="mb-8">
41
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Public Notes</h2>
42
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
43
-
Notes you create are public by default on the AT Protocol network and may be visible to other users and services that interact with the network. Do not include sensitive or private information in your notes if you do not want it to be publicly visible.
44
-
</p>
45
-
</section>
59
+
<section id="your-content" data-toc-section class="scroll-mt-6">
60
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Your content</h2>
61
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">You own your content. Notes are public by default and we cannot recall federated copies.</p>
62
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
63
+
<p>You retain all ownership rights in the content you submit through the Service ("User Content"). You grant us a worldwide, non-exclusive, royalty-free licence to host, store, reproduce, transmit, index, generate vector representations of, and display User Content as necessary to operate the Service. This licence terminates when you remove the relevant User Content, save for retention required by law, retention in routine backups for a reasonable period, and copies already disseminated to third parties via the AT Protocol that are outside our control.</p>
64
+
<p>Records you publish through the AT Protocol are public by default and may be retrieved, copied, indexed, and re-displayed by any third party. Removal from your Personal Data Server does not guarantee removal from such third parties. You are solely responsible for User Content and represent that you hold all rights necessary to publish it.</p>
65
+
</div>
66
+
</section>
46
67
47
-
<section class="mb-8">
48
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">User Conduct</h2>
49
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
50
-
You are responsible for your use of the Service and for any content you provide, including compliance with applicable laws, rules, and regulations.
51
-
</p>
52
-
<p class="text-surface-700 dark:text-surface-300 mb-4">
53
-
We reserve the right to remove content or suspend access for violations of these Terms, including but not limited to:
54
-
</p>
55
-
<ul class="list-disc pl-5 mb-4 text-surface-700 dark:text-surface-300 space-y-1">
56
-
<li>Illegal content</li>
57
-
<li>Harassment or hate speech</li>
58
-
<li>Spam or malicious content</li>
59
-
</ul>
60
-
</section>
68
+
<section id="acceptable-use" data-toc-section class="scroll-mt-6">
69
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Acceptable use</h2>
70
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Do not break the law or harm other users.</p>
71
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
72
+
<p>You agree not to use the Service to:</p>
73
+
<ul class="list-disc pl-5 space-y-1.5 marker:text-surface-400 dark:marker:text-surface-600">
74
+
<li>violate applicable law or any third-party right;</li>
75
+
<li>post unlawful material, child sexual abuse material, terrorist content, non-consensual intimate imagery, or content that infringes intellectual property;</li>
76
+
<li>harass, threaten, dox, or impersonate any person;</li>
77
+
<li>transmit spam, phishing, fraud, or malware;</li>
78
+
<li>attack, disrupt, or probe the Service, or circumvent rate limits, access controls, or other technical measures; or</li>
79
+
<li>scrape or harvest data outside our public APIs, or train machine-learning models on User Content other than your own.</li>
80
+
</ul>
81
+
</div>
82
+
</section>
83
+
84
+
<section id="suspension" data-toc-section class="scroll-mt-6">
85
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Suspension and termination</h2>
86
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">We may remove content or accounts for violations. You may appeal.</p>
87
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">You may discontinue use of the Service at any time. We may suspend or terminate your access, or remove specific User Content, where we reasonably determine that you have breached these Terms, the law requires us to do so, or such action is necessary to protect users or third parties. Where we take such action, and unless prohibited by law, we will provide a statement of reasons. You may appeal by replying to the relevant notice or by writing to <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a> within six months.</p>
88
+
</section>
61
89
62
-
<section class="mb-8">
63
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">The AT Protocol</h2>
64
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
65
-
Margin interacts with the AT Protocol network. We do not control the network itself, other services on the network, or the data stored on your Personal Data Server. Your PDS provider's own terms govern data stored there. Content published to the AT Protocol is public and may be indexed by other services beyond Margin's control.
66
-
</p>
67
-
</section>
90
+
<section id="copyright" data-toc-section class="scroll-mt-6">
91
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Copyright (DMCA)</h2>
92
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Send a properly-formed DMCA notice if your copyright is infringed.</p>
93
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">We respond to notices that comply with the U.S. Digital Millennium Copyright Act. If you believe content on the Service infringes your copyright, send a notice containing the elements required by 17 U.S.C. § 512(c)(3) to <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a> with the subject line "DMCA Notice". Knowingly false notices may give rise to liability under § 512(f). We terminate the accounts of repeat infringers.</p>
94
+
</section>
68
95
69
-
<section class="mb-8">
70
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Disclaimer of Warranties</h2>
71
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
72
-
The Service is provided "as is" and "as available" without warranties of any kind, either express or implied, including but not limited to implied warranties of merchantability, fitness for a particular purpose, or non-infringement. We do not warrant that the Service will be uninterrupted, error-free, or free of harmful components.
73
-
</p>
74
-
</section>
96
+
<section id="disclaimers" data-toc-section class="scroll-mt-6">
97
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Disclaimers and liability</h2>
98
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Provided "as is". Aggregate liability capped at US$50. Mandatory protections still apply.</p>
99
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
100
+
<p>To the maximum extent permitted by law, the Service is provided <strong>"as is" and "as available"</strong>, without warranties of any kind, express or implied, including merchantability, fitness for a particular purpose, and non-infringement. We do not warrant that the Service will be uninterrupted, secure, or free from defects.</p>
101
+
<p>To the maximum extent permitted by law, we shall not be liable for any indirect, incidental, special, consequential, or punitive damages, or for loss of profits, revenue, goodwill, or data. Our aggregate liability arising out of or relating to the Service shall not exceed the greater of fifty United States dollars (US$50) or the amount you paid us during the twelve months preceding the event giving rise to the claim.</p>
102
+
<p>Nothing in these Terms excludes or limits liability that cannot be excluded or limited under applicable law, including liability for fraud, gross negligence, wilful misconduct, or death or personal injury caused by negligence.</p>
103
+
</div>
104
+
</section>
75
105
76
-
<section class="mb-8">
77
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Limitation of Liability</h2>
78
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
79
-
To the fullest extent permitted by law, Padding Labs LLC shall not be liable for any indirect, incidental, special, consequential, or punitive damages arising out of or related to your use of the Service. Because Margin is provided free of charge, our total aggregate liability to you shall not exceed $0.
80
-
</p>
81
-
</section>
106
+
<section id="indemnity" data-toc-section class="scroll-mt-6">
107
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Indemnity</h2>
108
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">If your conduct or content gives rise to a claim against us, you cover our costs.</p>
109
+
<p class="text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">To the extent permitted by law, you shall indemnify, defend, and hold us harmless from any third-party claim, demand, or proceeding arising out of your User Content, your use of the Service, or your breach of these Terms or applicable law. This obligation does not apply where prohibited by mandatory consumer-protection law.</p>
110
+
</section>
82
111
83
-
<section class="mb-8">
84
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Governing Law</h2>
85
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
86
-
These Terms are governed by the laws of the State of Wyoming, without regard to its conflict of law provisions.
87
-
</p>
88
-
</section>
112
+
<section id="governing-law" data-toc-section class="scroll-mt-6">
113
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Governing law and changes</h2>
114
+
<p class="text-sm italic text-surface-500 dark:text-surface-400 mb-4">Wyoming law applies. We give notice of material changes.</p>
115
+
<div class="space-y-3 text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
116
+
<p>These Terms are governed by the laws of the State of Wyoming, without regard to its conflict-of-laws rules. The state and federal courts located in Sheridan County, Wyoming shall have exclusive jurisdiction over any dispute, save where mandatory consumer-protection law in your country of residence provides otherwise. Before commencing any claim, you agree to contact us at <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a> and to attempt to resolve the matter informally for a period of sixty days.</p>
117
+
<p>We may amend these Terms from time to time. We will provide at least thirty days' notice of any material change by in-product notice or, where applicable, by email. If any provision is held unenforceable, the remainder of these Terms shall continue in full force and effect. We may assign these Terms in connection with a merger, acquisition, reorganisation, or sale.</p>
118
+
</div>
119
+
</section>
89
120
90
-
<section class="mb-8">
91
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Changes to These Terms</h2>
92
-
<p class="text-surface-700 dark:text-surface-300 leading-relaxed">
93
-
We may update these Terms from time to time. We will note the date of the last update at the top of this page. Continued use of the Service after changes constitutes acceptance of the updated Terms.
94
-
</p>
95
-
</section>
121
+
<section id="contact" data-toc-section class="scroll-mt-6">
122
+
<h2 class="font-display font-bold text-xl text-surface-900 dark:text-white tracking-tight mb-2">Contact</h2>
123
+
<address class="not-italic text-[15px] text-surface-700 dark:text-surface-300 leading-relaxed">
124
+
<strong class="text-surface-900 dark:text-white">Padding Labs LLC</strong><br />
125
+
<a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:underline font-medium">hello@margin.at</a>
126
+
</address>
127
+
</section>
128
+
</div>
129
+
</div>
96
130
97
-
<section class="mb-8">
98
-
<h2 class="text-xl font-bold text-surface-900 dark:text-white mb-4">Contact</h2>
99
-
<p class="text-surface-700 dark:text-surface-300">
100
-
For questions about these Terms, contact us at <a href="mailto:hello@margin.at" class="text-primary-600 dark:text-primary-400 hover:text-primary-700 dark:hover:text-primary-300 hover:underline">hello@margin.at</a>
101
-
</p>
102
-
</section>
131
+
<aside class="hidden lg:block">
132
+
<details class="sticky top-6 group" open>
133
+
<summary class="cursor-pointer list-none flex items-center gap-1.5 py-2 text-[11px] font-semibold text-surface-400 dark:text-surface-500 uppercase tracking-[0.12em] hover:text-surface-700 dark:hover:text-surface-200 transition-colors">
134
+
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" class="transition-transform group-open:rotate-90"><path d="m9 18 6-6-6-6"/></svg>
135
+
On this page
136
+
</summary>
137
+
<ol class="mt-3 space-y-0.5 text-[13px]">
138
+
{sections.map((s) => (
139
+
<li>
140
+
<a href={`#${s.id}`} data-toc-link={s.id} class="toc-link block py-1 text-surface-500 dark:text-surface-500 hover:text-surface-900 dark:hover:text-white transition-colors leading-snug">{s.title}</a>
141
+
</li>
142
+
))}
143
+
</ol>
144
+
</details>
145
+
</aside>
146
+
</div>
103
147
</div>
104
148
</div>
149
+
150
+
<script>
151
+
const links = document.querySelectorAll<HTMLAnchorElement>('[data-toc-link]');
152
+
const sections = document.querySelectorAll<HTMLElement>('[data-toc-section]');
153
+
if (links.length && sections.length) {
154
+
const setActive = (id: string) => {
155
+
links.forEach((l) => {
156
+
if (l.dataset.tocLink === id) {
157
+
l.classList.add('text-primary-600', 'dark:text-primary-400', 'font-medium');
158
+
l.classList.remove('text-surface-500', 'dark:text-surface-500');
159
+
} else {
160
+
l.classList.remove('text-primary-600', 'dark:text-primary-400', 'font-medium');
161
+
l.classList.add('text-surface-500', 'dark:text-surface-500');
162
+
}
163
+
});
164
+
};
165
+
let current = sections[0].id;
166
+
setActive(current);
167
+
const obs = new IntersectionObserver(
168
+
(entries) => {
169
+
const visible = entries
170
+
.filter((e) => e.isIntersecting)
171
+
.sort((a, b) => (a.target as HTMLElement).offsetTop - (b.target as HTMLElement).offsetTop);
172
+
if (visible.length > 0) {
173
+
current = visible[0].target.id;
174
+
setActive(current);
175
+
}
176
+
},
177
+
{ rootMargin: '-15% 0px -70% 0px', threshold: 0 }
178
+
);
179
+
sections.forEach((s) => obs.observe(s));
180
+
}
181
+
</script>
105
182
</BaseLayout>