* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body { font-family: -apple-system, sans-serif; margin: 0; padding: 16px; background: #f5f5f7; }
.hidden { display: none; }
h2 { font-size: 20px; }
input { width: 100%; padding: 12px; margin: 8px 0; border: 1px solid #ddd;
  border-radius: 10px; font-size: 16px; }
button { padding: 12px 20px; border: none; border-radius: 10px;
  background: #1677ff; color: #fff; font-size: 16px; }
.card { background: #fff; padding: 18px; margin: 10px 0; border-radius: 14px;
  display: flex; align-items: center; gap: 12px; font-size: 17px;
  box-shadow: 0 1px 4px rgba(0,0,0,.06); }
.icon { font-size: 26px; }
.topbar { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.topbar button { background: #eee; color: #333; }
#output { background: #fff; padding: 14px; border-radius: 12px;
  white-space: pre-wrap; word-break: break-word; min-height: 100px; font-size: 15px; }