/* "Suggest a feature" form — app modal (#suggestModal) and the /suggest/ page. */
.tps-modal { position: relative; }
.tps-close { position: absolute; top: 14px; right: 16px; z-index: 3; opacity: 0.6; }
.tps-close:hover { opacity: 1; }
.tps-form { padding: 30px 28px 24px; text-align: center; display: flex; flex-direction: column; gap: 12px; }
.tps-icon {
    width: 64px; height: 64px; margin: 0 auto 2px;
    display: flex; align-items: center; justify-content: center; border-radius: 50%;
    background: linear-gradient(135deg, rgba(255,221,0,0.22), rgba(255,143,31,0.14));
    border: 1px solid rgba(255,221,0,0.32);
}
.tps-icon .bx { font-size: 2.1rem; color: #ffdd00; }
.tps-title { color: #fff; font-weight: 700; font-size: 1.25rem; margin: 0; }
.tps-text { color: #c7ccd1; font-size: 0.95rem; line-height: 1.55; margin: 0 0 4px; }
.tps-input { background: rgba(255,255,255,0.05) !important; border-color: rgba(255,255,255,0.18) !important; color: #fff !important; text-align: left; }
.tps-input::placeholder { color: rgba(255,255,255,0.45); }
textarea.tps-input { resize: vertical; min-height: 110px; }
/* Honeypot: off-screen rather than display:none so naive bots still fill it in. */
.tps-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
.tps-status { font-size: 0.9rem; min-height: 1.3em; color: #c7ccd1; }
.tps-status.tps-ok { color: #7bd88f; }
.tps-status.tps-err { color: #ff8a80; }
.ml-suggest-btn .bx { color: #ffdd00; }
@media (max-width: 600px) { .tps-form { padding: 28px 18px 20px; } }
/* The /suggest/ page */
.tps-card { max-width: 520px; margin: 0 auto; border: 1px solid var(--tpa-line, rgba(255,255,255,.12)); border-radius: 18px; background: rgba(255,255,255,.02); }
/* Narrow phones: the top bar is full — the About panel still has the button. */
@media (max-width: 420px) { .ml-suggest-btn { display: none !important; } }