Copy Engine ships: Suite AI layer (own engine, RM facts + compliance in our system prompt, deterministic link injection), metered generate/meters APIs, /suite/copy tool page; L2 tile now live
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
martbost
@@ -0,0 +1,62 @@
|
||||
<!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><meta name="robots" content="noindex"><meta name="description" content="Copy Engine — the Circle Suite's AI copywriter. Posts, messages, follow-ups and objection replies in the team voice, with your invite link."><title>Copy Engine | The Circle Suite</title><link rel="icon" type="image/png" href="/favicon.png"><link rel="stylesheet" href="/styles.css">
|
||||
<style>
|
||||
.cw{max-width:880px;margin:0 auto;padding:24px 20px 70px}
|
||||
.cw h1{font-size:clamp(26px,4.5vw,36px);margin:6px 0 8px}
|
||||
.cw .lede{color:var(--muted);line-height:1.6;margin-bottom:18px}
|
||||
#cpGate{display:none;border:2px solid var(--gold);border-radius:12px;padding:16px 20px;margin-bottom:18px;line-height:1.6}
|
||||
#cpGate b{color:var(--gold)}
|
||||
.cp-card{background:var(--card,#0d2236);border:1px solid var(--line,#24425d);border-radius:14px;padding:18px 20px}
|
||||
.cp-kinds{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}
|
||||
.cp-kind{border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:999px;
|
||||
padding:7px 14px;font-size:13.5px;font-weight:700;cursor:pointer;transition:.15s}
|
||||
.cp-kind:hover{border-color:var(--teal);color:var(--text)}
|
||||
.cp-kind.on{border-color:var(--teal);background:rgba(78,214,203,.12);color:var(--teal)}
|
||||
label.cp-lab{display:block;font-weight:700;font-size:14px;margin:0 0 6px}
|
||||
#cpBrief{width:100%;min-height:96px;resize:vertical;background:var(--bg,#0b1d2e);border:1px solid var(--line);
|
||||
border-radius:10px;color:var(--text);padding:11px 13px;font-size:15px;font-family:inherit;line-height:1.5}
|
||||
.cp-hint{color:var(--muted);font-size:12.5px;margin-top:6px}
|
||||
.cp-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:14px}
|
||||
#cpMeter{font-size:12.5px;color:var(--muted);margin-left:auto}
|
||||
#cpMeter b{color:var(--text)}
|
||||
#cpOut{display:none;margin-top:18px}
|
||||
#cpText{white-space:pre-wrap;background:var(--bg,#0b1d2e);border:1px solid var(--line);border-left:3px solid var(--gold);
|
||||
border-radius:10px;padding:16px 18px;font-size:15.5px;line-height:1.6}
|
||||
#cpErr{display:none;color:#f0a05a;margin-top:12px;font-size:14px;line-height:1.55}
|
||||
.cp-note{margin-top:20px;font-size:12.5px;color:var(--muted);line-height:1.6;border-top:1px solid var(--line);padding-top:12px}
|
||||
.spin{display:inline-block;width:13px;height:13px;border:2px solid rgba(255,255,255,.25);border-top-color:var(--gold);
|
||||
border-radius:50%;animation:sp .8s linear infinite;vertical-align:-2px;margin-right:7px}
|
||||
@keyframes sp{to{transform:rotate(360deg)}}
|
||||
@media (prefers-reduced-motion:reduce){.spin{animation:none}}
|
||||
</style></head>
|
||||
<body>
|
||||
<header class="wrap nav"><a class="brand" href="/suite"><img class="brand-mark" src="/logo.jpg" alt="The RM Circle" width="42" height="42"><span><span id="brandName">RM Circle</span><small>Copy Engine</small></span></a><div class="nav-actions"><a class="btn btn-secondary hide-mobile" href="/suite">← The Suite</a><a class="btn btn-primary" href="/tools">Promo Tools</a></div></header>
|
||||
<main class="cw">
|
||||
<div class="eyebrow" style="color:var(--gold)">CIRCLE SUITE · LEVEL 2 · ASCENSUS</div>
|
||||
<h1>Copy <span class="gold">Engine.</span></h1>
|
||||
<p class="lede">Tell it what you need and who it's for. It writes in the team's voice, follows our honesty rules, and drops <strong style="color:var(--text)">your</strong> invite link at the end. Read it before you send it — you're the publisher.</p>
|
||||
|
||||
<div id="cpGate"></div>
|
||||
|
||||
<div class="cp-card" id="cpCard">
|
||||
<label class="cp-lab">What do you need?</label>
|
||||
<div class="cp-kinds" id="cpKinds"></div>
|
||||
<label class="cp-lab" for="cpBrief">What's it about — and who's it for?</label>
|
||||
<textarea id="cpBrief" placeholder="e.g. A post for people who've been burned by side hustles before — honest, no hype, mention that everything is verifiable on-chain"></textarea>
|
||||
<div class="cp-hint">The more specific you are — the person, the angle, the situation — the better it writes. Mention any detail you want included.</div>
|
||||
<div class="cp-row">
|
||||
<button id="cpGo" class="btn btn-primary">✍️ Write it</button>
|
||||
<button id="cpAgain" class="btn btn-secondary" style="display:none">Try another version</button>
|
||||
<span id="cpMeter"></span>
|
||||
</div>
|
||||
<div id="cpErr"></div>
|
||||
<div id="cpOut">
|
||||
<div id="cpText"></div>
|
||||
<div class="cp-row"><button id="cpCopy" class="btn btn-teal btn-sm">📋 Copy</button><span class="cp-hint" id="cpCopied" style="display:none;color:var(--teal)">Copied — go post it.</span></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="cp-note"><strong style="color:var(--text)">Teach it forward:</strong> when this saves you fifteen minutes, show your two how to use it — that's how the whole team gets faster. <br>Everything the engine writes follows the team's rules: no income promises, no invented numbers, honest about risk. It's still your name on the post, so read before you send. Independent team resource · No income is guaranteed · Cryptocurrency involves risk.</p>
|
||||
</main>
|
||||
<script src="/suite-copy.js"></script>
|
||||
<script src="/chat.js" defer></script>
|
||||
<script src="/translate.js" defer></script><script src="/tg-app.js" defer></script><script src="/nav-dash.js" defer></script></body></html>
|
||||
Reference in New Issue
Block a user