body {
    font-family: 'Orbitron', sans-serif;
    margin: 0; padding: 0;
    background: black; color: #00ffe5;
    overflow: hidden; transition: background .5s, color .5s;
  }
  body.light-mode {
    background: white; color: black;
  }
  body.light-mode .container {
    background: rgba(255,255,255,0.85);
    box-shadow: 0 0 20px #00c2b8, 0 0 60px #00c2b8;
  }
  canvas#stars {
    position: fixed; top:0; left:0; width:100%; height:100%; z-index:0;
  }
  .container {
    position: relative; z-index:1;
    background: rgba(0,0,0,0.85);
    border-radius:20px; padding:40px;
    max-width:95%; width:400px;
    margin:50px auto; text-align:center;
    animation: fadeIn 1s ease-in-out;
    box-shadow: 0 0 20px #00ffe5, 0 0 60px #00ffe5;
  }
  @keyframes fadeIn { from {opacity:0;transform:scale(.95);} to {opacity:1;transform:scale(1);} }
  @keyframes shake { 0%,100%{transform:translateX(0);}20%,60%{transform:translateX(-10px);}40%,80%{transform:translateX(10px);} }
  .hidden { display: none; }
  input, button {
    padding:12px; font-size:18px; border-radius:10px; border: 1px solid #00ffe5; background: #0a0a0a; color: #00ffe5;
  }
  button { margin-top:20px; background:#00ffe5; color:#000; border:none; cursor:pointer; transition: transform .2s; }
  button:hover { background: #00c2b8; transform: scale(1.05); }
  .glow-border {
    border:2px solid #00ffe5; box-shadow: 0 0 10px #00ffe5;
    padding:10px; border-radius:10px; margin-top:20px;
  }
  .typewriter { overflow:hidden; border-right:.15em solid #00ffe5; white-space:nowrap; letter-spacing:.1em; animation: typing 3s steps(40,end), blink-caret .75s step-end infinite; }
  @keyframes typing { from {width:0;} to {width:100%;} }
  @keyframes blink-caret { 50%{border-color:#00ffe5;} }
  .mode-toggle { position:fixed; top:10px; right:10px; z-index:2; }
  .extra-buttons button { margin:10px 5px; }
  .fingerprint-container {
    margin:20px auto; width:100px; height:100px;
    background: radial-gradient(#00ffe5 30%, transparent 70%);
    border-radius:50%; display:flex; justify-content:center; align-items:center;
    animation: pulse 1s infinite;
  }
  .fingerprint {
    width:60px; height:60px;
    background: url('https://i.imgur.com/8s9OLpF.png') no-repeat center center;
    background-size:contain; opacity:0.5; animation: scan 1s infinite;
  }
  @keyframes pulse { 0%{transform:scale(1);opacity:.5;}50%{transform:scale(1.1);opacity:1;}100%{transform:scale(1);opacity:.5;} }
  @keyframes scan {0%{filter:brightness(1);}50%{filter:brightness(1.5);}100%{filter:brightness(1);} }
  
@media (max-width: 768px) {
  .container {
    padding: 20px;
    margin: 20px auto;
    width: 90%;
  }
  input, button {
    font-size: 16px;
    padding: 10px;
  }
  .typewriter {
    font-size: 18px;
  }
}
