.ts-header { text-align:center; padding:1.6rem 1rem .4rem; }
.ts-header-emoji { font-size:2.4rem; display:block; }
.ts-header h1 { font-size:1.5rem; font-weight:800; margin:.3rem 0 .2rem; }
.ts-header p { color:var(--bs-secondary, #6b7280); margin:0; font-size:.9rem; }

.ts-shell { max-width:720px; margin:0 auto; padding:1rem; }
.ts-grid { display:grid; gap:1.1rem; }
.ts-card { border-radius:16px; background:var(--bs-body-bg,#fff); box-shadow:0 1px 3px rgba(0,0,0,.06), 0 0 0 1px rgba(0,0,0,.07); padding:1.2rem; }
.ts-card h2 { font-size:1.05rem; font-weight:800; margin:0 0 .9rem; display:flex; align-items:center; gap:.5rem; }
.ts-card h2 .ts-ico { width:30px; height:30px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-size:.9rem; }

.ts-label { font-size:.82rem; font-weight:600; margin-bottom:.35rem; display:block; }
.ts-input { width:100%; padding:.65rem .8rem; border-radius:10px; border:1px solid rgba(0,0,0,.18); font-size:1rem; font-family:ui-monospace,Consolas,monospace; }
.ts-input:focus { outline:none; border-color:#6366f1; box-shadow:0 0 0 3px rgba(99,102,241,.15); }
.ts-row { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.6rem; }
.ts-btn { border:none; border-radius:9px; padding:.5rem 1rem; font-weight:700; font-size:.85rem; cursor:pointer; background:#6366f1; color:#fff; }
.ts-btn:hover { filter:brightness(1.08); }
.ts-btn.ghost { background:transparent; color:var(--bs-body-color,#111); border:1px solid rgba(0,0,0,.18); }

.ts-out { margin-top:1rem; display:grid; gap:.5rem; }
.ts-out-row { display:flex; align-items:center; gap:.6rem; background:var(--bs-secondary-bg,#f4f5f7); border-radius:10px; padding:.55rem .7rem; }
.ts-out-row .k { font-size:.74rem; color:var(--bs-secondary,#6b7280); width:115px; flex-shrink:0; font-weight:600; }
.ts-out-row .v { font-family:ui-monospace,Consolas,monospace; font-size:.92rem; word-break:break-all; flex:1; }
.ts-copy { border:none; background:transparent; cursor:pointer; color:#6366f1; font-size:.85rem; padding:.2rem .45rem; border-radius:6px; flex-shrink:0; }
.ts-copy:hover { background:rgba(99,102,241,.12); }
.ts-err { color:#ef4444; font-size:.85rem; margin-top:.5rem; min-height:1em; }
.ts-hint { color:var(--bs-secondary,#6b7280); font-weight:400; font-size:.78rem; }