Snapshot of uncommitted work: landing, bots, prod infra, partner cabinet, backoffice stage 1

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

docs/design/wordmarks/render.html

@@ -0,0 +1,86 @@
+<!doctype html><html><head><meta charset="utf-8"><link rel="preconnect" href="https://fonts.googleapis.com">
+<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+<link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@1,800&family=Fraunces:ital,opsz,wght,SOFT,WONK@1,9..144,900,100,1&family=Unbounded:wght@800&family=Noto+Sans+Armenian:wght@700&family=Shrikhand&family=Big+Shoulders+Display:wght@900&family=Fredoka:wght@700&family=Onest:wght@400;600&display=block" rel="stylesheet">
+<style>
+:root {
+  --plum: #4A1028; --pink: #F6C3D3; --cream: #FBF6EE; --yellow: #F7DA6E;
+  --green: #A8C38A; --green-ink: #1F3311; --blue: #BCD0F2; --blue-ink: #12264D; --apricot: #F3A04F;
+}
+* { box-sizing: border-box; }
+body { margin: 0; background: var(--cream); color: var(--plum); font-family: Onest, system-ui, sans-serif; }
+main { max-width: 1240px; margin: 0 auto; padding: 40px 20px 60px; }
+h1 { font: italic 800 44px/1 Rubik, sans-serif; letter-spacing: -0.03em; margin: 0 0 6px; }
+.lede { margin: 0 0 28px; color: #6b4a57; max-width: 62ch; }
+.grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 18px; }
+.v { background: #fff; border-radius: 28px; padding: 18px; display: grid; grid-template-columns: 1fr 1fr 160px; grid-template-rows: auto 190px auto; gap: 12px; }
+.tile span, .tile b, .avatar span, .avatar b { white-space: nowrap; }
+.v header { grid-column: 1 / -1; display: flex; gap: 10px; align-items: baseline; }
+.v header b { font-size: 20px; font-weight: 600; }
+.v header span { font-size: 14px; color: #6b4a57; }
+.tile { border-radius: 20px; display: flex; align-items: center; justify-content: center; overflow: hidden; }
+.avatar { width: 160px; height: 160px; border-radius: 50%; align-self: center; display: flex; align-items: center; justify-content: center; overflow: hidden; }
+.note { grid-column: 1 / -1; font-size: 13px; color: #6b4a57; margin: -4px 4px 0; }
+
+/* 1 — Rubik: слово с сайта */
+.w1 { font: italic 800 96px/0.9 Rubik; padding-right: 10px; letter-spacing: -0.055em; }
+.v1 .light { background: var(--cream); color: var(--plum); }
+.v1 .dark { background: var(--plum); color: var(--pink); }
+.v1 .avatar { background: var(--plum); color: var(--pink); font: italic 800 96px/1 Rubik; letter-spacing: -0.05em; padding-right: 6px; }
+
+/* 2 — Fraunces: мягкая антиква, точка-абрикос */
+.w2 { font-family: Fraunces; font-style: italic; font-weight: 900; font-size: 96px; line-height: 1; letter-spacing: -0.035em; font-variation-settings: 'SOFT' 100, 'WONK' 1, 'opsz' 144; }
+.w2 i { font-style: normal; color: var(--apricot); }
+.v2 .light { background: var(--cream); color: var(--plum); }
+.v2 .dark { background: #2b0a18; color: var(--cream); }
+.v2 .avatar { background: var(--apricot); color: var(--plum); font-family: Fraunces; font-style: italic; font-weight: 900; font-size: 92px; font-variation-settings: 'SOFT' 100, 'WONK' 1, 'opsz' 144; padding-bottom: 8px; }
+
+/* 3 — Unbounded + армянское Բարև: двуязычный знак */
+.w3 { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
+.w3 .lat { font: 800 66px/1 Unbounded; letter-spacing: -0.04em; }
+.w3 .arm { font: 700 32px/1 'Noto Sans Armenian'; letter-spacing: 0.02em; opacity: .75; padding-left: 3px; }
+.v3 .light { background: var(--cream); color: var(--plum); }
+.v3 .dark { background: var(--plum); color: var(--yellow); }
+.v3 .avatar { background: var(--yellow); color: var(--plum); flex-direction: column; gap: 2px; }
+.v3 .avatar .a1 { font: 800 34px/1 Unbounded; letter-spacing: -0.04em; }
+.v3 .avatar .a2 { font: 700 19px/1 'Noto Sans Armenian'; opacity: .7; }
+
+/* 4 — Shrikhand: сочная наклейка с тенью */
+.w4 { font: 400 86px/1 Shrikhand; padding: 0 12px 10px 0; letter-spacing: -0.01em; color: var(--yellow); text-shadow: 4px 4px 0 var(--plum), 5px 5px 0 var(--plum); -webkit-text-stroke: 2px var(--plum); paint-order: stroke fill; }
+.v4 .light { background: var(--pink); }
+.v4 .dark { background: var(--plum); }
+.v4 .dark .w4 { text-shadow: 4px 4px 0 #000, 5px 5px 0 #000; -webkit-text-stroke: 2px #2b0a18; }
+.v4 .avatar { background: var(--pink); }
+.v4 .avatar span { font: 400 78px/1 Shrikhand; color: var(--yellow); -webkit-text-stroke: 2px var(--plum); paint-order: stroke fill; text-shadow: 4px 4px 0 var(--plum); padding: 0 6px 10px 0; }
+
+/* 5 — Big Shoulders: бирка для ключей */
+.w5 { position: relative; display: inline-flex; align-items: center; gap: 14px; padding: 10px 26px 10px 18px; border-radius: 999px; background: var(--green); color: var(--green-ink); }
+.w5::before { content: ''; width: 18px; height: 18px; border-radius: 50%; background: var(--cream); box-shadow: inset 0 0 0 3px var(--green-ink); }
+.w5 b { font: 900 76px/0.9 'Big Shoulders Display'; letter-spacing: 0.06em; text-transform: uppercase; }
+.v5 .light { background: var(--cream); }
+.v5 .dark { background: var(--plum); }
+.v5 .avatar { background: var(--green); color: var(--green-ink); }
+.v5 .avatar b { font: 900 46px/0.9 'Big Shoulders Display'; letter-spacing: 0.04em; }
+
+/* 6 — Fredoka: «привет» в облачке чата */
+.w6 { position: relative; display: inline-block; padding: 8px 30px 18px; border-radius: 40px 40px 40px 10px; background: var(--blue); color: var(--blue-ink); font: 700 80px/1 Fredoka; white-space: nowrap; letter-spacing: -0.02em; }
+.w6 i { font-style: normal; display: inline-block; transform: translateY(-4px) rotate(-8deg); color: #B8235A; }
+.v6 .light { background: var(--cream); }
+.v6 .dark { background: var(--blue-ink); }
+.v6 .dark .w6 { background: var(--pink); color: var(--plum); }
+.v6 .avatar { background: var(--blue); }
+.v6 .avatar span { padding: 6px 16px 12px; border-radius: 28px 28px 28px 6px; background: #fff; color: var(--blue-ink); font: 700 42px/1 Fredoka; }
+
+@media (max-width: 900px) { .v { grid-template-columns: 1fr; grid-template-rows: auto; } .tile { height: 170px; } .avatar { justify-self: center; } }
+
+html,body{margin:0;width:100vw;height:100vh;overflow:hidden;background:transparent}
+#stage{width:100vw;height:100vh}
+#stage .tile{width:100%;height:100%;border-radius:0}
+#stage .avatar{width:100%;height:100%;border-radius:0}
+#stage .scale{transform:scale(var(--k));transform-origin:center}
+</style></head><body><div id="stage"></div><script>const T={"v1": ["<span class=\"w1\">Barev</span>", "<span class=\"w1\">Barev</span>", "B"], "v2": ["<span class=\"w2\">Barev<i>.</i></span>", "<span class=\"w2\">Barev<i>.</i></span>", "B<i style=\"font-style:normal\">.</i>"], "v3": ["<span class=\"w3\"><span class=\"lat\">Barev</span><span class=\"arm\">Բարև</span></span>", "<span class=\"w3\"><span class=\"lat\">Barev</span><span class=\"arm\">Բարև</span></span>", "<span class=\"a1\">Barev</span><span class=\"a2\">Բարև</span>"], "v4": ["<span class=\"w4\">Barev</span>", "<span class=\"w4\">Barev</span>", "<span>B</span>"], "v5": ["<span class=\"w5\"><b>Barev</b></span>", "<span class=\"w5\"><b>Barev</b></span>", "<b>BAREV</b>"], "v6": ["<span class=\"w6\">barev<i>!</i></span>", "<span class=\"w6\">barev<i>!</i></span>", "<span>barev</span>"]};
+const q=new URLSearchParams(location.search),v=q.get('v'),m=q.get('m'),k=q.get('k')||'2.4';
+const [l,d,a]=T['v'+v];
+const st=document.getElementById('stage');
+st.className='v'+v;st.style.setProperty('--k',k);
+st.innerHTML=m==='avatar'?`<div class="avatar"><div class="scale" style="display:flex;flex-direction:${v==="3"?"column":"row"};align-items:${v==="3"?"center":"baseline"}">${a}</div></div>`:`<div class="tile ${m}"><div class="scale">${m==='light'?l:d}</div></div>`;
+</script></body></html>