*{box-sizing:border-box}
body{font-family:system-ui,Arial,sans-serif;line-height:1.4;margin:0;background:#f5f5f7;color:#222}
header{background:#111;color:#fff;padding:16px 20px}
h1{margin:0 0 6px 0;font-size:22px}
main{display:grid;gap:16px;padding:16px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
.card{background:#fff;border:1px solid #e5e7eb;border-radius:14px;padding:14px;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.row{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0}
label{display:flex;flex-direction:column;gap:6px;font-size:14px}
input,select,button{font-size:14px;padding:8px;border:1px solid #d1d5db;border-radius:10px}
button{cursor:pointer}
button:disabled{opacity:.6}
.out{margin-top:8px;padding:8px;background:#fafafa;border:1px dashed #e5e7eb;border-radius:10px;min-height:28px}
footer{padding:16px;border-top:1px solid #e5e7eb;background:#fff;position:sticky;bottom:0}
ul{list-style:decimal;padding-left:18px}