Prompt Composer

<!-- Prompt Composer — focus state, mention chip, send button -->
<div class="nuda-composer">
  <textarea class="nuda-composer__input"
            placeholder="Ask anything…"
            rows="3"></textarea>
  <div class="nuda-composer__bar">
    <span class="nuda-composer__chip">@file</span>
    <button class="nuda-composer__send" type="submit" aria-label="Send">
      <svg viewBox="0 0 24 24" fill="none" stroke="currentColor"
           stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round">
        <path d="M5 12 L19 12" />
        <path d="M13 6 L19 12 L13 18" />
      </svg>
    </button>
  </div>
</div>

/* Prompt Composer
   AI prompt input with focus glow, mention chips, send button.
   Customize: --comp-accent, --comp-bg */

.nuda-composer {
  --comp-accent: #e4ff54;
  --comp-bg: rgba(255, 255, 255, 0.03);
  position: relative;
  width: 100%;
  max-width: 480px;
  background: var(--comp-bg);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: border-color 0.25s, box-shadow 0.25s;
}

.nuda-composer:focus-within {
  border-color: rgba(228, 255, 84, 0.4);
  box-shadow: 0 0 0 3px rgba(228, 255, 84, 0.1);
}

.nuda-composer__input {
  width: 100%;
  background: transparent;
  border: none;
  resize: none;
  color: #fafafa;
  font: 500 0.875rem ui-sans-serif, system-ui, sans-serif;
  outline: none;
  padding: 0;
  line-height: 1.5;
}

.nuda-composer__input::placeholder { color: #63636e; }

.nuda-composer__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.nuda-composer__chip {
  font: 600 0.625rem ui-sans-serif, system-ui, sans-serif;
  color: var(--comp-accent);
  background: rgba(228, 255, 84, 0.1);
  padding: 3px 7px;
  border-radius: 5px;
}

.nuda-composer__send {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: var(--comp-accent);
  color: #09090b;
  border: none;
  border-radius: 7px;
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}

.nuda-composer__send:hover {
  transform: translateX(2px);
  box-shadow: 0 0 10px rgba(228, 255, 84, 0.4);
}

.nuda-composer__send svg { width: 14px; height: 14px; }