*{box-sizing:border-box} body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;background:#f6f7fb;color:#222}
.wrap{max-width:960px;margin:0 auto;padding:16px}
.topbar{background:var(--primary,#b71c1c);color:#fff}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between}
.topbar a{color:#fff;text-decoration:none;margin-left:16px}
.brand{font-weight:700}.brand span{opacity:.8}
.footer{padding:24px 0;text-align:center;color:#666}
h1{font-size:1.6rem;margin:16px 0}
.form label{display:block;margin:12px 0}
.form input,.form textarea{width:100%;padding:10px;border:1px solid #ddd;border-radius:8px;background:#fff}
.form .preview{display:block;max-height:80px;margin-top:8px;border-radius:8px}
.form .grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form fieldset{border:1px solid #eee;border-radius:10px;padding:12px}
.btn{display:inline-block;padding:10px 14px;border-radius:10px;border:0;background:var(--primary,#b71c1c);color:#fff;text-decoration:none;margin:6px 6px 0 0}
.alert{padding:10px 14px;border-radius:8px;margin:10px 0}
.alert.ok{background:#e8f5e9;color:#2e7d32}
.alert.error{background:#ffebee;color:#c62828}

.card{background:#fff;border-radius:16px;box-shadow:0 8px 30px rgba(0,0,0,.05);padding:0;overflow:hidden}
.card .banner{height:160px;background-size:cover;background-position:center}
.card .card-header{padding:16px;text-align:center;margin-top:-48px}
.card .avatar{width:96px;height:96px;border-radius:50%;border:4px solid #fff;box-shadow:0 2px 12px rgba(0,0,0,.15)}
.card h1{margin:8px 0 0}
.card .subtitle{color:#666;margin:4px 0 0}
.card .bio{padding:0 16px 16px;color:#333}
.card .actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:8px 16px 24px}
.card .btn{background:var(--primary,#b71c1c)}
@media (max-width:720px){.form .grid{grid-template-columns:1fr}}