/* The supplied logo stays untouched. Warm neutrals and restrained red accents
   support its detail while established teal controls retain their identity. */
:root {
 --color-brand-red:#dd1838;
 --color-brand-red-dark:#b81230;
 --color-brand-rose:#fff0ed;
}
body>header {
 background:linear-gradient(105deg,#f2ede3 55%,#f8eee7);
}
body>header>img {
 width:82px;
 height:82px;
 object-fit:contain;
 flex-shrink:0;
}
header .brand-caption { color:#715b4d; }
.welcome-logo {
 display:block;
 width:160px;
 height:160px;
 object-fit:contain;
 margin:0 0 22px;
}
.welcome-story { padding-top:0; }
.welcome-story .eyebrow { color:var(--color-brand-red-dark); }
.welcome-story h2 { font-size:clamp(36px,4.1vw,55px); }
.welcome-modes { margin:25px 0; gap:18px; }
.welcome-modes>div:nth-child(2) .nav-icon {
 background:var(--color-brand-rose);
 border-color:#f2d9d1;
 color:var(--color-brand-red-dark);
}
#matching-buttons-container #likeBtnMatch {
 background:var(--color-brand-red);
 border-color:var(--color-brand-red);
 box-shadow:0 6px 20px rgb(221 24 56 / .18);
}
#matching-buttons-container #likeBtnMatch:hover {
 background:var(--color-brand-red-dark);
 border-color:var(--color-brand-red-dark);
}
.auth-panel { border-color:#e6ddd4; }
.card>img[src*="logo.png"] {
 display:block;
 width:128px;
 height:128px;
 object-fit:contain;
 margin:0 auto 20px;
}
@media(max-width:800px) {
 body>header>img { width:64px; height:64px; }
}
@media(max-width:700px) {
 body>header { padding:10px 14px; gap:10px; }
 header .brand-copy h1 { font-size:15px; }
 .brand-caption { font-size:6.5px; letter-spacing:.8px; }
 .welcome-logo { width:110px; height:110px; margin:0 auto 18px; }
 .welcome-story { padding-top:0; }
 .welcome-story h2 { font-size:34px; }
 .card>img[src*="logo.png"] { width:110px; height:110px; }
}
@media(max-width:360px) {
 body>header>img { width:54px; height:54px; }
 .brand-caption { display:none; }
}