:root{
  --blue: #4e8ef7;
  --blue-dark: #2f6fe0;
  --soft: #e7f0ff;
  --card: #ffffff;
  --border: #e5e7eb;
  --text: #111827;
  --muted: #6b7280;
  --shadow: 0 10px 30px rgba(17,24,39,.06);
  --green: #10b981;
}

.tcc-wrap{max-width:900px;margin:28px auto;padding:0 16px;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text)}
.tcc-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:20px;box-shadow:var(--shadow)}
.tcc-title{font-size:22px;margin:0 0 6px;font-weight:800;color:var(--text)}
.tcc-desc{margin:0 0 12px;color:var(--muted)}
.tcc-label{display:block;font-weight:700;color:#374151;margin-bottom:8px}
.tcc-textarea{width:100%;min-height:140px;padding:12px;border-radius:8px;border:1px solid var(--border);background:#fbfdff;color:var(--text);box-sizing:border-box;font-size:15px}
.tcc-stats{margin-top:8px;color:var(--muted);font-size:14px}

/* buttons */
.tcc-buttons{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.tcc-case-btn{padding:10px 12px;border-radius:8px;border:0;background:var(--green);color:#fff;font-weight:700;cursor:pointer}
.tcc-case-btn[data-case="lower"]{background:#34d399}
.tcc-case-btn[data-case="upper"]{background:#60a5fa}
.tcc-case-btn[data-case="title"]{background:#4e8ef7}
.tcc-case-btn[data-case="sentence"]{background:#7dd3fc;color:#073642}
.tcc-case-btn[data-case="capitalized"]{background:#fbbf24;color:#08223f}
.tcc-case-btn[data-case="alternating"]{background:#a78bfa}
.tcc-case-btn[data-case="inverse"]{background:#f472b6}

/* actions */
.tcc-actions{display:flex;gap:10px;margin-top:14px}
.tcc-action{padding:10px 14px;border-radius:8px;border:1px solid var(--border);background:#fff;color:var(--text);font-weight:700;cursor:pointer}
.tcc-download{background:#0b61d6;color:#fff;border-color:#0b61d6}
.tcc-copy{background:#111827;color:#fff}
.tcc-clear{background:transparent;border:1px solid var(--border)}

@media(max-width:720px){
  .tcc-buttons{gap:6px}
  .tcc-actions{flex-direction:column}
}