body { font-family: Arial, sans-serif; background: #f5f7fb; margin:0; padding:0; color:#1f2d3d; }
.container { max-width: 840px; margin: 0 auto; padding: 24px; }
header { text-align:center; margin-bottom:24px; }
.card { background:#fff; padding:20px; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,0.08); }
label { display:block; margin-bottom:8px; font-weight:bold; }
input[type=text] { width:100%; padding:12px; border:1px solid #ccd; border-radius:6px; font-size:16px; }
button { background:#0069d9; color:#fff; border:none; border-radius:6px; padding:12px 16px; margin-top:12px; cursor:pointer; }
button:hover { background:#0057b8; }
.alert { margin-top:16px; padding:12px; border-radius:6px; }
.alert.error { background:#ffe5e5; color:#8b0000; }
.alert.success { background:#e8f7e4; color:#1b5e20; }
.try { margin-top:24px; }
.examples button { margin-right:8px; margin-bottom:8px; }
footer { text-align:center; margin-top:32px; color:#7a8699; }
.hint { color:#6b7280; font-size:14px; }