:root{
  --bg:#0b1020;
  --card: linear-gradient(180deg, #eefaff, #d9f3ff); transition:width .3s ease; }/*#008040;*/
  --ink:white;
  --muted:#8aa0ff;
  --accent:#6ea8fe;
  --accent2:#8de0a6;
  --border: grey;
  --shadow: 0 40px 30px rgba(0,0,0,.25);
}

*{box-sizing:border-box}

body{
    font-family: Segoe UI, system-ui, -apple-system, Arial, sans-serif;
    font-family: Segoe, sans-serif;
    font-size: clamp(1rem, 3vw, 1.6rem); 
    margin: 0;                         /* Reset margin (not just top) */
    padding-top: 5px;                /* Replace margin-top for consistency */
    width: 100%;                      
    color: #222222;
    min-height: 100vh;
    background: linear-gradient(180deg, #fff8e1 0%, #ffe0b2 100%);
    /*background: linear-gradient(180deg, #f5f9ff 0%, #aec0d2 100%)*/


}

.wrap{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
}



.title{
    font-size:clamp(1.6rem, 4vw, 3rem);
    text-align: center;
}



.avatar {
    width: 50px;       /* adjust to fit your layout */
    height: 50px;
    border-radius: 50%; /* makes it perfectly round */
    object-fit: cover;  /* ensures it fills the circle without distortion */
    border: 2px solid #ccc; /* optional: adds a thin border */
}

.header {
  width: 80%;
  margin-left: auto;
  margin-right: auto;
  background: transparent;
  display: flex;
  justify-content: space-between;
  font-weight: bold;
  align-items: center;
  padding: 10px;
}

.header img {
    width: clamp(3rem, 6vw, 5rem);
    height: auto;
    border-radius: 50%;
}

.card{
    width: 80%;
    margin-left: auto;
    margin-right: auto;
    background: #fafafa;
    border: 1px solid #d8d8d8;
    border-radius: 18px;
    padding: 8px 6px;
    box-shadow: var(--shadow);
    line-height: 1;
}
.msgText{
    font-size:clamp(0.85rem, 2vw, 1.1rem);
    text-align: left;
    padding: 12px;
}
.msgText ol,
.msgText li{
    margin-top: 5px !important;
    margin-bottom: 0 !important;
    line-height: 1.2 !important;
}

a{color: blue;}
a:hover{text-decoration:underline; font-size: 22px;}


.titleBlock{
    display:flex;
    flex-direction:column;
    min-width:0;
}