{"id":615,"date":"2026-08-13T09:36:27","date_gmt":"2026-08-13T07:36:27","guid":{"rendered":"https:\/\/me-matcha.com\/mearchive\/"},"modified":"2026-09-05T00:10:11","modified_gmt":"2026-09-04T22:10:11","slug":"mearchive","status":"publish","type":"page","link":"https:\/\/me-matcha.com\/en\/mearchive\/","title":{"rendered":"MeArchive"},"content":{"rendered":"<div>MeArchive \u00b7 Pinnwand<\/div>\n<h1>Younger Me. Today Me. Future Me.<\/h1>\n<div>Drei Perspektiven. Eine Frage an dich.<br \/>Was w&uuml;rdest du deinem j&uuml;ngeren Ich sagen? Was z&auml;hlt heute? Und was w&uuml;nschst du deinem zuk&uuml;nftigen Ich? Teile einen Gedanken &ndash; und entdecke, was andere bewegt.<\/div>\n<div>\n<style>\n\/* MeMatcha ME Archive \u2014 Pinnwand-Widget (namespaced .mmp-). Nutzt Design-System-Tokens. *\/\n.mmp{--g:#3C4429;--gh:#2F361F;--cream:#F6F1E4;--card:#FDFBF4;--deep:#EDE7DA;\n  --matcha:#F4C6A4;--matchat:#66704A;--peach:#F4C6A4;--line:rgba(63,64,51,.16);\n  --linestr:rgba(63,64,51,.30);--sans:'Be Vietnam Pro',-apple-system,sans-serif;\n  --serif:'Playfair Display',Georgia,serif;--mono:'Be Vietnam Pro',sans-serif;\n  color:var(--g);font-family:var(--sans);}\n.mmp *{box-sizing:border-box;}\n.mmp-eyebrow{font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.16em;\n  text-transform:uppercase;color:var(--matchat);}\n.mmp-h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.2vw,42px);\n  line-height:1.05;letter-spacing:-.01em;margin:8px 0 0;}\n.mmp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;\n  font-family:var(--sans);font-weight:700;font-size:16px;line-height:1;padding:15px 28px;\n  border-radius:999px;border:2px solid transparent;text-decoration:none;transition:.15s;}\n.mmp-btn--primary{background:var(--g);color:var(--cream);}\n.mmp-btn--primary:hover{background:var(--gh);}\n.mmp-btn--ghost{background:transparent;color:var(--g);border-color:var(--g);}\n.mmp-btn--ghost:hover{background:rgba(63,64,51,.07);}\n.mmp-btn--matcha{background:var(--cream);color:var(--g);}\n.mmp-btn--sm{padding:11px 20px;font-size:14px;}\n.mmp-btn[disabled]{opacity:.4;pointer-events:none;}<\/p>\n<p>\/* Composer *\/\n.mmp-composer{background:var(--g);color:var(--cream);border-radius:28px;\n  padding:clamp(30px,3.8vw,52px);}\n.mmp-composer .mmp-eyebrow{color:var(--matcha);}\n.mmp-composer .mmp-h2{color:var(--cream);}\n.mmp-lead{color:rgba(246,241,228,.80);margin:14px 0 0;max-width:560px;line-height:1.55;}\n.mmp-roles{display:flex;gap:clamp(14px,1.7vw,22px);flex-wrap:wrap;margin:34px 0 0;}\n.mmp-role{flex:1 1 170px;min-width:150px;text-align:left;cursor:pointer;background:rgba(246,241,228,.06);\n  border:1.5px solid rgba(246,241,228,.22);border-radius:20px;padding:22px 22px;color:var(--cream);\n  transition:.15s;font-family:var(--sans);}\n.mmp-role:hover{border-color:rgba(246,241,228,.5);transform:translateY(-2px);}\n.mmp-role[aria-pressed=\"true\"]{background:var(--matcha);border-color:var(--matcha);color:var(--g);}\n.mmp-role b{display:block;font-size:18px;font-weight:800;margin-top:10px;}\n.mmp-role small{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.82;}\n.mmp-role .mmp-emoji{font-size:26px;line-height:1;}\n.mmp-q{margin:42px 0 0;font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.2vw,27px);\n  line-height:1.3;letter-spacing:-.01em;}\n.mmp-field{margin:24px 0 0;}\n.mmp-ta{width:100%;min-height:110px;resize:vertical;background:var(--cream);color:var(--g);\n  border:none;border-radius:18px;padding:18px 20px;font-family:var(--sans);font-size:17px;line-height:1.45;outline:none;}\n.mmp-ta::placeholder{color:rgba(63,64,51,.4);}\n.mmp-metarow{display:flex;justify-content:flex-end;margin:10px 2px 0;}\n.mmp-count{font-family:var(--mono);font-size:12px;color:rgba(246,241,228,.6);white-space:nowrap;}\n.mmp-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}\n.mmp-consent{display:flex;align-items:flex-start;gap:12px;margin:22px 0 0;cursor:pointer;\n  font-size:14px;line-height:1.5;color:rgba(246,241,228,.82);max-width:600px;}\n.mmp-consent input{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin-top:1px;\n  border:1.5px solid rgba(246,241,228,.5);border-radius:7px;background:rgba(246,241,228,.06);\n  cursor:pointer;position:relative;transition:.15s;}\n.mmp-consent input:checked{background:var(--matcha);border-color:var(--matcha);}\n.mmp-consent input:checked::after{content:\"\u2713\";position:absolute;inset:0;display:flex;align-items:center;\n  justify-content:center;color:var(--g);font-size:14px;font-weight:800;}\n.mmp-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 0;}\n.mmp-hint{display:none;margin:14px 0 0;font-size:14px;color:rgba(246,241,228,.75);}\n.mmp-hint.show{display:block;}<\/p>\n<p>\/* Reward (Post-Submit) *\/\n.mmp-reward{text-align:left;}\n.mmp-reward .mmp-eyebrow{color:var(--matcha);}\n.mmp-reward .mmp-h2{color:var(--cream);}\n.mmp-reward-id{margin:14px 0 0;font-size:clamp(17px,2vw,20px);color:rgba(246,241,228,.9);}\n.mmp-reward-id b{font-family:var(--mono);font-weight:700;color:var(--matcha);letter-spacing:.02em;}\n.mmp-reward-en{font-family:var(--serif);font-style:italic;font-size:clamp(18px,2vw,22px);\n  color:rgba(246,241,228,.86);margin:8px 0 0;}\n.mmp-reward-sub{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;\n  text-transform:uppercase;color:rgba(246,241,228,.62);margin:34px 0 16px;}\n.mmp-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}\n.mmp-minicard{background:var(--card);color:var(--g);border-radius:16px;padding:18px 18px 16px;\n  box-shadow:0 12px 28px -22px rgba(0,0,0,.5);}\n.mmp-minicard .r{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.1em;\n  text-transform:uppercase;color:var(--matchat);margin:0 0 8px;}\n.mmp-minicard .t{font-weight:700;font-size:15px;line-height:1.35;}\n.mmp-minicard .n{font-family:var(--mono);font-size:10px;color:rgba(63,64,51,.5);margin:12px 0 0;letter-spacing:.04em;}\n.mmp-minicard[data-role=\"younger\"]{background:#F1EFE2;}\n.mmp-minicard[data-role=\"today\"]{background:#FDEFE2;}\n.mmp-minicard[data-role=\"future\"]{background:#ECEADC;}<\/p>\n<p>\/* Board *\/\n.mmp-board-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;\n  flex-wrap:wrap;margin:0 0 12px;}\n.mmp-board-sub{font-size:16px;line-height:1.55;color:rgba(63,64,51,.7);max-width:560px;margin:10px 0 26px;}\n.mmp-filters{display:flex;gap:8px;flex-wrap:wrap;}\n.mmp-filter{cursor:pointer;background:transparent;border:1px solid var(--linestr);border-radius:999px;\n  padding:9px 17px;font-family:var(--mono);font-size:12px;letter-spacing:.05em;\n  color:var(--g);transition:.15s;white-space:nowrap;}\n.mmp-filter[aria-pressed=\"true\"]{background:var(--g);color:var(--cream);border-color:var(--g);}\n.mmp-grid{columns:3 250px;column-gap:22px;}\n.mmp-grid .mmp-card{break-inside:avoid;margin:0 0 22px;cursor:pointer;\n  transition:transform .18s ease;}\n.mmp-grid .mmp-card:hover{transform:translateY(-3px) rotate(0deg)!important;}\n.mmp-card .mmp-pin{position:relative;background:var(--card);color:var(--g);border:1px solid var(--line);\n  border-radius:20px;padding:26px 26px 20px;box-shadow:0 14px 30px -22px rgba(0,0,0,.4);}\n.mmp-pin::before{content:\"\";position:absolute;top:15px;left:26px;width:11px;height:11px;border-radius:50%;\n  background:var(--peach);box-shadow:0 2px 4px rgba(0,0,0,.2);}\n.mmp-pin-role{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.1em;\n  text-transform:uppercase;color:var(--matchat);margin:6px 0 12px;padding-left:20px;}\n.mmp-pin-text{font-family:var(--sans);font-weight:700;font-size:clamp(18px,1.9vw,22px);\n  line-height:1.34;letter-spacing:-.01em;}\n.mmp-pin-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;}\n.mmp-pin-id{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--matchat);letter-spacing:.06em;}\n.mmp-pin-date{font-family:var(--mono);font-size:11px;color:rgba(63,64,51,.5);letter-spacing:.04em;}\n.mmp-pin[data-role=\"younger\"]{background:#F1EFE2;}\n.mmp-pin[data-role=\"today\"]{background:#FDEFE2;}\n.mmp-pin[data-role=\"future\"]{background:#ECEADC;}\n.mmp-pin[data-role=\"younger\"]::before{background:#A8B08C;}\n.mmp-pin[data-role=\"future\"]::before{background:#D9B27E;}\n.mmp-share{position:absolute;bottom:16px;right:18px;width:34px;height:34px;border-radius:50%;\n  border:1px solid var(--linestr);background:rgba(255,255,255,.5);display:flex;align-items:center;\n  justify-content:center;font-size:15px;color:var(--g);cursor:pointer;transition:.15s;}\n.mmp-share:hover{background:var(--g);color:var(--cream);}\n\/* Variable Gr\u00f6\u00dfen & Formen *\/\n.mmp-card--lg .mmp-pin-text{font-size:clamp(23px,2.6vw,30px);}\n.mmp-card--lg .mmp-pin{padding:32px 30px 24px;border-radius:26px;}\n.mmp-card--tall .mmp-pin{padding-bottom:52px;}\n.mmp-card--soft .mmp-pin{border-radius:30px;}\n.mmp-card--sharp .mmp-pin{border-radius:12px;}\n.mmp-card--emoji .mmp-pin{text-align:center;padding:26px 24px 20px;}\n.mmp-card--emoji .mmp-pin-role{padding-left:0;}\n.mmp-card--emoji .mmp-pin::before{left:50%;transform:translateX(-50%);}\n.mmp-card--emoji .mmp-pin-text{font-size:clamp(48px,6vw,66px);line-height:1;margin:10px 0 0;}\n.mmp-card--emoji .mmp-pin-foot{justify-content:center;margin-top:22px;}\n.mmp-empty{text-align:center;color:rgba(63,64,51,.55);padding:40px 0;}<\/p>\n<p>\/* Modal *\/\n.mmp-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;\n  padding:24px;background:rgba(63,64,51,.55);backdrop-filter:blur(4px);}\n.mmp-modal.show{display:flex;}\n.mmp-modal-box{max-width:460px;width:100%;}\n.mmp-modal .mmp-pin{padding:44px 34px 30px;}\n.mmp-modal .mmp-pin-text{font-size:clamp(22px,3vw,30px);}\n.mmp-modal-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:18px 0 0;}\n.mmp-x{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--g);font-size:26px;\n  cursor:pointer;line-height:1;opacity:.6;}\n.mmp-x:hover{opacity:1;}<\/p>\n<p>\/* Toast *\/\n.mmp-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);\n  background:var(--g);color:var(--cream);padding:14px 22px;border-radius:999px;font-weight:600;font-size:15px;\n  opacity:0;pointer-events:none;transition:.25s;z-index:10000;box-shadow:0 12px 30px -12px rgba(0,0,0,.5);}\n.mmp-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}<\/p>\n<p>@media(max-width:640px){.mmp-grid{columns:1;}.mmp-mini{grid-template-columns:1fr;}}\n<\/style>\n<div class=\"mmp\">\n  <!-- Composer --><\/p>\n<div class=\"mmp-composer\">\n<div id=\"mmpComposerMain\">\n      <span class=\"mmp-eyebrow\">Dein Eintrag<\/span><\/p>\n<h2 class=\"mmp-h2\">Ein Gedanke f&uuml;r dein Ich.<\/h2>\n<p class=\"mmp-lead\">W&auml;hle eine Perspektive und hinterlasse einen Gedanken f&uuml;r dein<br \/>\n        Younger Me, Today Me oder Future Me.<\/p>\n<div class=\"mmp-roles\" id=\"mmpRoles\"><\/div>\n<div id=\"mmpForm\" hidden>\n<p class=\"mmp-q\" id=\"mmpQ\">\n<div class=\"mmp-field\">\n          <textarea class=\"mmp-ta\" id=\"mmpText\" maxlength=\"180\" placeholder=\"Dein Gedanke &hellip;\"><\/textarea>\n        <\/div>\n<div class=\"mmp-metarow\"><span class=\"mmp-count\" id=\"mmpCount\">0 \/ 180<\/span><\/div>\n<p>        <input class=\"mmp-hp\" id=\"mmpHp\" tabindex=\"-1\" autocomplete=\"off\" placeholder=\"Website\"><\/p>\n<p>        <label class=\"mmp-consent\"><br \/>\n          <input type=\"checkbox\" id=\"mmpConsent\"><br \/>\n          <span>Ich stimme zu, dass meine anonyme Antwort von MeMatcha ver&ouml;ffentlicht werden darf.<\/span><br \/>\n        <\/label><\/p>\n<div class=\"mmp-actions\">\n          <button class=\"mmp-btn mmp-btn--matcha\" id=\"mmpPin\">In das Archive pinnen<\/button><br \/>\n          <button class=\"mmp-btn mmp-btn--ghost\" id=\"mmpShare\" style=\"color:var(--cream);border-color:rgba(246,241,228,.4);\">Als Share Card<\/button>\n        <\/div>\n<p class=\"mmp-hint\" id=\"mmpHint\">\n<\/p><\/div>\n<\/p><\/div>\n<p>    <!-- Reward --><\/p>\n<div class=\"mmp-reward\" id=\"mmpReward\" hidden>\n      <span class=\"mmp-eyebrow\">&#10003; Archiviert<\/span><\/p>\n<h2 class=\"mmp-h2\">Willkommen im ME Archive.<\/h2>\n<p class=\"mmp-reward-id\">Dein Gedanke ist jetzt <b id=\"mmpRewardId\">#000000<\/b>.<\/p>\n<p class=\"mmp-reward-en\">Your thought is part of the Archive.<\/p>\n<p class=\"mmp-reward-sub\">3 Gedanken aus der Community f&uuml;r dich<\/p>\n<div class=\"mmp-mini\" id=\"mmpMini\"><\/div>\n<div class=\"mmp-actions\">\n        <button class=\"mmp-btn mmp-btn--matcha\" id=\"mmpRewardShare\">Als Share Card speichern<\/button><br \/>\n        <button class=\"mmp-btn mmp-btn--ghost\" id=\"mmpRewardAgain\" style=\"color:var(--cream);border-color:rgba(246,241,228,.4);\">Noch einen Gedanken teilen<\/button>\n      <\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>  <!-- Board --><\/p>\n<div style=\"margin-top:64px;\">\n<div class=\"mmp-board-head\">\n<div>\n        <span class=\"mmp-eyebrow\">Die Pinnwand<\/span><\/p>\n<h2 class=\"mmp-h2\">Gedanken der Community.<\/h2>\n<\/p><\/div>\n<div class=\"mmp-filters\" id=\"mmpFilters\">\n        <button class=\"mmp-filter\" data-f=\"all\" aria-pressed=\"true\">Alle<\/button><br \/>\n        <button class=\"mmp-filter\" data-f=\"younger\" aria-pressed=\"false\">\ud83c\udf31 Younger Me<\/button><br \/>\n        <button class=\"mmp-filter\" data-f=\"today\" aria-pressed=\"false\">\ud83c\udf3f Today Me<\/button><br \/>\n        <button class=\"mmp-filter\" data-f=\"future\" aria-pressed=\"false\">\u2b50 Future Me<\/button>\n      <\/div>\n<\/p><\/div>\n<p class=\"mmp-board-sub\">Ein Gedanke. Eine Perspektive. Vielleicht erkennst du dich darin wieder.<\/p>\n<div class=\"mmp-grid\" id=\"mmpBoard\">\n<div class=\"mmp-empty\">Pinnwand wird geladen &hellip;<\/div>\n<\/div><\/div>\n<p>  <!-- Modal --><\/p>\n<div class=\"mmp-modal\" id=\"mmpModal\">\n<div class=\"mmp-modal-box\">\n<div class=\"mmp-pin\" id=\"mmpModalPin\" data-role=\"today\">\n        <button class=\"mmp-x\" id=\"mmpModalX\" aria-label=\"Schlie&szlig;en\">&times;<\/button><\/p>\n<div class=\"mmp-pin-role\" id=\"mmpModalRole\"><\/div>\n<div class=\"mmp-pin-text\" id=\"mmpModalText\"><\/div>\n<div class=\"mmp-pin-foot\"><span class=\"mmp-pin-id\" id=\"mmpModalId\"><\/span><span class=\"mmp-pin-date\" id=\"mmpModalDate\"><\/span><\/div>\n<\/p><\/div>\n<div class=\"mmp-modal-actions\" id=\"mmpModalActions\"><\/div>\n<\/p><\/div>\n<\/p><\/div>\n<p>  <canvas id=\"mmpCanvas\" width=\"1080\" height=\"1920\" style=\"display:none;\"><\/canvas><\/p>\n<div class=\"mmp-toast\" id=\"mmpToast\"><\/div>\n<\/div>\n<p><script>\n(function(){\n  var API = '\/wp-json\/mematcha\/v1\/pins';\n  var HASHTAG = '#MeMatcha #MeArchive';\n  var ROLES = {\n    younger: { label:'Younger Me', emoji:'\ud83c\udf31', tag:'R\u00fcckblick' },\n    today:   { label:'Today Me',   emoji:'\ud83c\udf3f', tag:'Jetzt' },\n    future:  { label:'Future Me',  emoji:'\u2b50', tag:'Ausblick' }\n  };\n  \/* W\u00f6chentlich rotierende Fragen. Jede Woche wird der n\u00e4chste Satz aktiv.\n     Aktuell 1 Satz -> immer sichtbar; weitere S\u00e4tze einfach unten anh\u00e4ngen. *\/\n  var WEEKLY_QUESTIONS = [\n    { younger:'Wof\u00fcr w\u00fcrde dir dein 10-j\u00e4hriges Ich heute ein High Five geben?',\n      today:'Was raubt dir gerade Energie, ohne Miete zu zahlen?',\n      future:'Wenn dein zuk\u00fcnftiges Ich dir heute nur ein Emoji schicken k\u00f6nnte \u2013 welches w\u00e4re es?' }\n  ];\n  function isoWeek(){\n    try{\n      var d=new Date(); d.setHours(0,0,0,0);\n      d.setDate(d.getDate()+3-((d.getDay()+6)%7));\n      var w1=new Date(d.getFullYear(),0,4);\n      return 1+Math.round(((d-w1)\/86400000-3+((w1.getDay()+6)%7))\/7);\n    }catch(e){ return 0; }\n  }\n  function weekSet(){ return WEEKLY_QUESTIONS[isoWeek()%WEEKLY_QUESTIONS.length]; }\n  function questionFor(role){ var s=weekSet(); return s[role]||''; }<\/p>\n<p>  var state = { role:null, filter:'all', pins:[], last:null };\n  var $ = function(id){ return document.getElementById(id); };<\/p>\n<p>  function roleLabel(r){ return (ROLES[r]||ROLES.today).label; }\n  function fmtDate(iso){ try{ var d=new Date(iso); return d.toLocaleDateString('de-DE',{day:'numeric',month:'short',year:'numeric'});}catch(e){return '';} }\n  function archiveId(p){ if(p.archive){ return p.archive; } return '#'+String(p.id||0); }\n  function isEmoji(t){ return !\/[A-Za-z\u00c0-\u00ff0-9]\/.test(String(t||'')); }\n  function toast(msg){ var t=$('mmpToast'); t.textContent=msg; t.classList.add('show'); setTimeout(function(){t.classList.remove('show');},2800); }<\/p>\n<p>  \/* ---- Composer ---- *\/\n  function renderRoles(){\n    var wrap=$('mmpRoles'); wrap.innerHTML='';\n    Object.keys(ROLES).forEach(function(k){\n      var r=ROLES[k];\n      var b=document.createElement('button');\n      b.className='mmp-role'; b.setAttribute('aria-pressed','false'); b.dataset.role=k;\n      b.innerHTML='<span class=\"mmp-emoji\">'+r.emoji+'<\/span><b>'+r.label+'<\/b><small>'+r.tag+'<\/small>';\n      b.addEventListener('click',function(){ selectRole(k); });\n      wrap.appendChild(b);\n    });\n  }\n  function selectRole(k){\n    state.role=k;\n    [].forEach.call($('mmpRoles').children,function(b){ b.setAttribute('aria-pressed', b.dataset.role===k?'true':'false'); });\n    $('mmpQ').textContent=questionFor(k);\n    $('mmpForm').hidden=false;\n    updateState();\n    $('mmpText').focus();\n  }\n  function updateState(){\n    var text=$('mmpText').value.trim();\n    $('mmpCount').textContent=$('mmpText').value.length+' \/ 180';\n    var ok=true;\n    if(!state.role){ ok=false; }\n    if(text.length<2){ ok=false; }\n    if(!$('mmpConsent').checked){ ok=false; }\n    $('mmpPin').disabled=!ok;\n  }\n  $('mmpText').addEventListener('input',updateState);\n  $('mmpConsent').addEventListener('change',updateState);\n\n  function pinIt(){\n    if($('mmpHp').value){ return; }\n    var text=$('mmpText').value.trim();\n    if(!state.role){ return; }\n    if(text.length<2){ return; }\n    if(!$('mmpConsent').checked){ toast('Bitte best\u00e4tige die Ver\u00f6ffentlichung.'); return; }\n    var payload={ role:state.role, question:questionFor(state.role), text:text,\n      author:'', website:'', consent:true };\n    $('mmpPin').disabled=true; $('mmpPin').textContent='Wird gepinnt \u2026';\n    fetch(API,{method:'POST',headers:{'Content-Type':'application\/json'},body:JSON.stringify(payload)})\n      .then(function(r){ return r.json().then(function(d){ return {ok:r.ok,d:d}; }); })\n      .then(function(res){\n        $('mmpPin').textContent='In das Archive pinnen'; $('mmpPin').disabled=false;\n        if(!res.ok){ toast((res.d||{}).message ? res.d.message : 'Hat nicht geklappt.'); return; }\n        state.last=res.d;\n        if(!res.d.pending){ state.pins.unshift(res.d); renderBoard(); }\n        showReward(res.d);\n      })\n      .catch(function(){ $('mmpPin').textContent='In das Archive pinnen'; $('mmpPin').disabled=false; toast('Netzwerkfehler.'); });\n  }\n  $('mmpPin').addEventListener('click',pinIt);\n  $('mmpShare').addEventListener('click',function(){\n    var text=$('mmpText').value.trim(); if(!text){ toast('Schreib zuerst deinen Gedanken.'); return; }\n    shareCard({ role:state.role||'today', text:text, archive:'#\u2014' });\n  });\n\n  \/* ---- Reward \/ Post-Submit ---- *\/\n  function showReward(p){\n    $('mmpRewardId').textContent=archiveId(p);\n    var mini=$('mmpMini'); mini.innerHTML='';\n    var pool=state.pins.filter(function(x){ return x.id!==p.id; });\n    pick(pool,3).forEach(function(x){\n      var c=document.createElement('div'); c.className='mmp-minicard'; c.dataset.role=x.role||'today';\n      var r=document.createElement('div'); r.className='r'; r.textContent=(ROLES[x.role]||ROLES.today).emoji+' '+roleLabel(x.role);\n      var t=document.createElement('div'); t.className='t'; t.textContent=(isEmoji(x.text)?'':'\u201c')+x.text+(isEmoji(x.text)?'':'\u201d');\n      var n=document.createElement('div'); n.className='n'; n.textContent=archiveId(x);\n      c.appendChild(r); c.appendChild(t); c.appendChild(n); mini.appendChild(c);\n    });\n    $('mmpComposerMain').hidden=true; $('mmpReward').hidden=false;\n    try{ $('mmpReward').scrollIntoView({behavior:'smooth',block:'center'}); }catch(e){}\n  }\n  $('mmpRewardShare').addEventListener('click',function(){ if(state.last){ shareCard(state.last); } });\n  $('mmpRewardAgain').addEventListener('click',function(){\n    $('mmpReward').hidden=true; $('mmpComposerMain').hidden=false;\n    state.role=null; state.last=null;\n    [].forEach.call($('mmpRoles').children,function(b){ b.setAttribute('aria-pressed','false'); });\n    $('mmpForm').hidden=true; $('mmpText').value=''; $('mmpConsent').checked=false; updateState();\n    try{ $('mmpComposerMain').scrollIntoView({behavior:'smooth',block:'start'}); }catch(e){}\n  });\n  function pick(arr,n){\n    var a=arr.slice(), out=[];\n    while(a.length){ if(out.length>=n){ break; } var i=Math.floor(Math.random()*a.length); out.push(a.splice(i,1)[0]); }\n    return out;\n  }<\/p>\n<p>  \/* ---- Share Card (Canvas -> Bild) ---- *\/\n  var CARD_BG={ younger:'#EEF0E2', today:'#FDEFE2', future:'#E9E7D8' };\n  var CARD_AC={ younger:'#66704A', today:'#C0824F', future:'#3C4429' };\n  function wrap(ctx,text,maxW){\n    var words=String(text).split(' '), lines=[], line='';\n    words.forEach(function(w){\n      var test=line?line+' '+w:w;\n      if(ctx.measureText(test).width>maxW){ if(line){ lines.push(line); } line=w; }\n      else { line=test; }\n    });\n    if(line){ lines.push(line); }\n    return lines;\n  }\n  function drawCard(p,cb){\n    var cv=$('mmpCanvas'), ctx=cv.getContext('2d');\n    var W=1080, H=1920, role=p.role||'today';\n    ctx.clearRect(0,0,W,H);\n    ctx.fillStyle=CARD_BG[role]||'#FDEFE2'; ctx.fillRect(0,0,W,H);\n    ctx.fillStyle=CARD_AC[role]||'#66704A';\n    ctx.textAlign='center';\n    \/\/ Top-Label\n    try{ ctx.letterSpacing='10px'; }catch(e){}\n    ctx.font='600 30px \"Be Vietnam Pro\", sans-serif';\n    ctx.fillText('THE ME ARCHIVE', W\/2, 200);\n    \/\/ Rolle gro\u00df\n    ctx.font='800 78px \"Be Vietnam Pro\", sans-serif';\n    ctx.fillText(roleLabel(role).toUpperCase(), W\/2, 330);\n    try{ ctx.letterSpacing='0px'; }catch(e){}\n    \/\/ Zitat\n    ctx.fillStyle='#3C4429';\n    if(isEmoji(p.text)){\n      ctx.font='300px \"Be Vietnam Pro\", sans-serif';\n      ctx.textBaseline='middle';\n      ctx.fillText(p.text, W\/2, H\/2);\n      ctx.textBaseline='alphabetic';\n    } else {\n      var t=String(p.text);\n      var fs = t.length<46 ? 88 : (t.length<95 ? 68 : 54);\n      ctx.font='500 '+fs+'px \"Playfair Display\", Georgia, serif';\n      var lines=wrap(ctx,'\u201c'+t+'\u201d', W-260);\n      var lh=fs*1.22, startY=H\/2-((lines.length-1)*lh)\/2;\n      ctx.textBaseline='middle';\n      lines.forEach(function(ln,i){ ctx.fillText(ln, W\/2, startY+i*lh); });\n      ctx.textBaseline='alphabetic';\n    }\n    \/\/ Footer: Archive-ID + Wortmarke\n    ctx.fillStyle=CARD_AC[role]||'#66704A';\n    try{ ctx.letterSpacing='6px'; }catch(e){}\n    ctx.font='600 30px \"Be Vietnam Pro\", sans-serif';\n    ctx.fillText('THE ME ARCHIVE \u00b7 '+(p.archive||'#\u2014'), W\/2, H-230);\n    try{ ctx.letterSpacing='0px'; }catch(e){}\n    ctx.fillStyle='#3C4429';\n    ctx.font='500 56px \"Playfair Display\", Georgia, serif';\n    ctx.fillText('MeMatcha', W\/2, H-140);\n    cb(cv);\n  }\n  function shareCard(p){\n    var run=function(){\n      drawCard(p,function(cv){\n        var name='me-archive-'+String(p.archive||'').replace(\/[^0-9]\/g,'')+'.png';\n        var caption=(isEmoji(p.text)?p.text:'\u201c'+p.text+'\u201d')+' \u2014 THE ME ARCHIVE '+(p.archive||'')+'\\n\\n'+HASHTAG;\n        cv.toBlob(function(blob){\n          if(!blob){ fallbackDL(cv,name); return; }\n          if(navigator.canShare){\n            var file=new File([blob],name,{type:'image\/png'});\n            if(navigator.canShare({files:[file]})){\n              navigator.share({files:[file],text:caption}).then(function(){}).catch(function(){ fallbackDL(cv,name); });\n              return;\n            }\n          }\n          fallbackDL(cv,name);\n        },'image\/png');\n      });\n    };\n    if(document.fonts){ document.fonts.ready.then(run).catch(run); } else { run(); }\n  }\n  function fallbackDL(cv,name){\n    try{\n      var a=document.createElement('a'); a.download=name; a.href=cv.toDataURL('image\/png');\n      document.body.appendChild(a); a.click(); document.body.removeChild(a);\n      toast('Share Card gespeichert \u2013 jetzt in Story\/WhatsApp posten \u2728');\n    }catch(e){ toast('Konnte Share Card nicht erstellen.'); }\n  }\n\n  \/* ---- Board ---- *\/\n  function variant(p,i){\n    var cls=[];\n    var n=parseInt(String(p.archive||p.id||'0').replace(\/[^0-9]\/g,''),10)||i;\n    if(isEmoji(p.text)){ cls.push('mmp-card--emoji'); }\n    else{\n      if(p.text.length>120){ cls.push('mmp-card--lg'); }\n      else if(n%5===0){ cls.push('mmp-card--lg'); }\n      if(n%3===0){ cls.push('mmp-card--tall'); }\n    }\n    var shapes=['','mmp-card--soft','','mmp-card--sharp',''];\n    cls.push(shapes[n%shapes.length]);\n    return cls.join(' ');\n  }\n  var ROT=['-1.1deg','0.7deg','-0.5deg','1deg','0deg','-0.8deg'];\n  function pinNode(p,i){\n    var card=document.createElement('div'); card.className=('mmp-card '+variant(p,i)).trim();\n    card.style.transform='rotate('+ROT[i%ROT.length]+')';\n    var pin=document.createElement('div'); pin.className='mmp-pin'; pin.dataset.role=p.role||'today';\n    var role=document.createElement('div'); role.className='mmp-pin-role';\n    role.textContent=(ROLES[p.role]||ROLES.today).emoji+' '+roleLabel(p.role);\n    var text=document.createElement('div'); text.className='mmp-pin-text';\n    text.textContent=isEmoji(p.text)?p.text:('\u201c'+p.text+'\u201d');\n    var foot=document.createElement('div'); foot.className='mmp-pin-foot';\n    var idv=document.createElement('span'); idv.className='mmp-pin-id'; idv.textContent=archiveId(p);\n    var dt=document.createElement('span'); dt.className='mmp-pin-date'; dt.textContent=fmtDate(p.date);\n    foot.appendChild(idv); foot.appendChild(dt);\n    var sh=document.createElement('button'); sh.className='mmp-share'; sh.title='Als Share Card'; sh.textContent='\u2197';\n    sh.addEventListener('click',function(e){ e.stopPropagation(); shareCard(p); });\n    pin.appendChild(role); pin.appendChild(text); pin.appendChild(foot); pin.appendChild(sh);\n    card.appendChild(pin);\n    card.addEventListener('click',function(){ openModal(p); });\n    return card;\n  }\n  function renderBoard(){\n    var board=$('mmpBoard'); board.innerHTML='';\n    var list=state.pins.filter(function(p){ if(state.filter==='all'){ return true; } return p.role===state.filter; });\n    if(!list.length){ board.innerHTML='<\/p>\n<div class=\"mmp-empty\">Noch keine Gedanken hier \u2013 sei die\/der Erste \u2728<\/div>\n<p>'; return; }\n    list.forEach(function(p,i){ board.appendChild(pinNode(p,i)); });\n  }\n  function loadBoard(){\n    fetch(API).then(function(r){ return r.json(); }).then(function(d){\n      state.pins=Array.isArray(d)?d:[]; renderBoard();\n    }).catch(function(){ $('mmpBoard').innerHTML='<\/p>\n<div class=\"mmp-empty\">Pinnwand konnte nicht geladen werden.<\/div>\n<p>'; });\n  }\n  [].forEach.call($('mmpFilters').children,function(b){\n    b.addEventListener('click',function(){\n      state.filter=b.dataset.f;\n      [].forEach.call($('mmpFilters').children,function(x){ x.setAttribute('aria-pressed', x===b?'true':'false'); });\n      renderBoard();\n    });\n  });<\/p>\n<p>  \/* ---- Modal ---- *\/\n  function openModal(p){\n    $('mmpModalPin').dataset.role=p.role||'today';\n    $('mmpModalRole').textContent=(ROLES[p.role]||ROLES.today).emoji+' '+roleLabel(p.role)+' \u00b7 '+(p.question||'');\n    $('mmpModalText').textContent=isEmoji(p.text)?p.text:('\u201c'+p.text+'\u201d');\n    $('mmpModalId').textContent=archiveId(p);\n    $('mmpModalDate').textContent=fmtDate(p.date);\n    var acts=$('mmpModalActions'); acts.innerHTML='';\n    var s=document.createElement('button'); s.className='mmp-btn mmp-btn--primary mmp-btn--sm'; s.textContent='Als Share Card';\n    s.addEventListener('click',function(){ shareCard(p); });\n    acts.appendChild(s);\n    $('mmpModal').classList.add('show');\n  }\n  function closeModal(){ $('mmpModal').classList.remove('show'); }\n  $('mmpModalX').addEventListener('click',closeModal);\n  $('mmpModal').addEventListener('click',function(e){ if(e.target===$('mmpModal')){ closeModal(); } });\n  document.addEventListener('keydown',function(e){ if(e.key==='Escape'){ closeModal(); } });<\/p>\n<p>  renderRoles();\n  updateState();\n  loadBoard();\n})();\n<\/script><\/p>\n<\/div>\n<p><!--more--><br \/>\n<!-- {\"type\":\"layout\",\"children\":[{\"type\":\"section\",\"name\":\"Archive \u2013 Hero\",\"props\":{\"class\":\"mm-native\",\"image_position\":\"center-center\",\"padding_bottom\":\"small\",\"padding_top\":\"large\",\"style\":\"\",\"title_breakpoint\":\"xl\",\"title_position\":\"top-left\",\"title_rotation\":\"left\",\"vertical_align\":\"\",\"width\":\"large\"},\"children\":[{\"type\":\"row\",\"props\":{\"class\":\"mm-row1\"},\"children\":[{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky_breakpoint\":\"m\"},\"children\":[{\"type\":\"headline\",\"props\":{\"class\":\"mm-eyebrow\",\"content\":\"MeArchive \u00b7 Pinnwand\",\"image_align\":\"left\",\"image_margin\":\"xsmall\",\"text_align\":\"center\",\"text_align_fallback\":\"center\",\"title_element\":\"div\",\"title_style\":\"h6\",\"content_en_us\":\"MeArchive \u00b7 Pinboard\"}},{\"type\":\"headline\",\"props\":{\"class\":\"mm-h1-center\",\"content\":\"Younger Me. Today Me. Future Me.\",\"image_align\":\"left\",\"image_margin\":\"xsmall\",\"margin_bottom\":\"small\",\"text_align\":\"center\",\"text_align_fallback\":\"center\",\"title_element\":\"h1\",\"title_style\":\"h1\",\"content_en_us\":\"Younger Me. Today Me. Future Me.\"}},{\"type\":\"text\",\"props\":{\"class\":\"mm-lead mm-muted mm-center\",\"column_breakpoint\":\"m\",\"content\":\"Drei Perspektiven. Eine Frage an dich.<br \/>Was w&uuml;rdest du deinem j&uuml;ngeren Ich sagen? Was z&auml;hlt heute? Und was w&uuml;nschst du deinem zuk&uuml;nftigen Ich? Teile einen Gedanken &ndash; und entdecke, was andere bewegt.\",\"margin_bottom\":\"default\",\"margin_top\":\"default\",\"text_align\":\"center\",\"content_en_us\":\"Three perspectives. One question for you.<br \/>What would you say to your younger self? What matters today? And what do you wish for your future self? Share a thought &ndash; and discover what moves others.\"}}]}]}]},{\"type\":\"section\",\"name\":\"Archive \u2013 Pinnwand\",\"props\":{\"class\":\"mm-native mm-peachmist\",\"image_position\":\"center-center\",\"style\":\"default\",\"title_breakpoint\":\"xl\",\"title_position\":\"top-left\",\"title_rotation\":\"left\",\"vertical_align\":\"\",\"width\":\"large\"},\"children\":[{\"type\":\"row\",\"props\":{\"class\":\"mm-row1\"},\"children\":[{\"type\":\"column\",\"props\":{\"image_position\":\"center-center\",\"position_sticky_breakpoint\":\"m\"},\"children\":[{\"type\":\"html\",\"props\":{\"content\":\"\n\n<style>\\n\/* MeMatcha ME Archive \u2014 Pinnwand-Widget (namespaced .mmp-). Nutzt Design-System-Tokens. *\/\\n.mmp{--g:#3C4429;--gh:#2F361F;--cream:#F6F1E4;--card:#FDFBF4;--deep:#EDE7DA;\\n  --matcha:#F4C6A4;--matchat:#66704A;--peach:#F4C6A4;--line:rgba(63,64,51,.16);\\n  --linestr:rgba(63,64,51,.30);--sans:'Be Vietnam Pro',-apple-system,sans-serif;\\n  --serif:'Playfair Display',Georgia,serif;--mono:'Be Vietnam Pro',sans-serif;\\n  color:var(--g);font-family:var(--sans);}\\n.mmp *{box-sizing:border-box;}\\n.mmp-eyebrow{font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.16em;\\n  text-transform:uppercase;color:var(--matchat);}\\n.mmp-h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.2vw,42px);\\n  line-height:1.05;letter-spacing:-.01em;margin:8px 0 0;}\\n.mmp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;\\n  font-family:var(--sans);font-weight:700;font-size:16px;line-height:1;padding:15px 28px;\\n  border-radius:999px;border:2px solid transparent;text-decoration:none;transition:.15s;}\\n.mmp-btn--primary{background:var(--g);color:var(--cream);}\\n.mmp-btn--primary:hover{background:var(--gh);}\\n.mmp-btn--ghost{background:transparent;color:var(--g);border-color:var(--g);}\\n.mmp-btn--ghost:hover{background:rgba(63,64,51,.07);}\\n.mmp-btn--matcha{background:var(--cream);color:var(--g);}\\n.mmp-btn--sm{padding:11px 20px;font-size:14px;}\\n.mmp-btn[disabled]{opacity:.4;pointer-events:none;}\\n\\n\/* Composer *\/\\n.mmp-composer{background:var(--g);color:var(--cream);border-radius:28px;\\n  padding:clamp(30px,3.8vw,52px);}\\n.mmp-composer .mmp-eyebrow{color:var(--matcha);}\\n.mmp-composer .mmp-h2{color:var(--cream);}\\n.mmp-lead{color:rgba(246,241,228,.80);margin:14px 0 0;max-width:560px;line-height:1.55;}\\n.mmp-roles{display:flex;gap:clamp(14px,1.7vw,22px);flex-wrap:wrap;margin:34px 0 0;}\\n.mmp-role{flex:1 1 170px;min-width:150px;text-align:left;cursor:pointer;background:rgba(246,241,228,.06);\\n  border:1.5px solid rgba(246,241,228,.22);border-radius:20px;padding:22px 22px;color:var(--cream);\\n  transition:.15s;font-family:var(--sans);}\\n.mmp-role:hover{border-color:rgba(246,241,228,.5);transform:translateY(-2px);}\\n.mmp-role[aria-pressed=\\\"true\\\"]{background:var(--matcha);border-color:var(--matcha);color:var(--g);}\\n.mmp-role b{display:block;font-size:18px;font-weight:800;margin-top:10px;}\\n.mmp-role small{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.82;}\\n.mmp-role .mmp-emoji{font-size:26px;line-height:1;}\\n.mmp-q{margin:42px 0 0;font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.2vw,27px);\\n  line-height:1.3;letter-spacing:-.01em;}\\n.mmp-field{margin:24px 0 0;}\\n.mmp-ta{width:100%;min-height:110px;resize:vertical;background:var(--cream);color:var(--g);\\n  border:none;border-radius:18px;padding:18px 20px;font-family:var(--sans);font-size:17px;line-height:1.45;outline:none;}\\n.mmp-ta::placeholder{color:rgba(63,64,51,.4);}\\n.mmp-metarow{display:flex;justify-content:flex-end;margin:10px 2px 0;}\\n.mmp-count{font-family:var(--mono);font-size:12px;color:rgba(246,241,228,.6);white-space:nowrap;}\\n.mmp-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}\\n.mmp-consent{display:flex;align-items:flex-start;gap:12px;margin:22px 0 0;cursor:pointer;\\n  font-size:14px;line-height:1.5;color:rgba(246,241,228,.82);max-width:600px;}\\n.mmp-consent input{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin-top:1px;\\n  border:1.5px solid rgba(246,241,228,.5);border-radius:7px;background:rgba(246,241,228,.06);\\n  cursor:pointer;position:relative;transition:.15s;}\\n.mmp-consent input:checked{background:var(--matcha);border-color:var(--matcha);}\\n.mmp-consent input:checked::after{content:\\\"\u2713\\\";position:absolute;inset:0;display:flex;align-items:center;\\n  justify-content:center;color:var(--g);font-size:14px;font-weight:800;}\\n.mmp-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 0;}\\n.mmp-hint{display:none;margin:14px 0 0;font-size:14px;color:rgba(246,241,228,.75);}\\n.mmp-hint.show{display:block;}\\n\\n\/* Reward (Post-Submit) *\/\\n.mmp-reward{text-align:left;}\\n.mmp-reward .mmp-eyebrow{color:var(--matcha);}\\n.mmp-reward .mmp-h2{color:var(--cream);}\\n.mmp-reward-id{margin:14px 0 0;font-size:clamp(17px,2vw,20px);color:rgba(246,241,228,.9);}\\n.mmp-reward-id b{font-family:var(--mono);font-weight:700;color:var(--matcha);letter-spacing:.02em;}\\n.mmp-reward-en{font-family:var(--serif);font-style:italic;font-size:clamp(18px,2vw,22px);\\n  color:rgba(246,241,228,.86);margin:8px 0 0;}\\n.mmp-reward-sub{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;\\n  text-transform:uppercase;color:rgba(246,241,228,.62);margin:34px 0 16px;}\\n.mmp-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}\\n.mmp-minicard{background:var(--card);color:var(--g);border-radius:16px;padding:18px 18px 16px;\\n  box-shadow:0 12px 28px -22px rgba(0,0,0,.5);}\\n.mmp-minicard .r{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.1em;\\n  text-transform:uppercase;color:var(--matchat);margin:0 0 8px;}\\n.mmp-minicard .t{font-weight:700;font-size:15px;line-height:1.35;}\\n.mmp-minicard .n{font-family:var(--mono);font-size:10px;color:rgba(63,64,51,.5);margin:12px 0 0;letter-spacing:.04em;}\\n.mmp-minicard[data-role=\\\"younger\\\"]{background:#F1EFE2;}\\n.mmp-minicard[data-role=\\\"today\\\"]{background:#FDEFE2;}\\n.mmp-minicard[data-role=\\\"future\\\"]{background:#ECEADC;}\\n\\n\/* Board *\/\\n.mmp-board-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;\\n  flex-wrap:wrap;margin:0 0 12px;}\\n.mmp-board-sub{font-size:16px;line-height:1.55;color:rgba(63,64,51,.7);max-width:560px;margin:10px 0 26px;}\\n.mmp-filters{display:flex;gap:8px;flex-wrap:wrap;}\\n.mmp-filter{cursor:pointer;background:transparent;border:1px solid var(--linestr);border-radius:999px;\\n  padding:9px 17px;font-family:var(--mono);font-size:12px;letter-spacing:.05em;\\n  color:var(--g);transition:.15s;white-space:nowrap;}\\n.mmp-filter[aria-pressed=\\\"true\\\"]{background:var(--g);color:var(--cream);border-color:var(--g);}\\n.mmp-grid{columns:3 250px;column-gap:22px;}\\n.mmp-grid .mmp-card{break-inside:avoid;margin:0 0 22px;cursor:pointer;\\n  transition:transform .18s ease;}\\n.mmp-grid .mmp-card:hover{transform:translateY(-3px) rotate(0deg)!important;}\\n.mmp-card .mmp-pin{position:relative;background:var(--card);color:var(--g);border:1px solid var(--line);\\n  border-radius:20px;padding:26px 26px 20px;box-shadow:0 14px 30px -22px rgba(0,0,0,.4);}\\n.mmp-pin::before{content:\\\"\\\";position:absolute;top:15px;left:26px;width:11px;height:11px;border-radius:50%;\\n  background:var(--peach);box-shadow:0 2px 4px rgba(0,0,0,.2);}\\n.mmp-pin-role{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.1em;\\n  text-transform:uppercase;color:var(--matchat);margin:6px 0 12px;padding-left:20px;}\\n.mmp-pin-text{font-family:var(--sans);font-weight:700;font-size:clamp(18px,1.9vw,22px);\\n  line-height:1.34;letter-spacing:-.01em;}\\n.mmp-pin-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;}\\n.mmp-pin-id{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--matchat);letter-spacing:.06em;}\\n.mmp-pin-date{font-family:var(--mono);font-size:11px;color:rgba(63,64,51,.5);letter-spacing:.04em;}\\n.mmp-pin[data-role=\\\"younger\\\"]{background:#F1EFE2;}\\n.mmp-pin[data-role=\\\"today\\\"]{background:#FDEFE2;}\\n.mmp-pin[data-role=\\\"future\\\"]{background:#ECEADC;}\\n.mmp-pin[data-role=\\\"younger\\\"]::before{background:#A8B08C;}\\n.mmp-pin[data-role=\\\"future\\\"]::before{background:#D9B27E;}\\n.mmp-share{position:absolute;bottom:16px;right:18px;width:34px;height:34px;border-radius:50%;\\n  border:1px solid var(--linestr);background:rgba(255,255,255,.5);display:flex;align-items:center;\\n  justify-content:center;font-size:15px;color:var(--g);cursor:pointer;transition:.15s;}\\n.mmp-share:hover{background:var(--g);color:var(--cream);}\\n\/* Variable Gr\u00f6\u00dfen & Formen *\/\\n.mmp-card--lg .mmp-pin-text{font-size:clamp(23px,2.6vw,30px);}\\n.mmp-card--lg .mmp-pin{padding:32px 30px 24px;border-radius:26px;}\\n.mmp-card--tall .mmp-pin{padding-bottom:52px;}\\n.mmp-card--soft .mmp-pin{border-radius:30px;}\\n.mmp-card--sharp .mmp-pin{border-radius:12px;}\\n.mmp-card--emoji .mmp-pin{text-align:center;padding:26px 24px 20px;}\\n.mmp-card--emoji .mmp-pin-role{padding-left:0;}\\n.mmp-card--emoji .mmp-pin::before{left:50%;transform:translateX(-50%);}\\n.mmp-card--emoji .mmp-pin-text{font-size:clamp(48px,6vw,66px);line-height:1;margin:10px 0 0;}\\n.mmp-card--emoji .mmp-pin-foot{justify-content:center;margin-top:22px;}\\n.mmp-empty{text-align:center;color:rgba(63,64,51,.55);padding:40px 0;}\\n\\n\/* Modal *\/\\n.mmp-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;\\n  padding:24px;background:rgba(63,64,51,.55);backdrop-filter:blur(4px);}\\n.mmp-modal.show{display:flex;}\\n.mmp-modal-box{max-width:460px;width:100%;}\\n.mmp-modal .mmp-pin{padding:44px 34px 30px;}\\n.mmp-modal .mmp-pin-text{font-size:clamp(22px,3vw,30px);}\\n.mmp-modal-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:18px 0 0;}\\n.mmp-x{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--g);font-size:26px;\\n  cursor:pointer;line-height:1;opacity:.6;}\\n.mmp-x:hover{opacity:1;}\\n\\n\/* Toast *\/\\n.mmp-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);\\n  background:var(--g);color:var(--cream);padding:14px 22px;border-radius:999px;font-weight:600;font-size:15px;\\n  opacity:0;pointer-events:none;transition:.25s;z-index:10000;box-shadow:0 12px 30px -12px rgba(0,0,0,.5);}\\n.mmp-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}\\n\\n@media(max-width:640px){.mmp-grid{columns:1;}.mmp-mini{grid-template-columns:1fr;}}\\n<\/style>\n\n\\n\\n\n\n<div class=\\\"mmp\\\">\\n  <!-- Composer -->\\n  <\/p>\n<div class=\\\"mmp-composer\\\">\\n    <\/p>\n<div id=\\\"mmpComposerMain\\\">\\n      <span class=\\\"mmp-eyebrow\\\">Dein Eintrag<\/span>\\n      <\/p>\n<h2 class=\\\"mmp-h2\\\">Ein Gedanke f&uuml;r dein Ich.<\/h2>\n<p>\\n      <\/p>\n<p class=\\\"mmp-lead\\\">W&auml;hle eine Perspektive und hinterlasse einen Gedanken f&uuml;r dein\\n        Younger Me, Today Me oder Future Me.<\/p>\n<p>\\n\\n      <\/p>\n<div class=\\\"mmp-roles\\\" id=\\\"mmpRoles\\\"><\/div>\n<p>\\n\\n      <\/p>\n<div id=\\\"mmpForm\\\" hidden>\\n        <\/p>\n<p class=\\\"mmp-q\\\" id=\\\"mmpQ\\\">\n<p>\\n        <\/p>\n<div class=\\\"mmp-field\\\">\\n          <textarea class=\\\"mmp-ta\\\" id=\\\"mmpText\\\" maxlength=\\\"180\\\" placeholder=\\\"Dein Gedanke &hellip;\\\"><\/textarea>\\n        <\/div>\n<p>\\n        <\/p>\n<div class=\\\"mmp-metarow\\\"><span class=\\\"mmp-count\\\" id=\\\"mmpCount\\\">0 \/ 180<\/span><\/div>\n<p>\\n        <input class=\\\"mmp-hp\\\" id=\\\"mmpHp\\\" tabindex=\\\"-1\\\" autocomplete=\\\"off\\\" placeholder=\\\"Website\\\">\\n\\n        <label class=\\\"mmp-consent\\\">\\n          <input type=\\\"checkbox\\\" id=\\\"mmpConsent\\\">\\n          <span>Ich stimme zu, dass meine anonyme Antwort von MeMatcha ver&ouml;ffentlicht werden darf.<\/span>\\n        <\/label>\\n\\n        <\/p>\n<div class=\\\"mmp-actions\\\">\\n          <button class=\\\"mmp-btn mmp-btn--matcha\\\" id=\\\"mmpPin\\\">In das Archive pinnen<\/button>\\n          <button class=\\\"mmp-btn mmp-btn--ghost\\\" id=\\\"mmpShare\\\" style=\\\"color:var(--cream);border-color:rgba(246,241,228,.4);\\\">Als Share Card<\/button>\\n        <\/div>\n<p>\\n        <\/p>\n<p class=\\\"mmp-hint\\\" id=\\\"mmpHint\\\">\n<p>\\n      <\/p><\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n\\n    <!-- Reward -->\\n    <\/p>\n<div class=\\\"mmp-reward\\\" id=\\\"mmpReward\\\" hidden>\\n      <span class=\\\"mmp-eyebrow\\\">&#10003; Archiviert<\/span>\\n      <\/p>\n<h2 class=\\\"mmp-h2\\\">Willkommen im ME Archive.<\/h2>\n<p>\\n      <\/p>\n<p class=\\\"mmp-reward-id\\\">Dein Gedanke ist jetzt <b id=\\\"mmpRewardId\\\">#000000<\/b>.<\/p>\n<p>\\n      <\/p>\n<p class=\\\"mmp-reward-en\\\">Your thought is part of the Archive.<\/p>\n<p>\\n      <\/p>\n<p class=\\\"mmp-reward-sub\\\">3 Gedanken aus der Community f&uuml;r dich<\/p>\n<p>\\n      <\/p>\n<div class=\\\"mmp-mini\\\" id=\\\"mmpMini\\\"><\/div>\n<p>\\n      <\/p>\n<div class=\\\"mmp-actions\\\">\\n        <button class=\\\"mmp-btn mmp-btn--matcha\\\" id=\\\"mmpRewardShare\\\">Als Share Card speichern<\/button>\\n        <button class=\\\"mmp-btn mmp-btn--ghost\\\" id=\\\"mmpRewardAgain\\\" style=\\\"color:var(--cream);border-color:rgba(246,241,228,.4);\\\">Noch einen Gedanken teilen<\/button>\\n      <\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n  <\/p><\/div>\n<p>\\n\\n  <!-- Board -->\\n  <\/p>\n<div style=\\\"margin-top:64px;\\\">\\n    <\/p>\n<div class=\\\"mmp-board-head\\\">\\n      <\/p>\n<div>\\n        <span class=\\\"mmp-eyebrow\\\">Die Pinnwand<\/span>\\n        <\/p>\n<h2 class=\\\"mmp-h2\\\">Gedanken der Community.<\/h2>\n<p>\\n      <\/p><\/div>\n<p>\\n      <\/p>\n<div class=\\\"mmp-filters\\\" id=\\\"mmpFilters\\\">\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"all\\\" aria-pressed=\\\"true\\\">Alle<\/button>\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"younger\\\" aria-pressed=\\\"false\\\">\ud83c\udf31 Younger Me<\/button>\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"today\\\" aria-pressed=\\\"false\\\">\ud83c\udf3f Today Me<\/button>\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"future\\\" aria-pressed=\\\"false\\\">\u2b50 Future Me<\/button>\\n      <\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n    <\/p>\n<p class=\\\"mmp-board-sub\\\">Ein Gedanke. Eine Perspektive. Vielleicht erkennst du dich darin wieder.<\/p>\n<p>\\n    <\/p>\n<div class=\\\"mmp-grid\\\" id=\\\"mmpBoard\\\">\n<div class=\\\"mmp-empty\\\">Pinnwand wird geladen &hellip;<\/div>\n<\/div>\n<p>\\n  <\/p><\/div>\n<p>\\n\\n  <!-- Modal -->\\n  <\/p>\n<div class=\\\"mmp-modal\\\" id=\\\"mmpModal\\\">\\n    <\/p>\n<div class=\\\"mmp-modal-box\\\">\\n      <\/p>\n<div class=\\\"mmp-pin\\\" id=\\\"mmpModalPin\\\" data-role=\\\"today\\\">\\n        <button class=\\\"mmp-x\\\" id=\\\"mmpModalX\\\" aria-label=\\\"Schlie&szlig;en\\\">&times;<\/button>\\n        <\/p>\n<div class=\\\"mmp-pin-role\\\" id=\\\"mmpModalRole\\\"><\/div>\n<p>\\n        <\/p>\n<div class=\\\"mmp-pin-text\\\" id=\\\"mmpModalText\\\"><\/div>\n<p>\\n        <\/p>\n<div class=\\\"mmp-pin-foot\\\"><span class=\\\"mmp-pin-id\\\" id=\\\"mmpModalId\\\"><\/span><span class=\\\"mmp-pin-date\\\" id=\\\"mmpModalDate\\\"><\/span><\/div>\n<p>\\n      <\/p><\/div>\n<p>\\n      <\/p>\n<div class=\\\"mmp-modal-actions\\\" id=\\\"mmpModalActions\\\"><\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n  <\/p><\/div>\n<p>\\n\\n  <canvas id=\\\"mmpCanvas\\\" width=\\\"1080\\\" height=\\\"1920\\\" style=\\\"display:none;\\\"><\/canvas>\\n  <\/p>\n<div class=\\\"mmp-toast\\\" id=\\\"mmpToast\\\"><\/div>\n<p>\\n<\/p><\/div>\n<p>\\n\\n<script>\\n(function(){\\n  var API = '\/wp-json\/mematcha\/v1\/pins';\\n  var HASHTAG = '#MeMatcha #MeArchive';\\n  var ROLES = {\\n    younger: { label:'Younger Me', emoji:'\ud83c\udf31', tag:'R\u00fcckblick' },\\n    today:   { label:'Today Me',   emoji:'\ud83c\udf3f', tag:'Jetzt' },\\n    future:  { label:'Future Me',  emoji:'\u2b50', tag:'Ausblick' }\\n  };\\n  \/* W\u00f6chentlich rotierende Fragen. Jede Woche wird der n\u00e4chste Satz aktiv.\\n     Aktuell 1 Satz -> immer sichtbar; weitere S\u00e4tze einfach unten anh\u00e4ngen. *\/\\n  var WEEKLY_QUESTIONS = [\\n    { younger:'Wof\u00fcr w\u00fcrde dir dein 10-j\u00e4hriges Ich heute ein High Five geben?',\\n      today:'Was raubt dir gerade Energie, ohne Miete zu zahlen?',\\n      future:'Wenn dein zuk\u00fcnftiges Ich dir heute nur ein Emoji schicken k\u00f6nnte \u2013 welches w\u00e4re es?' }\\n  ];\\n  function isoWeek(){\\n    try{\\n      var d=new Date(); d.setHours(0,0,0,0);\\n      d.setDate(d.getDate()+3-((d.getDay()+6)%7));\\n      var w1=new Date(d.getFullYear(),0,4);\\n      return 1+Math.round(((d-w1)\/86400000-3+((w1.getDay()+6)%7))\/7);\\n    }catch(e){ return 0; }\\n  }\\n  function weekSet(){ return WEEKLY_QUESTIONS[isoWeek()%WEEKLY_QUESTIONS.length]; }\\n  function questionFor(role){ var s=weekSet(); return s[role]||''; }\\n\\n  var state = { role:null, filter:'all', pins:[], last:null };\\n  var $ = function(id){ return document.getElementById(id); };\\n\\n  function roleLabel(r){ return (ROLES[r]||ROLES.today).label; }\\n  function fmtDate(iso){ try{ var d=new Date(iso); return d.toLocaleDateString('de-DE',{day:'numeric',month:'short',year:'numeric'});}catch(e){return '';} }\\n  function archiveId(p){ if(p.archive){ return p.archive; } return '#'+String(p.id||0); }\\n  function isEmoji(t){ return !\/[A-Za-z\u00c0-\u00ff0-9]\/.test(String(t||'')); }\\n  function toast(msg){ var t=$('mmpToast'); t.textContent=msg; t.classList.add('show'); setTimeout(function(){t.classList.remove('show');},2800); }\\n\\n  \/* ---- Composer ---- *\/\\n  function renderRoles(){\\n    var wrap=$('mmpRoles'); wrap.innerHTML='';\\n    Object.keys(ROLES).forEach(function(k){\\n      var r=ROLES[k];\\n      var b=document.createElement('button');\\n      b.className='mmp-role'; b.setAttribute('aria-pressed','false'); b.dataset.role=k;\\n      b.innerHTML='<span class=\\\"mmp-emoji\\\">'+r.emoji+'<\/span><b>'+r.label+'<\/b><small>'+r.tag+'<\/small>';\\n      b.addEventListener('click',function(){ selectRole(k); });\\n      wrap.appendChild(b);\\n    });\\n  }\\n  function selectRole(k){\\n    state.role=k;\\n    [].forEach.call($('mmpRoles').children,function(b){ b.setAttribute('aria-pressed', b.dataset.role===k?'true':'false'); });\\n    $('mmpQ').textContent=questionFor(k);\\n    $('mmpForm').hidden=false;\\n    updateState();\\n    $('mmpText').focus();\\n  }\\n  function updateState(){\\n    var text=$('mmpText').value.trim();\\n    $('mmpCount').textContent=$('mmpText').value.length+' \/ 180';\\n    var ok=true;\\n    if(!state.role){ ok=false; }\\n    if(text.length<2){ ok=false; }\\n    if(!$('mmpConsent').checked){ ok=false; }\\n    $('mmpPin').disabled=!ok;\\n  }\\n  $('mmpText').addEventListener('input',updateState);\\n  $('mmpConsent').addEventListener('change',updateState);\\n\\n  function pinIt(){\\n    if($('mmpHp').value){ return; }\\n    var text=$('mmpText').value.trim();\\n    if(!state.role){ return; }\\n    if(text.length<2){ return; }\\n    if(!$('mmpConsent').checked){ toast('Bitte best\u00e4tige die Ver\u00f6ffentlichung.'); return; }\\n    var payload={ role:state.role, question:questionFor(state.role), text:text,\\n      author:'', website:'', consent:true };\\n    $('mmpPin').disabled=true; $('mmpPin').textContent='Wird gepinnt \u2026';\\n    fetch(API,{method:'POST',headers:{'Content-Type':'application\/json'},body:JSON.stringify(payload)})\\n      .then(function(r){ return r.json().then(function(d){ return {ok:r.ok,d:d}; }); })\\n      .then(function(res){\\n        $('mmpPin').textContent='In das Archive pinnen'; $('mmpPin').disabled=false;\\n        if(!res.ok){ toast((res.d||{}).message ? res.d.message : 'Hat nicht geklappt.'); return; }\\n        state.last=res.d;\\n        if(!res.d.pending){ state.pins.unshift(res.d); renderBoard(); }\\n        showReward(res.d);\\n      })\\n      .catch(function(){ $('mmpPin').textContent='In das Archive pinnen'; $('mmpPin').disabled=false; toast('Netzwerkfehler.'); });\\n  }\\n  $('mmpPin').addEventListener('click',pinIt);\\n  $('mmpShare').addEventListener('click',function(){\\n    var text=$('mmpText').value.trim(); if(!text){ toast('Schreib zuerst deinen Gedanken.'); return; }\\n    shareCard({ role:state.role||'today', text:text, archive:'#\u2014' });\\n  });\\n\\n  \/* ---- Reward \/ Post-Submit ---- *\/\\n  function showReward(p){\\n    $('mmpRewardId').textContent=archiveId(p);\\n    var mini=$('mmpMini'); mini.innerHTML='';\\n    var pool=state.pins.filter(function(x){ return x.id!==p.id; });\\n    pick(pool,3).forEach(function(x){\\n      var c=document.createElement('div'); c.className='mmp-minicard'; c.dataset.role=x.role||'today';\\n      var r=document.createElement('div'); r.className='r'; r.textContent=(ROLES[x.role]||ROLES.today).emoji+' '+roleLabel(x.role);\\n      var t=document.createElement('div'); t.className='t'; t.textContent=(isEmoji(x.text)?'':'\u201c')+x.text+(isEmoji(x.text)?'':'\u201d');\\n      var n=document.createElement('div'); n.className='n'; n.textContent=archiveId(x);\\n      c.appendChild(r); c.appendChild(t); c.appendChild(n); mini.appendChild(c);\\n    });\\n    $('mmpComposerMain').hidden=true; $('mmpReward').hidden=false;\\n    try{ $('mmpReward').scrollIntoView({behavior:'smooth',block:'center'}); }catch(e){}\\n  }\\n  $('mmpRewardShare').addEventListener('click',function(){ if(state.last){ shareCard(state.last); } });\\n  $('mmpRewardAgain').addEventListener('click',function(){\\n    $('mmpReward').hidden=true; $('mmpComposerMain').hidden=false;\\n    state.role=null; state.last=null;\\n    [].forEach.call($('mmpRoles').children,function(b){ b.setAttribute('aria-pressed','false'); });\\n    $('mmpForm').hidden=true; $('mmpText').value=''; $('mmpConsent').checked=false; updateState();\\n    try{ $('mmpComposerMain').scrollIntoView({behavior:'smooth',block:'start'}); }catch(e){}\\n  });\\n  function pick(arr,n){\\n    var a=arr.slice(), out=[];\\n    while(a.length){ if(out.length>=n){ break; } var i=Math.floor(Math.random()*a.length); out.push(a.splice(i,1)[0]); }\\n    return out;\\n  }\\n\\n  \/* ---- Share Card (Canvas -> Bild) ---- *\/\\n  var CARD_BG={ younger:'#EEF0E2', today:'#FDEFE2', future:'#E9E7D8' };\\n  var CARD_AC={ younger:'#66704A', today:'#C0824F', future:'#3C4429' };\\n  function wrap(ctx,text,maxW){\\n    var words=String(text).split(' '), lines=[], line='';\\n    words.forEach(function(w){\\n      var test=line?line+' '+w:w;\\n      if(ctx.measureText(test).width>maxW){ if(line){ lines.push(line); } line=w; }\\n      else { line=test; }\\n    });\\n    if(line){ lines.push(line); }\\n    return lines;\\n  }\\n  function drawCard(p,cb){\\n    var cv=$('mmpCanvas'), ctx=cv.getContext('2d');\\n    var W=1080, H=1920, role=p.role||'today';\\n    ctx.clearRect(0,0,W,H);\\n    ctx.fillStyle=CARD_BG[role]||'#FDEFE2'; ctx.fillRect(0,0,W,H);\\n    ctx.fillStyle=CARD_AC[role]||'#66704A';\\n    ctx.textAlign='center';\\n    \/\/ Top-Label\\n    try{ ctx.letterSpacing='10px'; }catch(e){}\\n    ctx.font='600 30px \\\"Be Vietnam Pro\\\", sans-serif';\\n    ctx.fillText('THE ME ARCHIVE', W\/2, 200);\\n    \/\/ Rolle gro\u00df\\n    ctx.font='800 78px \\\"Be Vietnam Pro\\\", sans-serif';\\n    ctx.fillText(roleLabel(role).toUpperCase(), W\/2, 330);\\n    try{ ctx.letterSpacing='0px'; }catch(e){}\\n    \/\/ Zitat\\n    ctx.fillStyle='#3C4429';\\n    if(isEmoji(p.text)){\\n      ctx.font='300px \\\"Be Vietnam Pro\\\", sans-serif';\\n      ctx.textBaseline='middle';\\n      ctx.fillText(p.text, W\/2, H\/2);\\n      ctx.textBaseline='alphabetic';\\n    } else {\\n      var t=String(p.text);\\n      var fs = t.length<46 ? 88 : (t.length<95 ? 68 : 54);\\n      ctx.font='500 '+fs+'px \\\"Playfair Display\\\", Georgia, serif';\\n      var lines=wrap(ctx,'\u201c'+t+'\u201d', W-260);\\n      var lh=fs*1.22, startY=H\/2-((lines.length-1)*lh)\/2;\\n      ctx.textBaseline='middle';\\n      lines.forEach(function(ln,i){ ctx.fillText(ln, W\/2, startY+i*lh); });\\n      ctx.textBaseline='alphabetic';\\n    }\\n    \/\/ Footer: Archive-ID + Wortmarke\\n    ctx.fillStyle=CARD_AC[role]||'#66704A';\\n    try{ ctx.letterSpacing='6px'; }catch(e){}\\n    ctx.font='600 30px \\\"Be Vietnam Pro\\\", sans-serif';\\n    ctx.fillText('THE ME ARCHIVE \u00b7 '+(p.archive||'#\u2014'), W\/2, H-230);\\n    try{ ctx.letterSpacing='0px'; }catch(e){}\\n    ctx.fillStyle='#3C4429';\\n    ctx.font='500 56px \\\"Playfair Display\\\", Georgia, serif';\\n    ctx.fillText('MeMatcha', W\/2, H-140);\\n    cb(cv);\\n  }\\n  function shareCard(p){\\n    var run=function(){\\n      drawCard(p,function(cv){\\n        var name='me-archive-'+String(p.archive||'').replace(\/[^0-9]\/g,'')+'.png';\\n        var caption=(isEmoji(p.text)?p.text:'\u201c'+p.text+'\u201d')+' \u2014 THE ME ARCHIVE '+(p.archive||'')+'\\\\n\\\\n'+HASHTAG;\\n        cv.toBlob(function(blob){\\n          if(!blob){ fallbackDL(cv,name); return; }\\n          if(navigator.canShare){\\n            var file=new File([blob],name,{type:'image\/png'});\\n            if(navigator.canShare({files:[file]})){\\n              navigator.share({files:[file],text:caption}).then(function(){}).catch(function(){ fallbackDL(cv,name); });\\n              return;\\n            }\\n          }\\n          fallbackDL(cv,name);\\n        },'image\/png');\\n      });\\n    };\\n    if(document.fonts){ document.fonts.ready.then(run).catch(run); } else { run(); }\\n  }\\n  function fallbackDL(cv,name){\\n    try{\\n      var a=document.createElement('a'); a.download=name; a.href=cv.toDataURL('image\/png');\\n      document.body.appendChild(a); a.click(); document.body.removeChild(a);\\n      toast('Share Card gespeichert \u2013 jetzt in Story\/WhatsApp posten \u2728');\\n    }catch(e){ toast('Konnte Share Card nicht erstellen.'); }\\n  }\\n\\n  \/* ---- Board ---- *\/\\n  function variant(p,i){\\n    var cls=[];\\n    var n=parseInt(String(p.archive||p.id||'0').replace(\/[^0-9]\/g,''),10)||i;\\n    if(isEmoji(p.text)){ cls.push('mmp-card--emoji'); }\\n    else{\\n      if(p.text.length>120){ cls.push('mmp-card--lg'); }\\n      else if(n%5===0){ cls.push('mmp-card--lg'); }\\n      if(n%3===0){ cls.push('mmp-card--tall'); }\\n    }\\n    var shapes=['','mmp-card--soft','','mmp-card--sharp',''];\\n    cls.push(shapes[n%shapes.length]);\\n    return cls.join(' ');\\n  }\\n  var ROT=['-1.1deg','0.7deg','-0.5deg','1deg','0deg','-0.8deg'];\\n  function pinNode(p,i){\\n    var card=document.createElement('div'); card.className=('mmp-card '+variant(p,i)).trim();\\n    card.style.transform='rotate('+ROT[i%ROT.length]+')';\\n    var pin=document.createElement('div'); pin.className='mmp-pin'; pin.dataset.role=p.role||'today';\\n    var role=document.createElement('div'); role.className='mmp-pin-role';\\n    role.textContent=(ROLES[p.role]||ROLES.today).emoji+' '+roleLabel(p.role);\\n    var text=document.createElement('div'); text.className='mmp-pin-text';\\n    text.textContent=isEmoji(p.text)?p.text:('\u201c'+p.text+'\u201d');\\n    var foot=document.createElement('div'); foot.className='mmp-pin-foot';\\n    var idv=document.createElement('span'); idv.className='mmp-pin-id'; idv.textContent=archiveId(p);\\n    var dt=document.createElement('span'); dt.className='mmp-pin-date'; dt.textContent=fmtDate(p.date);\\n    foot.appendChild(idv); foot.appendChild(dt);\\n    var sh=document.createElement('button'); sh.className='mmp-share'; sh.title='Als Share Card'; sh.textContent='\u2197';\\n    sh.addEventListener('click',function(e){ e.stopPropagation(); shareCard(p); });\\n    pin.appendChild(role); pin.appendChild(text); pin.appendChild(foot); pin.appendChild(sh);\\n    card.appendChild(pin);\\n    card.addEventListener('click',function(){ openModal(p); });\\n    return card;\\n  }\\n  function renderBoard(){\\n    var board=$('mmpBoard'); board.innerHTML='';\\n    var list=state.pins.filter(function(p){ if(state.filter==='all'){ return true; } return p.role===state.filter; });\\n    if(!list.length){ board.innerHTML='<\/p>\n<div class=\\\"mmp-empty\\\">Noch keine Gedanken hier \u2013 sei die\/der Erste \u2728<\/div>\n<p>'; return; }\\n    list.forEach(function(p,i){ board.appendChild(pinNode(p,i)); });\\n  }\\n  function loadBoard(){\\n    fetch(API).then(function(r){ return r.json(); }).then(function(d){\\n      state.pins=Array.isArray(d)?d:[]; renderBoard();\\n    }).catch(function(){ $('mmpBoard').innerHTML='<\/p>\n<div class=\\\"mmp-empty\\\">Pinnwand konnte nicht geladen werden.<\/div>\n<p>'; });\\n  }\\n  [].forEach.call($('mmpFilters').children,function(b){\\n    b.addEventListener('click',function(){\\n      state.filter=b.dataset.f;\\n      [].forEach.call($('mmpFilters').children,function(x){ x.setAttribute('aria-pressed', x===b?'true':'false'); });\\n      renderBoard();\\n    });\\n  });\\n\\n  \/* ---- Modal ---- *\/\\n  function openModal(p){\\n    $('mmpModalPin').dataset.role=p.role||'today';\\n    $('mmpModalRole').textContent=(ROLES[p.role]||ROLES.today).emoji+' '+roleLabel(p.role)+' \u00b7 '+(p.question||'');\\n    $('mmpModalText').textContent=isEmoji(p.text)?p.text:('\u201c'+p.text+'\u201d');\\n    $('mmpModalId').textContent=archiveId(p);\\n    $('mmpModalDate').textContent=fmtDate(p.date);\\n    var acts=$('mmpModalActions'); acts.innerHTML='';\\n    var s=document.createElement('button'); s.className='mmp-btn mmp-btn--primary mmp-btn--sm'; s.textContent='Als Share Card';\\n    s.addEventListener('click',function(){ shareCard(p); });\\n    acts.appendChild(s);\\n    $('mmpModal').classList.add('show');\\n  }\\n  function closeModal(){ $('mmpModal').classList.remove('show'); }\\n  $('mmpModalX').addEventListener('click',closeModal);\\n  $('mmpModal').addEventListener('click',function(e){ if(e.target===$('mmpModal')){ closeModal(); } });\\n  document.addEventListener('keydown',function(e){ if(e.key==='Escape'){ closeModal(); } });\\n\\n  renderRoles();\\n  updateState();\\n  loadBoard();\\n})();\\n<\/script>\\n&#8221;,&#8221;content_en_us&#8221;:&#8221;<\/p>\n<style>\\n\/* MeMatcha ME Archive \u2014 Pinnwand-Widget (namespaced .mmp-). Nutzt Design-System-Tokens. *\/\\n.mmp{--g:#3C4429;--gh:#2F361F;--cream:#F6F1E4;--card:#FDFBF4;--deep:#EDE7DA;\\n  --matcha:#F4C6A4;--matchat:#66704A;--peach:#F4C6A4;--line:rgba(63,64,51,.16);\\n  --linestr:rgba(63,64,51,.30);--sans:'Be Vietnam Pro',-apple-system,sans-serif;\\n  --serif:'Playfair Display',Georgia,serif;--mono:'Be Vietnam Pro',sans-serif;\\n  color:var(--g);font-family:var(--sans);}\\n.mmp *{box-sizing:border-box;}\\n.mmp-eyebrow{font-family:var(--mono);font-size:13px;font-weight:600;letter-spacing:.16em;\\n  text-transform:uppercase;color:var(--matchat);}\\n.mmp-h2{font-family:var(--serif);font-weight:500;font-size:clamp(28px,3.2vw,42px);\\n  line-height:1.05;letter-spacing:-.01em;margin:8px 0 0;}\\n.mmp-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;\\n  font-family:var(--sans);font-weight:700;font-size:16px;line-height:1;padding:15px 28px;\\n  border-radius:999px;border:2px solid transparent;text-decoration:none;transition:.15s;}\\n.mmp-btn--primary{background:var(--g);color:var(--cream);}\\n.mmp-btn--primary:hover{background:var(--gh);}\\n.mmp-btn--ghost{background:transparent;color:var(--g);border-color:var(--g);}\\n.mmp-btn--ghost:hover{background:rgba(63,64,51,.07);}\\n.mmp-btn--matcha{background:var(--cream);color:var(--g);}\\n.mmp-btn--sm{padding:11px 20px;font-size:14px;}\\n.mmp-btn[disabled]{opacity:.4;pointer-events:none;}\\n\\n\/* Composer *\/\\n.mmp-composer{background:var(--g);color:var(--cream);border-radius:28px;\\n  padding:clamp(30px,3.8vw,52px);}\\n.mmp-composer .mmp-eyebrow{color:var(--matcha);}\\n.mmp-composer .mmp-h2{color:var(--cream);}\\n.mmp-lead{color:rgba(246,241,228,.80);margin:14px 0 0;max-width:560px;line-height:1.55;}\\n.mmp-roles{display:flex;gap:clamp(14px,1.7vw,22px);flex-wrap:wrap;margin:34px 0 0;}\\n.mmp-role{flex:1 1 170px;min-width:150px;text-align:left;cursor:pointer;background:rgba(246,241,228,.06);\\n  border:1.5px solid rgba(246,241,228,.22);border-radius:20px;padding:22px 22px;color:var(--cream);\\n  transition:.15s;font-family:var(--sans);}\\n.mmp-role:hover{border-color:rgba(246,241,228,.5);transform:translateY(-2px);}\\n.mmp-role[aria-pressed=\\\"true\\\"]{background:var(--matcha);border-color:var(--matcha);color:var(--g);}\\n.mmp-role b{display:block;font-size:18px;font-weight:800;margin-top:10px;}\\n.mmp-role small{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.82;}\\n.mmp-role .mmp-emoji{font-size:26px;line-height:1;}\\n.mmp-q{margin:42px 0 0;font-family:var(--serif);font-weight:500;font-size:clamp(20px,2.2vw,27px);\\n  line-height:1.3;letter-spacing:-.01em;}\\n.mmp-field{margin:24px 0 0;}\\n.mmp-ta{width:100%;min-height:110px;resize:vertical;background:var(--cream);color:var(--g);\\n  border:none;border-radius:18px;padding:18px 20px;font-family:var(--sans);font-size:17px;line-height:1.45;outline:none;}\\n.mmp-ta::placeholder{color:rgba(63,64,51,.4);}\\n.mmp-metarow{display:flex;justify-content:flex-end;margin:10px 2px 0;}\\n.mmp-count{font-family:var(--mono);font-size:12px;color:rgba(246,241,228,.6);white-space:nowrap;}\\n.mmp-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}\\n.mmp-consent{display:flex;align-items:flex-start;gap:12px;margin:22px 0 0;cursor:pointer;\\n  font-size:14px;line-height:1.5;color:rgba(246,241,228,.82);max-width:600px;}\\n.mmp-consent input{appearance:none;-webkit-appearance:none;flex:none;width:22px;height:22px;margin-top:1px;\\n  border:1.5px solid rgba(246,241,228,.5);border-radius:7px;background:rgba(246,241,228,.06);\\n  cursor:pointer;position:relative;transition:.15s;}\\n.mmp-consent input:checked{background:var(--matcha);border-color:var(--matcha);}\\n.mmp-consent input:checked::after{content:\\\"\u2713\\\";position:absolute;inset:0;display:flex;align-items:center;\\n  justify-content:center;color:var(--g);font-size:14px;font-weight:800;}\\n.mmp-actions{display:flex;gap:12px;flex-wrap:wrap;margin:24px 0 0;}\\n.mmp-hint{display:none;margin:14px 0 0;font-size:14px;color:rgba(246,241,228,.75);}\\n.mmp-hint.show{display:block;}\\n\\n\/* Reward (Post-Submit) *\/\\n.mmp-reward{text-align:left;}\\n.mmp-reward .mmp-eyebrow{color:var(--matcha);}\\n.mmp-reward .mmp-h2{color:var(--cream);}\\n.mmp-reward-id{margin:14px 0 0;font-size:clamp(17px,2vw,20px);color:rgba(246,241,228,.9);}\\n.mmp-reward-id b{font-family:var(--mono);font-weight:700;color:var(--matcha);letter-spacing:.02em;}\\n.mmp-reward-en{font-family:var(--serif);font-style:italic;font-size:clamp(18px,2vw,22px);\\n  color:rgba(246,241,228,.86);margin:8px 0 0;}\\n.mmp-reward-sub{font-family:var(--mono);font-size:12px;font-weight:600;letter-spacing:.14em;\\n  text-transform:uppercase;color:rgba(246,241,228,.62);margin:34px 0 16px;}\\n.mmp-mini{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}\\n.mmp-minicard{background:var(--card);color:var(--g);border-radius:16px;padding:18px 18px 16px;\\n  box-shadow:0 12px 28px -22px rgba(0,0,0,.5);}\\n.mmp-minicard .r{font-family:var(--mono);font-size:10px;font-weight:600;letter-spacing:.1em;\\n  text-transform:uppercase;color:var(--matchat);margin:0 0 8px;}\\n.mmp-minicard .t{font-weight:700;font-size:15px;line-height:1.35;}\\n.mmp-minicard .n{font-family:var(--mono);font-size:10px;color:rgba(63,64,51,.5);margin:12px 0 0;letter-spacing:.04em;}\\n.mmp-minicard[data-role=\\\"younger\\\"]{background:#F1EFE2;}\\n.mmp-minicard[data-role=\\\"today\\\"]{background:#FDEFE2;}\\n.mmp-minicard[data-role=\\\"future\\\"]{background:#ECEADC;}\\n\\n\/* Board *\/\\n.mmp-board-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;\\n  flex-wrap:wrap;margin:0 0 12px;}\\n.mmp-board-sub{font-size:16px;line-height:1.55;color:rgba(63,64,51,.7);max-width:560px;margin:10px 0 26px;}\\n.mmp-filters{display:flex;gap:8px;flex-wrap:wrap;}\\n.mmp-filter{cursor:pointer;background:transparent;border:1px solid var(--linestr);border-radius:999px;\\n  padding:9px 17px;font-family:var(--mono);font-size:12px;letter-spacing:.05em;\\n  color:var(--g);transition:.15s;white-space:nowrap;}\\n.mmp-filter[aria-pressed=\\\"true\\\"]{background:var(--g);color:var(--cream);border-color:var(--g);}\\n.mmp-grid{columns:3 250px;column-gap:22px;}\\n.mmp-grid .mmp-card{break-inside:avoid;margin:0 0 22px;cursor:pointer;\\n  transition:transform .18s ease;}\\n.mmp-grid .mmp-card:hover{transform:translateY(-3px) rotate(0deg)!important;}\\n.mmp-card .mmp-pin{position:relative;background:var(--card);color:var(--g);border:1px solid var(--line);\\n  border-radius:20px;padding:26px 26px 20px;box-shadow:0 14px 30px -22px rgba(0,0,0,.4);}\\n.mmp-pin::before{content:\\\"\\\";position:absolute;top:15px;left:26px;width:11px;height:11px;border-radius:50%;\\n  background:var(--peach);box-shadow:0 2px 4px rgba(0,0,0,.2);}\\n.mmp-pin-role{font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.1em;\\n  text-transform:uppercase;color:var(--matchat);margin:6px 0 12px;padding-left:20px;}\\n.mmp-pin-text{font-family:var(--sans);font-weight:700;font-size:clamp(18px,1.9vw,22px);\\n  line-height:1.34;letter-spacing:-.01em;}\\n.mmp-pin-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:20px;}\\n.mmp-pin-id{font-family:var(--mono);font-size:11px;font-weight:600;color:var(--matchat);letter-spacing:.06em;}\\n.mmp-pin-date{font-family:var(--mono);font-size:11px;color:rgba(63,64,51,.5);letter-spacing:.04em;}\\n.mmp-pin[data-role=\\\"younger\\\"]{background:#F1EFE2;}\\n.mmp-pin[data-role=\\\"today\\\"]{background:#FDEFE2;}\\n.mmp-pin[data-role=\\\"future\\\"]{background:#ECEADC;}\\n.mmp-pin[data-role=\\\"younger\\\"]::before{background:#A8B08C;}\\n.mmp-pin[data-role=\\\"future\\\"]::before{background:#D9B27E;}\\n.mmp-share{position:absolute;bottom:16px;right:18px;width:34px;height:34px;border-radius:50%;\\n  border:1px solid var(--linestr);background:rgba(255,255,255,.5);display:flex;align-items:center;\\n  justify-content:center;font-size:15px;color:var(--g);cursor:pointer;transition:.15s;}\\n.mmp-share:hover{background:var(--g);color:var(--cream);}\\n\/* Variable Gr\u00f6\u00dfen & Formen *\/\\n.mmp-card--lg .mmp-pin-text{font-size:clamp(23px,2.6vw,30px);}\\n.mmp-card--lg .mmp-pin{padding:32px 30px 24px;border-radius:26px;}\\n.mmp-card--tall .mmp-pin{padding-bottom:52px;}\\n.mmp-card--soft .mmp-pin{border-radius:30px;}\\n.mmp-card--sharp .mmp-pin{border-radius:12px;}\\n.mmp-card--emoji .mmp-pin{text-align:center;padding:26px 24px 20px;}\\n.mmp-card--emoji .mmp-pin-role{padding-left:0;}\\n.mmp-card--emoji .mmp-pin::before{left:50%;transform:translateX(-50%);}\\n.mmp-card--emoji .mmp-pin-text{font-size:clamp(48px,6vw,66px);line-height:1;margin:10px 0 0;}\\n.mmp-card--emoji .mmp-pin-foot{justify-content:center;margin-top:22px;}\\n.mmp-empty{text-align:center;color:rgba(63,64,51,.55);padding:40px 0;}\\n\\n\/* Modal *\/\\n.mmp-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;\\n  padding:24px;background:rgba(63,64,51,.55);backdrop-filter:blur(4px);}\\n.mmp-modal.show{display:flex;}\\n.mmp-modal-box{max-width:460px;width:100%;}\\n.mmp-modal .mmp-pin{padding:44px 34px 30px;}\\n.mmp-modal .mmp-pin-text{font-size:clamp(22px,3vw,30px);}\\n.mmp-modal-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:18px 0 0;}\\n.mmp-x{position:absolute;top:14px;right:16px;background:none;border:none;color:var(--g);font-size:26px;\\n  cursor:pointer;line-height:1;opacity:.6;}\\n.mmp-x:hover{opacity:1;}\\n\\n\/* Toast *\/\\n.mmp-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);\\n  background:var(--g);color:var(--cream);padding:14px 22px;border-radius:999px;font-weight:600;font-size:15px;\\n  opacity:0;pointer-events:none;transition:.25s;z-index:10000;box-shadow:0 12px 30px -12px rgba(0,0,0,.5);}\\n.mmp-toast.show{opacity:1;transform:translateX(-50%) translateY(0);}\\n\\n@media(max-width:640px){.mmp-grid{columns:1;}.mmp-mini{grid-template-columns:1fr;}}\\n<\/style>\n<p>\\n\\n<\/p>\n<div class=\\\"mmp\\\">\\n  <!-- Composer -->\\n  <\/p>\n<div class=\\\"mmp-composer\\\">\\n    <\/p>\n<div id=\\\"mmpComposerMain\\\">\\n      <span class=\\\"mmp-eyebrow\\\">Your Entry<\/span>\\n      <\/p>\n<h2 class=\\\"mmp-h2\\\">A thought for your self.<\/h2>\n<p>\\n      <\/p>\n<p class=\\\"mmp-lead\\\">Choose a perspective and leave a thought for your\\n        Younger Me, Today Me or Future Me.<\/p>\n<p>\\n\\n      <\/p>\n<div class=\\\"mmp-roles\\\" id=\\\"mmpRoles\\\"><\/div>\n<p>\\n\\n      <\/p>\n<div id=\\\"mmpForm\\\" hidden>\\n        <\/p>\n<p class=\\\"mmp-q\\\" id=\\\"mmpQ\\\">\n<p>\\n        <\/p>\n<div class=\\\"mmp-field\\\">\\n          <textarea class=\\\"mmp-ta\\\" id=\\\"mmpText\\\" maxlength=\\\"180\\\" placeholder=\\\"Your thought &hellip;\\\"><\/textarea>\\n        <\/div>\n<p>\\n        <\/p>\n<div class=\\\"mmp-metarow\\\"><span class=\\\"mmp-count\\\" id=\\\"mmpCount\\\">0 \/ 180<\/span><\/div>\n<p>\\n        <input class=\\\"mmp-hp\\\" id=\\\"mmpHp\\\" tabindex=\\\"-1\\\" autocomplete=\\\"off\\\" placeholder=\\\"Website\\\">\\n\\n        <label class=\\\"mmp-consent\\\">\\n          <input type=\\\"checkbox\\\" id=\\\"mmpConsent\\\">\\n          <span>I agree that my anonymous answer may be published by MeMatcha.<\/span>\\n        <\/label>\\n\\n        <\/p>\n<div class=\\\"mmp-actions\\\">\\n          <button class=\\\"mmp-btn mmp-btn--matcha\\\" id=\\\"mmpPin\\\">Pin to the Archive<\/button>\\n          <button class=\\\"mmp-btn mmp-btn--ghost\\\" id=\\\"mmpShare\\\" style=\\\"color:var(--cream);border-color:rgba(246,241,228,.4);\\\">As Share Card<\/button>\\n        <\/div>\n<p>\\n        <\/p>\n<p class=\\\"mmp-hint\\\" id=\\\"mmpHint\\\">\n<p>\\n      <\/p><\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n\\n    <!-- Reward -->\\n    <\/p>\n<div class=\\\"mmp-reward\\\" id=\\\"mmpReward\\\" hidden>\\n      <span class=\\\"mmp-eyebrow\\\">&#10003; Archived<\/span>\\n      <\/p>\n<h2 class=\\\"mmp-h2\\\">Welcome to the ME Archive.<\/h2>\n<p>\\n      <\/p>\n<p class=\\\"mmp-reward-id\\\">Your thought is now <b id=\\\"mmpRewardId\\\">#000000<\/b>.<\/p>\n<p>\\n      <\/p>\n<p class=\\\"mmp-reward-en\\\">Your thought is part of the Archive.<\/p>\n<p>\\n      <\/p>\n<p class=\\\"mmp-reward-sub\\\">3 thoughts from the community for you<\/p>\n<p>\\n      <\/p>\n<div class=\\\"mmp-mini\\\" id=\\\"mmpMini\\\"><\/div>\n<p>\\n      <\/p>\n<div class=\\\"mmp-actions\\\">\\n        <button class=\\\"mmp-btn mmp-btn--matcha\\\" id=\\\"mmpRewardShare\\\">Save as Share Card<\/button>\\n        <button class=\\\"mmp-btn mmp-btn--ghost\\\" id=\\\"mmpRewardAgain\\\" style=\\\"color:var(--cream);border-color:rgba(246,241,228,.4);\\\">Share another thought<\/button>\\n      <\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n  <\/p><\/div>\n<p>\\n\\n  <!-- Board -->\\n  <\/p>\n<div style=\\\"margin-top:64px;\\\">\\n    <\/p>\n<div class=\\\"mmp-board-head\\\">\\n      <\/p>\n<div>\\n        <span class=\\\"mmp-eyebrow\\\">The Pinboard<\/span>\\n        <\/p>\n<h2 class=\\\"mmp-h2\\\">Thoughts from the community.<\/h2>\n<p>\\n      <\/p><\/div>\n<p>\\n      <\/p>\n<div class=\\\"mmp-filters\\\" id=\\\"mmpFilters\\\">\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"all\\\" aria-pressed=\\\"true\\\">All<\/button>\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"younger\\\" aria-pressed=\\\"false\\\">\ud83c\udf31 Younger Me<\/button>\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"today\\\" aria-pressed=\\\"false\\\">\ud83c\udf3f Today Me<\/button>\\n        <button class=\\\"mmp-filter\\\" data-f=\\\"future\\\" aria-pressed=\\\"false\\\">\u2b50 Future Me<\/button>\\n      <\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n    <\/p>\n<p class=\\\"mmp-board-sub\\\">One thought. One perspective. Maybe you&#8217;ll recognize yourself in it.<\/p>\n<p>\\n    <\/p>\n<div class=\\\"mmp-grid\\\" id=\\\"mmpBoard\\\">\n<div class=\\\"mmp-empty\\\">Loading the pinboard &hellip;<\/div>\n<\/div>\n<p>\\n  <\/p><\/div>\n<p>\\n\\n  <!-- Modal -->\\n  <\/p>\n<div class=\\\"mmp-modal\\\" id=\\\"mmpModal\\\">\\n    <\/p>\n<div class=\\\"mmp-modal-box\\\">\\n      <\/p>\n<div class=\\\"mmp-pin\\\" id=\\\"mmpModalPin\\\" data-role=\\\"today\\\">\\n        <button class=\\\"mmp-x\\\" id=\\\"mmpModalX\\\" aria-label=\\\"Close\\\">&times;<\/button>\\n        <\/p>\n<div class=\\\"mmp-pin-role\\\" id=\\\"mmpModalRole\\\"><\/div>\n<p>\\n        <\/p>\n<div class=\\\"mmp-pin-text\\\" id=\\\"mmpModalText\\\"><\/div>\n<p>\\n        <\/p>\n<div class=\\\"mmp-pin-foot\\\"><span class=\\\"mmp-pin-id\\\" id=\\\"mmpModalId\\\"><\/span><span class=\\\"mmp-pin-date\\\" id=\\\"mmpModalDate\\\"><\/span><\/div>\n<p>\\n      <\/p><\/div>\n<p>\\n      <\/p>\n<div class=\\\"mmp-modal-actions\\\" id=\\\"mmpModalActions\\\"><\/div>\n<p>\\n    <\/p><\/div>\n<p>\\n  <\/p><\/div>\n<p>\\n\\n  <canvas id=\\\"mmpCanvas\\\" width=\\\"1080\\\" height=\\\"1920\\\" style=\\\"display:none;\\\"><\/canvas>\\n  <\/p>\n<div class=\\\"mmp-toast\\\" id=\\\"mmpToast\\\"><\/div>\n<p>\\n<\/p><\/div>\n<p>\\n\\n<script>\\n(function(){\\n  var API = '\/wp-json\/mematcha\/v1\/pins';\\n  var HASHTAG = '#MeMatcha #MeArchive';\\n  var ROLES = {\\n    younger: { label:'Younger Me', emoji:'\ud83c\udf31', tag:'Looking back' },\\n    today:   { label:'Today Me',   emoji:'\ud83c\udf3f', tag:'Now' },\\n    future:  { label:'Future Me',  emoji:'\u2b50', tag:'Looking ahead' }\\n  };\\n  \/* W\u00f6chentlich rotierende Fragen. Jede Woche wird der n\u00e4chste Satz aktiv.\\n     Aktuell 1 Satz -> immer sichtbar; weitere S\u00e4tze einfach unten anh\u00e4ngen. *\/\\n  var WEEKLY_QUESTIONS = [\\n    { younger:'What would your 10-year-old self give you a high five for today?',\\n      today:'What is draining your energy right now without paying rent?',\\n      future:'If your future self could send you just one emoji today \u2013 which would it be?' }\\n  ];\\n  function isoWeek(){\\n    try{\\n      var d=new Date(); d.setHours(0,0,0,0);\\n      d.setDate(d.getDate()+3-((d.getDay()+6)%7));\\n      var w1=new Date(d.getFullYear(),0,4);\\n      return 1+Math.round(((d-w1)\/86400000-3+((w1.getDay()+6)%7))\/7);\\n    }catch(e){ return 0; }\\n  }\\n  function weekSet(){ return WEEKLY_QUESTIONS[isoWeek()%WEEKLY_QUESTIONS.length]; }\\n  function questionFor(role){ var s=weekSet(); return s[role]||''; }\\n\\n  var state = { role:null, filter:'all', pins:[], last:null };\\n  var $ = function(id){ return document.getElementById(id); };\\n\\n  function roleLabel(r){ return (ROLES[r]||ROLES.today).label; }\\n  function fmtDate(iso){ try{ var d=new Date(iso); return d.toLocaleDateString('en-GB',{day:'numeric',month:'short',year:'numeric'});}catch(e){return '';} }\\n  function archiveId(p){ if(p.archive){ return p.archive; } return '#'+String(p.id||0); }\\n  function isEmoji(t){ return !\/[A-Za-z\u00c0-\u00ff0-9]\/.test(String(t||'')); }\\n  function toast(msg){ var t=$('mmpToast'); t.textContent=msg; t.classList.add('show'); setTimeout(function(){t.classList.remove('show');},2800); }\\n\\n  \/* ---- Composer ---- *\/\\n  function renderRoles(){\\n    var wrap=$('mmpRoles'); wrap.innerHTML='';\\n    Object.keys(ROLES).forEach(function(k){\\n      var r=ROLES[k];\\n      var b=document.createElement('button');\\n      b.className='mmp-role'; b.setAttribute('aria-pressed','false'); b.dataset.role=k;\\n      b.innerHTML='<span class=\\\"mmp-emoji\\\">'+r.emoji+'<\/span><b>'+r.label+'<\/b><small>'+r.tag+'<\/small>';\\n      b.addEventListener('click',function(){ selectRole(k); });\\n      wrap.appendChild(b);\\n    });\\n  }\\n  function selectRole(k){\\n    state.role=k;\\n    [].forEach.call($('mmpRoles').children,function(b){ b.setAttribute('aria-pressed', b.dataset.role===k?'true':'false'); });\\n    $('mmpQ').textContent=questionFor(k);\\n    $('mmpForm').hidden=false;\\n    updateState();\\n    $('mmpText').focus();\\n  }\\n  function updateState(){\\n    var text=$('mmpText').value.trim();\\n    $('mmpCount').textContent=$('mmpText').value.length+' \/ 180';\\n    var ok=true;\\n    if(!state.role){ ok=false; }\\n    if(text.length<2){ ok=false; }\\n    if(!$('mmpConsent').checked){ ok=false; }\\n    $('mmpPin').disabled=!ok;\\n  }\\n  $('mmpText').addEventListener('input',updateState);\\n  $('mmpConsent').addEventListener('change',updateState);\\n\\n  function pinIt(){\\n    if($('mmpHp').value){ return; }\\n    var text=$('mmpText').value.trim();\\n    if(!state.role){ return; }\\n    if(text.length<2){ return; }\\n    if(!$('mmpConsent').checked){ toast('Please confirm the publication.'); return; }\\n    var payload={ role:state.role, question:questionFor(state.role), text:text,\\n      author:'', website:'', consent:true };\\n    $('mmpPin').disabled=true; $('mmpPin').textContent='Pinning \u2026';\\n    fetch(API,{method:'POST',headers:{'Content-Type':'application\/json'},body:JSON.stringify(payload)})\\n      .then(function(r){ return r.json().then(function(d){ return {ok:r.ok,d:d}; }); })\\n      .then(function(res){\\n        $('mmpPin').textContent='Pin to the Archive'; $('mmpPin').disabled=false;\\n        if(!res.ok){ toast((res.d||{}).message ? res.d.message : 'That didn\u2019t work.'); return; }\\n        state.last=res.d;\\n        if(!res.d.pending){ state.pins.unshift(res.d); renderBoard(); }\\n        showReward(res.d);\\n      })\\n      .catch(function(){ $('mmpPin').textContent='Pin to the Archive'; $('mmpPin').disabled=false; toast('Network error.'); });\\n  }\\n  $('mmpPin').addEventListener('click',pinIt);\\n  $('mmpShare').addEventListener('click',function(){\\n    var text=$('mmpText').value.trim(); if(!text){ toast('Write your thought first.'); return; }\\n    shareCard({ role:state.role||'today', text:text, archive:'#\u2014' });\\n  });\\n\\n  \/* ---- Reward \/ Post-Submit ---- *\/\\n  function showReward(p){\\n    $('mmpRewardId').textContent=archiveId(p);\\n    var mini=$('mmpMini'); mini.innerHTML='';\\n    var pool=state.pins.filter(function(x){ return x.id!==p.id; });\\n    pick(pool,3).forEach(function(x){\\n      var c=document.createElement('div'); c.className='mmp-minicard'; c.dataset.role=x.role||'today';\\n      var r=document.createElement('div'); r.className='r'; r.textContent=(ROLES[x.role]||ROLES.today).emoji+' '+roleLabel(x.role);\\n      var t=document.createElement('div'); t.className='t'; t.textContent=(isEmoji(x.text)?'':'\u201c')+x.text+(isEmoji(x.text)?'':'\u201d');\\n      var n=document.createElement('div'); n.className='n'; n.textContent=archiveId(x);\\n      c.appendChild(r); c.appendChild(t); c.appendChild(n); mini.appendChild(c);\\n    });\\n    $('mmpComposerMain').hidden=true; $('mmpReward').hidden=false;\\n    try{ $('mmpReward').scrollIntoView({behavior:'smooth',block:'center'}); }catch(e){}\\n  }\\n  $('mmpRewardShare').addEventListener('click',function(){ if(state.last){ shareCard(state.last); } });\\n  $('mmpRewardAgain').addEventListener('click',function(){\\n    $('mmpReward').hidden=true; $('mmpComposerMain').hidden=false;\\n    state.role=null; state.last=null;\\n    [].forEach.call($('mmpRoles').children,function(b){ b.setAttribute('aria-pressed','false'); });\\n    $('mmpForm').hidden=true; $('mmpText').value=''; $('mmpConsent').checked=false; updateState();\\n    try{ $('mmpComposerMain').scrollIntoView({behavior:'smooth',block:'start'}); }catch(e){}\\n  });\\n  function pick(arr,n){\\n    var a=arr.slice(), out=[];\\n    while(a.length){ if(out.length>=n){ break; } var i=Math.floor(Math.random()*a.length); out.push(a.splice(i,1)[0]); }\\n    return out;\\n  }\\n\\n  \/* ---- Share Card (Canvas -> Bild) ---- *\/\\n  var CARD_BG={ younger:'#EEF0E2', today:'#FDEFE2', future:'#E9E7D8' };\\n  var CARD_AC={ younger:'#66704A', today:'#C0824F', future:'#3C4429' };\\n  function wrap(ctx,text,maxW){\\n    var words=String(text).split(' '), lines=[], line='';\\n    words.forEach(function(w){\\n      var test=line?line+' '+w:w;\\n      if(ctx.measureText(test).width>maxW){ if(line){ lines.push(line); } line=w; }\\n      else { line=test; }\\n    });\\n    if(line){ lines.push(line); }\\n    return lines;\\n  }\\n  function drawCard(p,cb){\\n    var cv=$('mmpCanvas'), ctx=cv.getContext('2d');\\n    var W=1080, H=1920, role=p.role||'today';\\n    ctx.clearRect(0,0,W,H);\\n    ctx.fillStyle=CARD_BG[role]||'#FDEFE2'; ctx.fillRect(0,0,W,H);\\n    ctx.fillStyle=CARD_AC[role]||'#66704A';\\n    ctx.textAlign='center';\\n    \/\/ Top-Label\\n    try{ ctx.letterSpacing='10px'; }catch(e){}\\n    ctx.font='600 30px \\\"Be Vietnam Pro\\\", sans-serif';\\n    ctx.fillText('THE ME ARCHIVE', W\/2, 200);\\n    \/\/ Rolle gro\u00df\\n    ctx.font='800 78px \\\"Be Vietnam Pro\\\", sans-serif';\\n    ctx.fillText(roleLabel(role).toUpperCase(), W\/2, 330);\\n    try{ ctx.letterSpacing='0px'; }catch(e){}\\n    \/\/ Zitat\\n    ctx.fillStyle='#3C4429';\\n    if(isEmoji(p.text)){\\n      ctx.font='300px \\\"Be Vietnam Pro\\\", sans-serif';\\n      ctx.textBaseline='middle';\\n      ctx.fillText(p.text, W\/2, H\/2);\\n      ctx.textBaseline='alphabetic';\\n    } else {\\n      var t=String(p.text);\\n      var fs = t.length<46 ? 88 : (t.length<95 ? 68 : 54);\\n      ctx.font='500 '+fs+'px \\\"Playfair Display\\\", Georgia, serif';\\n      var lines=wrap(ctx,'\u201c'+t+'\u201d', W-260);\\n      var lh=fs*1.22, startY=H\/2-((lines.length-1)*lh)\/2;\\n      ctx.textBaseline='middle';\\n      lines.forEach(function(ln,i){ ctx.fillText(ln, W\/2, startY+i*lh); });\\n      ctx.textBaseline='alphabetic';\\n    }\\n    \/\/ Footer: Archive-ID + Wortmarke\\n    ctx.fillStyle=CARD_AC[role]||'#66704A';\\n    try{ ctx.letterSpacing='6px'; }catch(e){}\\n    ctx.font='600 30px \\\"Be Vietnam Pro\\\", sans-serif';\\n    ctx.fillText('THE ME ARCHIVE \u00b7 '+(p.archive||'#\u2014'), W\/2, H-230);\\n    try{ ctx.letterSpacing='0px'; }catch(e){}\\n    ctx.fillStyle='#3C4429';\\n    ctx.font='500 56px \\\"Playfair Display\\\", Georgia, serif';\\n    ctx.fillText('MeMatcha', W\/2, H-140);\\n    cb(cv);\\n  }\\n  function shareCard(p){\\n    var run=function(){\\n      drawCard(p,function(cv){\\n        var name='me-archive-'+String(p.archive||'').replace(\/[^0-9]\/g,'')+'.png';\\n        var caption=(isEmoji(p.text)?p.text:'\u201c'+p.text+'\u201d')+' \u2014 THE ME ARCHIVE '+(p.archive||'')+'\\\\n\\\\n'+HASHTAG;\\n        cv.toBlob(function(blob){\\n          if(!blob){ fallbackDL(cv,name); return; }\\n          if(navigator.canShare){\\n            var file=new File([blob],name,{type:'image\/png'});\\n            if(navigator.canShare({files:[file]})){\\n              navigator.share({files:[file],text:caption}).then(function(){}).catch(function(){ fallbackDL(cv,name); });\\n              return;\\n            }\\n          }\\n          fallbackDL(cv,name);\\n        },'image\/png');\\n      });\\n    };\\n    if(document.fonts){ document.fonts.ready.then(run).catch(run); } else { run(); }\\n  }\\n  function fallbackDL(cv,name){\\n    try{\\n      var a=document.createElement('a'); a.download=name; a.href=cv.toDataURL('image\/png');\\n      document.body.appendChild(a); a.click(); document.body.removeChild(a);\\n      toast('Share Card saved \u2013 now post it to your Story\/WhatsApp \u2728');\\n    }catch(e){ toast('Could not create the Share Card.'); }\\n  }\\n\\n  \/* ---- Board ---- *\/\\n  function variant(p,i){\\n    var cls=[];\\n    var n=parseInt(String(p.archive||p.id||'0').replace(\/[^0-9]\/g,''),10)||i;\\n    if(isEmoji(p.text)){ cls.push('mmp-card--emoji'); }\\n    else{\\n      if(p.text.length>120){ cls.push('mmp-card--lg'); }\\n      else if(n%5===0){ cls.push('mmp-card--lg'); }\\n      if(n%3===0){ cls.push('mmp-card--tall'); }\\n    }\\n    var shapes=['','mmp-card--soft','','mmp-card--sharp',''];\\n    cls.push(shapes[n%shapes.length]);\\n    return cls.join(' ');\\n  }\\n  var ROT=['-1.1deg','0.7deg','-0.5deg','1deg','0deg','-0.8deg'];\\n  function pinNode(p,i){\\n    var card=document.createElement('div'); card.className=('mmp-card '+variant(p,i)).trim();\\n    card.style.transform='rotate('+ROT[i%ROT.length]+')';\\n    var pin=document.createElement('div'); pin.className='mmp-pin'; pin.dataset.role=p.role||'today';\\n    var role=document.createElement('div'); role.className='mmp-pin-role';\\n    role.textContent=(ROLES[p.role]||ROLES.today).emoji+' '+roleLabel(p.role);\\n    var text=document.createElement('div'); text.className='mmp-pin-text';\\n    text.textContent=isEmoji(p.text)?p.text:('\u201c'+p.text+'\u201d');\\n    var foot=document.createElement('div'); foot.className='mmp-pin-foot';\\n    var idv=document.createElement('span'); idv.className='mmp-pin-id'; idv.textContent=archiveId(p);\\n    var dt=document.createElement('span'); dt.className='mmp-pin-date'; dt.textContent=fmtDate(p.date);\\n    foot.appendChild(idv); foot.appendChild(dt);\\n    var sh=document.createElement('button'); sh.className='mmp-share'; sh.title='Als Share Card'; sh.textContent='\u2197';\\n    sh.addEventListener('click',function(e){ e.stopPropagation(); shareCard(p); });\\n    pin.appendChild(role); pin.appendChild(text); pin.appendChild(foot); pin.appendChild(sh);\\n    card.appendChild(pin);\\n    card.addEventListener('click',function(){ openModal(p); });\\n    return card;\\n  }\\n  function renderBoard(){\\n    var board=$('mmpBoard'); board.innerHTML='';\\n    var list=state.pins.filter(function(p){ if(state.filter==='all'){ return true; } return p.role===state.filter; });\\n    if(!list.length){ board.innerHTML='<\/p>\n<div class=\\\"mmp-empty\\\">No thoughts here yet \u2013 be the first \u2728<\/div>\n<p>'; return; }\\n    list.forEach(function(p,i){ board.appendChild(pinNode(p,i)); });\\n  }\\n  function loadBoard(){\\n    fetch(API).then(function(r){ return r.json(); }).then(function(d){\\n      state.pins=Array.isArray(d)?d:[]; renderBoard();\\n    }).catch(function(){ $('mmpBoard').innerHTML='<\/p>\n<div class=\\\"mmp-empty\\\">The pinboard could not be loaded.<\/div>\n<p>'; });\\n  }\\n  [].forEach.call($('mmpFilters').children,function(b){\\n    b.addEventListener('click',function(){\\n      state.filter=b.dataset.f;\\n      [].forEach.call($('mmpFilters').children,function(x){ x.setAttribute('aria-pressed', x===b?'true':'false'); });\\n      renderBoard();\\n    });\\n  });\\n\\n  \/* ---- Modal ---- *\/\\n  function openModal(p){\\n    $('mmpModalPin').dataset.role=p.role||'today';\\n    $('mmpModalRole').textContent=(ROLES[p.role]||ROLES.today).emoji+' '+roleLabel(p.role)+' \u00b7 '+(p.question||'');\\n    $('mmpModalText').textContent=isEmoji(p.text)?p.text:('\u201c'+p.text+'\u201d');\\n    $('mmpModalId').textContent=archiveId(p);\\n    $('mmpModalDate').textContent=fmtDate(p.date);\\n    var acts=$('mmpModalActions'); acts.innerHTML='';\\n    var s=document.createElement('button'); s.className='mmp-btn mmp-btn--primary mmp-btn--sm'; s.textContent='Als Share Card';\\n    s.addEventListener('click',function(){ shareCard(p); });\\n    acts.appendChild(s);\\n    $('mmpModal').classList.add('show');\\n  }\\n  function closeModal(){ $('mmpModal').classList.remove('show'); }\\n  $('mmpModalX').addEventListener('click',closeModal);\\n  $('mmpModal').addEventListener('click',function(e){ if(e.target===$('mmpModal')){ closeModal(); } });\\n  document.addEventListener('keydown',function(e){ if(e.key==='Escape'){ closeModal(); } });\\n\\n  renderRoles();\\n  updateState();\\n  loadBoard();\\n})();\\n<\/script>\\n&#8221;}}]}]}]}],&#8221;version&#8221;:&#8221;5.0.38&#8243;} &#8211;><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Die MeMatcha Pinnwand: teile dein Motto als Younger Me, Today Me oder Future Me \u2013 und entdecke die Gedanken der Community.<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-615","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/pages\/615","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/comments?post=615"}],"version-history":[{"count":10,"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/pages\/615\/revisions"}],"predecessor-version":[{"id":919,"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/pages\/615\/revisions\/919"}],"wp:attachment":[{"href":"https:\/\/me-matcha.com\/en\/wp-json\/wp\/v2\/media?parent=615"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}