*{margin:0;padding:0;box-sizing:border-box}body{font-family:Segoe UI,sans-serif}.app{height:100vh;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#141e30,#243b55);overflow:hidden}.card{background:#ffffff14;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:50px 70px;border-radius:25px;text-align:center;color:#fff;box-shadow:0 25px 50px #00000080;transition:.4s ease;position:relative}.card:hover{transform:translateY(-10px) scale(1.02);box-shadow:0 30px 70px #000000b3}.title{font-weight:400;letter-spacing:3px;opacity:.8;margin-bottom:20px;transition:.3s}.title:hover{letter-spacing:6px}.clock{font-size:70px;font-weight:700;letter-spacing:4px;margin-bottom:10px;transition:.4s;cursor:pointer}.clock:hover{color:#00f2ff;text-shadow:0 0 15px #00f2ff,0 0 30px #00f2ff;transform:scale(1.05)}.date{margin-bottom:25px;opacity:.7;font-size:18px;transition:.4s}.date:hover{color:#00f2ff;text-shadow:0 0 15px #00f2ff,0 0 30px #00f2ff;transform:scale(1.15)}.seconds-bar{width:100%;height:6px;background:#fff3;border-radius:10px;overflow:hidden;margin-bottom:30px}.progress{height:100%;background:linear-gradient(90deg,#00f2ff,#4facfe);transition:width 1s linear}