/* ═══ Copy editor chrome ══════════════════════════════════════════════════
   Only ever loaded with ?edit=1 in the URL — nothing here paints otherwise,
   because .ed-on is set by edit.js after it confirms the flag.
   ═══════════════════════════════════════════════════════════════════════ */
.ed-bar{position:fixed;left:50%;bottom:20px;z-index:90;display:flex;align-items:center;gap:8px;
  padding:7px 8px 7px 14px;transform:translateX(-50%);border-radius:999px;
  background:rgba(19,18,17,.94);backdrop-filter:blur(14px);
  box-shadow:0 2px 8px rgba(0,0,0,.08),0 16px 32px rgba(0,0,0,.22)}
.ed-dot{width:7px;height:7px;border-radius:50%;background:#5FD08A;flex:0 0 auto}
.ed-label{color:#fff;font:600 12px/20px var(--sans);white-space:nowrap}
.ed-count{color:#8E8980;font:400 12px/20px var(--sans);white-space:nowrap}
.ed-bar button{margin-left:2px;padding:6px 12px;border:0;border-radius:999px;
  background:rgba(255,255,255,.12);color:#fff;font:500 12px/20px var(--sans);
  transition:background .15s}
.ed-bar button:hover{background:rgba(255,255,255,.24)}
.ed-bar #edDone{background:#fff;color:var(--ink)}

/* Editable text gets a quiet hit area, not a border that shifts the layout. */
.ed-on [contenteditable]{outline:0;border-radius:4px;
  box-shadow:0 0 0 0 rgba(30,136,199,0);transition:box-shadow .14s,background .14s}
.ed-on [contenteditable]:hover{background:rgba(30,136,199,.07);
  box-shadow:0 0 0 4px rgba(30,136,199,.07)}
.ed-on [contenteditable]:focus{background:rgba(30,136,199,.09);
  box-shadow:0 0 0 4px rgba(30,136,199,.09),inset 0 0 0 1px rgba(30,136,199,.35)}
.ed-on [contenteditable]{cursor:text}
.ed-on [contenteditable] a{cursor:text}
@media (max-width:720px){
  .ed-bar{bottom:12px;padding:6px 6px 6px 12px}
  .ed-label,.ed-count{display:none}
}
/* plaintext-only editing can inherit pre-wrap semantics; keep normal flow */
.ed-on [contenteditable]{white-space:normal}
/* …but not for the hero headline, which is deliberately locked to two nowrap
   lines. Letting it wrap here made edit mode the only place a too-long
   headline looked fine, so the editor hid the very overflow it was being
   used to fix. Rewriting it long should look broken, because it is. */
.ed-on .hero-h1>span[contenteditable]{white-space:nowrap}