body {
  font-family: Arial, sans-serif;
  text-align: center;
  background: #F2F4F7;
  margin: 0;
  padding: 0;
}
button {
  padding: 18px 32px;
  font-size: 22px;
  border-radius: 12px;
  border: none;
  background: #003A6A;
  color: white;
  margin: 10px;
  cursor: pointer;
}
button:hover { background:#005B99; }
.logo { width:200px; margin-top:30px; margin-bottom:20px; }
.kiosk-card {
  background:white;
  padding:40px;
  border-radius:20px;
  box-shadow:0 10px 30px rgba(0,0,0,0.08);
  width:80%;
  max-width:900px;
  margin:auto;
  margin-top:30px;
  border-top:6px solid #F4C400;
}

.pkpj-header{
    width: 100%;
    max-width: 500px;
    margin-bottom: 25px;
}

.btn-row{
    display:flex;
    justify-content:center;
    gap:20px;
    margin-bottom:20px;
}

.kiosk{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
}
.kiosk-screen{
    width:100vw;
    height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    background:#F2F4F7;
}

.kiosk-box{
    width:90%;
    max-width:900px;
    background:#ffffff;
    padding:40px 50px;
    border-radius:20px;
    box-shadow:0 15px 40px rgba(0,0,0,.15);
    text-align:center;

    min-height:80vh;
    display:flex;
    justify-content:center;
    align-items:center;
}

.kiosk-logo{
    width:280px;
    margin-bottom:20px;
    align-items:center;
}

.buttons{
    margin-top:30px;
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:25px;
}