*{
   box-sizing:border-box
}
body{
   margin:0;
   font-family: verdana, Arial,Helvetica,sans-serif;
   background:#f6e6c4;
   color:#13233a;
   font-size: 1.0em;
}
.hero{
   /*   // background-image: linear-gradient(-225deg, #8D0B93 50%, #321575 100%,  #FF057C 0%);*/
   background-color: #DA251A;
   color:white;
   padding:10px 8px 18px;
   text-align:center
}
.hero h1{
   margin:0;
   font-size:clamp(28px,7vw,46px);
   font-weight:900;
   font-size: 2.0em;
   letter-spacing:.2px;
   line-height: 1.5em;
}
.hero h2{
   margin:0;
   font-size:clamp(28px,7vw,46px);
   font-weight:900;
   font-size: 1.2em;
   letter-spacing:.2px;
   line-height: 1.2em;
}
.hero p{
   margin:10px 0 0;
   opacity:.95;
   font-size:16px;
   line-height:1.4
}
.badge{
   display:inline-block;
   margin-top:13px;
   background-image: linear-gradient(-225deg, #3D4E81 0%, #5753C9 48%, #6E7FF3 100%);
   padding:7px 30px;
   border-radius:9px;
   font-weight:800
}
.wrap{
   max-width:940px;
   margin:2px auto 50px;
   padding:15px 8px 0 8px;
}
.card{
   border-radius:10px;
   box-shadow:0 10px 20px rgba(12,39,82,.16);
   padding: 20px;
   border:1px solid #e4e4e4;
}
.grid{
   display:grid;
   grid-template-columns:1fr 1fr;
   gap:13px
}
.full{
   grid-column:1/-1
}
label{
   display:block;
   font-weight:800;
   margin:0 0 7px;
   color:#173c72
}
input{
   width:100%;
   padding:10px;
   border:1.5px solid #cbd7e8;
   border-radius:11px;
   font-size:16px;
   outline:none
}
input:focus{
   border-color:#0d5bb4;
   box-shadow:0 0 0 3px rgba(13,91,180,.12)
}
button{
   width:auto;
   border:0;
   border-radius: 8px;
   background:#DA251A;
   color:white;
   padding:10px 12px;
   font-size:18px;
   font-weight:900;
   cursor:pointer;
   margin-top:15px
}
button:disabled{
   opacity:.5;
   cursor:not-allowed
}
.note{
   font-size:13px;
   color:#607087;
   margin:12px 2px 0;
   line-height:1.45
}
.loading{
   margin-top:12px;
   padding:10px 12px;
   border-radius:10px;
   background:#eef5ff;
   color:#194b85;
   font-weight:700
}
.status{
   margin:20px 0 10px;
   font-weight:800;
   color:#173c72
}
.result{
   background:white;
   border-radius:14px;
   border:1px solid #dbe4f0;
   margin:11px 0;
   padding:16px;
   box-shadow:0 4px 14px rgba(13,43,88,.06)
}
.namelabel {
   font-size:1.0em;
   font-weight:900;
   color:#f00;
}
.name{
   font-size:1.0em;
   font-weight:900;
   color:#00f;
}
.meta{
   margin-top:8px;
   line-height:1.5
}
.booth{
   margin-top:0.9em;
   border-left:5px solid #00f;
   background:#fff5f5;
   padding:11px 12px;
   border-radius:8px;
   font-weight:800;
}
.num{
   font-size:1.0em;
   color:#00f;
}
.empty{
   text-align:center;
   background:#fff7e8;
   border:1px solid #f1d79f;
   border-radius:12px;
   padding:18px;
   color:#664b18
}
footer{
   text-align:center;
   color:#708096;
   font-size:12px;
   padding:0 16px 28px;
   line-height:1.5
}
@media(max-width:650px){
   .grid{
      grid-template-columns:1fr
   }
   .full{
      grid-column:auto
   }
   .card{
      padding:16px
   }
}