:root { --bg:#0b1220; --card:#121a2b; --acc:#2f6bff; --ok:#1db954; --err:#ff4d4f; --muted:#9fb0d9; }
*{box-sizing:border-box} body{margin:0;background:radial-gradient(1200px 800px at 80% -100px, #1a2a4a 0%, #0b1220 60%), var(--bg);font-family:Inter,system-ui,Segoe UI,Roboto,Arial;color:#e8eeff}
.wrap{min-height:100dvh;display:grid;place-items:center;padding:24px; justify-content: center}
.card{width:100%;max-width:440px;background:linear-gradient(160deg,rgba(255,255,255,.04),transparent),var(--card);border:1px solid rgba(255,255,255,.08);border-radius:24px;box-shadow:0 10px 40px rgba(0,0,0,.4);padding:22px}
h1{font-size:22px;margin:0 0 6px} p.sub{margin:0 0 18px;color:var(--muted)}
label{display:block;font-size:13px;margin:12px 0 6px;color:#cbd6ff}
input{width:100%;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0f1626;color:#fff;outline:none}
input:focus{border-color:var(--acc);box-shadow:0 0 0 3px rgba(47,107,255,.25)}
.row{display:flex;gap:10px;margin-top:14px}
button{flex:1;padding:12px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#101a30;color:#fff;cursor:pointer;transition:transform .03s ease, opacity .2s}
button.primary{background:linear-gradient(180deg,#2f6bff,#1b4ae6);border-color:#2b59e5}
button:active{transform:translateY(1px)}
button[disabled]{opacity:.5;cursor:not-allowed}
.status{margin-top:14px;font-size:14px}
.status.ok{color:var(--ok)} .status.err{color:var(--err)} .status.info{color:var(--muted)}
.sep{height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.12),transparent);margin:16px 0}
.code-row{display:grid;grid-template-columns:1fr auto;gap:10px}
.hint{font-size:12px;color:#9fb0d9;margin-top:6px}


  .alert {
    display: none;
    padding: 12px 16px;
    border-radius: 12px;
    margin-top: 14px;
    font-size: 14px;
    text-align: center;
  }
  .alert.error {
    background: rgba(255, 77, 79, .1);
    color: #ff4d4f;
    border: 1px solid rgba(255, 77, 79, .4);
  }
  .alert.success {
    background: rgba(29, 185, 84, .1);
    color: #1db954;
    border: 1px solid rgba(29, 185, 84, .4);
  }
  
  
              /* ---- Tabelul ---- */
            .table-wrap {
                width: 100%;
                max-width: 800px;
                background: linear-gradient(160deg,rgba(255,255,255,.04),transparent),var(--card);
                border: 1px solid rgba(255,255,255,.08);
                border-radius: 24px;
                box-shadow: 0 10px 40px rgba(0,0,0,.4);
                padding: 22px;
                margin: 0 auto;
                display: none; /* ascuns până la login */
            }
            table {
                width: 100%;
                border-collapse: collapse;
                font-size: 14px;
                color: #e8eeff;
            }
            table thead {
                background: rgba(255,255,255,.06);
            }
            table th, table td {
                padding: 12px 14px;
                border-bottom: 1px solid rgba(255,255,255,.08);
                text-align: left;
            }
            table th {
                font-weight: 600;
                color: var(--muted);
            }
            table tr:hover td {
                background: rgba(255,255,255,.03);
            }