/* App-like visual to mirror Flutter ProfilePage */
:root{
  --card-bg: #ffffff;
  --shadow: 0 6px 18px rgba(0,0,0,.28);
  --radius: 16px;
  --text: #0b1b27;
  --muted: #4b5b6a;
  --link: #1976d2;
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{
  font-family: system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,sans-serif;
  color: var(--text);
  background: #000;
}
/* Background image + gradient like the app */
.bg{
  position: fixed;
  inset: 0;
  z-index: -2;
  background: url('bg.png') center/cover no-repeat;
}
.overlay{
  position: fixed;
  inset: 0;
  z-index: -1;
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.54) 100%);
}
.wrap{
  min-height:100%;
  display:flex;
  align-items:flex-end;   /* bottom */
  justify-content:center; /* centered */
  padding: 16px 16px 60px; /* match page padding */
}
.card{
  width: 100%;
  max-width: 420px;           /* like your ConstrainedBox(maxWidth: 420) */
  background: var(--card-bg); /* solid card like Material Card */
  border-radius: var(--radius);
  box-shadow: var(--shadow);  /* elevation:6 approx */
  padding: 20px;              /* same as EdgeInsets.all(20) */
}
h1{font-size:20px;margin:0 0 8px 0;font-weight:700}
h2{font-size:16px;margin:18px 0 8px 0}
p,li{color:var(--muted);line-height:1.55;margin:0 0 10px 0}
hr{border:0;height:1px;background:#e5e8ec;margin:16px 0}
.list{
  display:grid;
  grid-template-columns: 1fr;
  gap:6px;
}
.item{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:8px 0;
  border-radius:12px;
}
.item .icon{
  width:24px;height:24px;flex:0 0 24px;
  display:inline-grid;place-items:center;
  color:#607d8b;
}
.item a{
  color: var(--text);
  text-decoration:none;
}
.item a:hover{color: var(--link)}
.item small{display:block;color:#6b7b8a}
.btn-danger{
  display:inline-flex;align-items:center;gap:8px;
  background:#d32f2f;color:#fff;border:0;border-radius:8px;
  padding:10px 14px;cursor:pointer;font-weight:600;
}
.btn-danger[disabled]{opacity:.7;cursor:not-allowed}
footer{margin-top:10px;font-size:12px;color:#6b7b8a;text-align:center}
a.inline{color:var(--link);text-decoration:none}
a.inline:hover{text-decoration:underline}
@media (min-height:760px){
  .wrap{padding-bottom:80px}
}