body{margin:0;overflow:hidden;font-family:sans-serif;background:#0a2a6c}
canvas{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0}
.glass{position:relative;z-index:1;width:90%;max-width:380px;margin:auto;margin-top:8vh;padding:25px;border-radius:25px;background:rgba(255,255,255,0.08);backdrop-filter:blur(30px);color:#fff;text-align:center;box-shadow:0 30px 80px rgba(0,0,0,.6)}
h1{font-size:1.8rem}
p{font-size:0.9rem}
.calculator{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:20px}
.display{grid-column:span 4;padding:15px;border-radius:10px;border:none;background:rgba(255,255,255,.2);color:white;text-align:right;font-size:1.3rem}
button{padding:18px;border-radius:12px;border:none;background:rgba(255,255,255,.2);color:white;cursor:pointer;font-size:1.2rem;transition:.15s}
@media (hover:hover){button:hover{transform:scale(1.08);box-shadow:0 0 15px #60a5fa}}
button:active{transform:scale(.95)}
.equals{grid-column:span 2;background:linear-gradient(135deg,#3b82f6,#60a5fa)}
@media(max-width:400px){.glass{margin-top:5vh;padding:20px}button{padding:20px;font-size:1.3rem}.display{font-size:1.4rem}}