*{box-sizing:border-box}body{margin:0;background:#10131a;color:#f5f7fb;font-family:Arial,Helvetica,sans-serif}.public-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top,#29364d,#10131a 60%)}.public-card{width:min(680px,92vw);padding:42px;border:1px solid #293247;border-radius:22px;background:#171b25;text-align:center;box-shadow:0 20px 80px #0008}.public-card h1{font-size:42px;margin:0 0 14px}.public-card p{color:#b8c0d4;font-size:19px}.admin-link{display:block;margin-top:22px;color:#8ab4ff}.layout{display:flex;min-height:100vh}.sidebar{width:250px;background:#0b0d12;border-right:1px solid #252b38;padding:28px}.sidebar h2{margin:0;font-size:30px}.sidebar p{color:#96a0b8}.content{flex:1;padding:26px;overflow:auto}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.topbar h1{margin:0}.cards{display:grid;grid-template-columns:repeat(4,minmax(130px,1fr));gap:16px;margin-bottom:22px}.card,.panel{background:#171b25;border:1px solid #293247;border-radius:16px;padding:20px}.card span{display:block;color:#9ea8bd}.card strong{font-size:34px}.panel{margin-bottom:20px}.form-row{display:flex;gap:12px;flex-wrap:wrap}select,input{background:#0f1219;color:#f5f7fb;border:1px solid #30384a;border-radius:10px;padding:13px;font-size:15px;min-width:220px}.btn{display:inline-block;background:#00b894;color:white;border:0;border-radius:10px;padding:13px 18px;font-size:15px;font-weight:700;text-decoration:none;cursor:pointer}.btn:hover{filter:brightness(1.1)}.secondary{background:#293247}.message{min-height:22px;color:#8fffd4}.search{width:100%;margin-bottom:15px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:900px}th,td{border-bottom:1px solid #293247;padding:12px;text-align:left}th{background:#111620;color:#c4cbda}.status-unused{color:#d7d7d7}.status-active{color:#00e6a8}.status-blocked{color:#ff6b6b}@media(max-width:850px){.layout{display:block}.sidebar{width:100%;border-right:0;border-bottom:1px solid #252b38}.cards{grid-template-columns:repeat(2,1fr)}.topbar{display:block}.form-row>*{width:100%}}.hidden {
  display: none !important;
}

#loginScreen {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0f1117;
}

.login-box {
  width: 360px;
  background: #171b24;
  padding: 30px;
  border-radius: 16px;
  text-align: center;
  color: white;
  box-shadow: 0 0 30px #000;
}

.login-box input {
  width: 100%;
  padding: 12px;
  margin: 10px 0;
  border-radius: 8px;
  border: none;
}

.login-box button {
  width: 100%;
  padding: 12px;
  margin-top: 10px;
  border: none;
  border-radius: 8px;
  background: #00b894;
  color: white;
  font-size: 16px;
  cursor: pointer;
}

#loginMessage {
  color: #ff7675;
}
