diff --git a/index.html b/index.html index fc1ecb6..e28f8f2 100644 --- a/index.html +++ b/index.html @@ -302,27 +302,40 @@ #chartContainer { height: 240px; } } - /* Referral link input */ - .ref-link-row { + /* Shared link row */ + .shared-link-row { display: flex; - align-items: center; gap: 4px; } - .ref-link-base { - font-size: 0.75rem; - color: var(--text-dim); - white-space: nowrap; - background: var(--bg); - padding: 6px 8px; - border: 1px solid var(--border); - border-radius: var(--radius-sm) 0 0 var(--radius-sm); - border-right: none; - font-family: monospace; - } - .ref-link-row input { + .shared-link-row input { flex: 1; - border-radius: 0 var(--radius-sm) var(--radius-sm) 0 !important; + font-size: 0.78rem; font-family: monospace; + color: var(--accent); + background: var(--bg); + border: 1px solid var(--border); + border-radius: var(--radius-sm); + padding: 7px 10px; + outline: none; + } + .copy-sm-btn { + background: var(--accent); + color: #fff; + border: none; + padding: 7px 14px; + border-radius: var(--radius-sm); + cursor: pointer; + font-size: 0.78rem; + font-weight: 600; + white-space: nowrap; + transition: opacity 0.2s; + } + .copy-sm-btn:hover { opacity: 0.85; } + .copy-sm-btn.copied { background: var(--green); } + .sub-hint { + font-size: 0.68rem; + color: var(--text-muted); + margin-top: 4px; } /* Shareable plan section */ @@ -415,18 +428,19 @@
- -
-