feat: per-page copy-link button for compact URLs + shareable force-language links

- Copy-link pill in each page's top bar copies its compact URL (SEC-01/AGT-01, /, /privacy)
- ?lang= / #lang= forces the page language over saved/browser default (EN/DE, FA); hash form survives the compact-URL 302
- add .gitignore (keeps local CLAUDE.md out of the public repo)

index.html

@@ -244,6 +244,24 @@ code{font-family:var(--mono);font-size:.88em;background:var(--surface-2);
   .themebar{top:.7rem;right:.9rem}
 }
 
+/* ---- copy-link control (shares the segmented-pill language) ------- */
+.copylink{
+  appearance:none;cursor:pointer;display:inline-flex;align-items:center;
+  font-family:var(--mono);font-size:.72rem;font-weight:700;letter-spacing:.1em;
+  text-transform:uppercase;line-height:1;color:var(--muted);background:var(--surface);
+  border:1px solid var(--border-strong);border-radius:99px;padding:.42em .85em;
+  box-shadow:var(--shadow);
+  transition:color .16s ease, border-color .16s ease, background-color .16s ease;
+}
+.copylink:hover{color:var(--accent-ink);border-color:var(--accent)}
+.copylink:focus-visible{outline:2.5px solid var(--accent);outline-offset:2px}
+.copylink svg{width:13px;height:13px;flex:none}
+.copylink .cl-idle,.copylink .cl-done{display:inline-flex;align-items:center;gap:.45em}
+.copylink .cl-done{display:none}
+.copylink.copied{color:var(--good);border-color:var(--good);background:var(--good-wash)}
+.copylink.copied .cl-idle{display:none}
+.copylink.copied .cl-done{display:inline-flex}
+
 /* =========================================================================
    SECTION SHELL
    ========================================================================= */
@@ -514,7 +532,17 @@ footer .sig .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)
 <!-- ============================ MASTHEAD ============================ -->
 <header class="masthead wrap">
 
-  <div class="themebar" role="group" aria-label="Colour theme">
+  <div class="themebar" role="group" aria-label="Colour theme and link">
+    <button type="button" class="copylink" data-copy-url="https://tutorials.pouyalab.de/" aria-label="Copy link to this page">
+      <span class="cl-idle">
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M9 15l6-6M10.5 6.5l1-1a4.95 4.95 0 0 1 7 7l-1 1M13.5 17.5l-1 1a4.95 4.95 0 0 1-7-7l1-1"/></svg>
+        <span>Copy link</span>
+      </span>
+      <span class="cl-done">
+        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 13l4 4L19 7"/></svg>
+        <span>Copied</span>
+      </span>
+    </button>
     <div class="tgctl" role="group" aria-label="Colour theme">
       <span class="tglabel">Theme</span>
       <div class="themeseg">
@@ -851,6 +879,37 @@ footer .sig .dot{width:6px;height:6px;border-radius:50%;background:var(--accent)
   }, { rootMargin: '0px 0px -8% 0px', threshold: 0.08 });
   els.forEach(function(el){ io.observe(el); });
 })();
+
+/* =========================================================================
+   COPY-LINK — copies the page's compact URL to the clipboard, with a brief
+   "Copied" confirmation. Falls back to execCommand where the async clipboard
+   API is unavailable (older browsers / non-secure contexts).
+   ========================================================================= */
+(function(){
+  function fallback(text, cb){
+    try{
+      var ta = document.createElement('textarea');
+      ta.value = text; ta.setAttribute('readonly','');
+      ta.style.position = 'fixed'; ta.style.top = '-9999px';
+      document.body.appendChild(ta); ta.focus(); ta.select();
+      document.execCommand('copy'); document.body.removeChild(ta); cb();
+    }catch(e){}
+  }
+  document.querySelectorAll('.copylink').forEach(function(b){
+    var t = null;
+    b.addEventListener('click', function(){
+      var url = b.getAttribute('data-copy-url'); if(!url) return;
+      var done = function(){
+        b.classList.add('copied');
+        if(t) clearTimeout(t);
+        t = setTimeout(function(){ b.classList.remove('copied'); }, 1700);
+      };
+      if(navigator.clipboard && navigator.clipboard.writeText){
+        navigator.clipboard.writeText(url).then(done).catch(function(){ fallback(url, done); });
+      } else { fallback(url, done); }
+    });
+  });
+})();
 </script>
 </body>
 </html>