body{background-color:#FFE700;color:white;margin:0;display:flex;flex-direction:column;height:100vh;font-family:"Nanum Gothic",sans-serif}.header{text-align:center;padding:20px;background:linear-gradient(to bottom,#FDD201 50%,#FFE700 100%)}.container{text-align:center;padding:20px;flex-grow:1;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:-105px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:20px;max-width:600px;width:100%}.card{width:100%;padding-top:100%;background-color:#ddd;border-radius:10px;cursor:pointer;position:relative;overflow:hidden;box-shadow:0 4px 8px rgba(0,0,0,0.2);transition:transform 0.2s,border 0.3s}.card:hover{transform:scale(1.1)}.card img{width:100%;height:100%;position:absolute;top:0;left:0;transition:opacity 0.3s ease}.card img.front{opacity:1}.card img.back{opacity:0}.card.revealed img.back{opacity:1}.card.revealed img.front{opacity:0}button{margin-top:20px;padding:10px 20px;font-size:16px;cursor:pointer;background-color:#4CAF50;color:white;border:none;border-radius:5px;transition:background-color 0.3s;display:none}button:hover{background-color:#45a049}.modal{display:none;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background-color:white;color:black;padding:40px;border-radius:10px;box-shadow:0 4px 8px rgba(0,0,0,0.5);z-index:1000;width:95%;max-width:500px;text-align:center}.modal.active{display:block}.modal img{max-width:100%;height:auto;margin-bottom:10px}.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);backdrop-filter:blur(5px);z-index:900;display:none}.overlay.active{display:block}h2{font-family:'Playfair Display',serif;font-size:36px;margin:0;color:green}@media(max-width:600px){.grid{grid-template-columns:repeat(3,1fr)}}@media(max-width:400px){.grid{grid-template-columns:repeat(3,1fr)}}