*{box-sizing:border-box}html,body{margin:0}
body{font-family:"Mitr",system-ui,"Noto Sans Thai",sans-serif;background:linear-gradient(180deg,#fff3f8 0%,#f2f9ff 50%,#fffaf0 100%);color:#4a2f3c;min-height:100vh;overflow-x:hidden}
.top{text-align:center;padding:28px 16px 10px;position:relative;z-index:1}
.logo{font-size:40px;font-weight:600;color:#ff5f8f;letter-spacing:.5px;text-shadow:3px 3px 0 #ffe066}
.logo span{color:#3fb6ff}
.tag{margin-top:6px;font-size:17px;color:#8a5a6f;background:#fff;display:inline-block;padding:6px 16px;border-radius:999px;box-shadow:0 4px 14px rgba(255,95,143,.15)}
.wall{max-width:1100px;margin:18px auto 0;padding:0 16px 30px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;position:relative;z-index:1}
@media(min-width:700px){.wall{grid-template-columns:repeat(3,1fr);gap:20px}}
@media(min-width:1000px){.wall{grid-template-columns:repeat(4,1fr)}}
.t{display:block;border-radius:22px;overflow:hidden;background:#fff;border:4px solid #fff;box-shadow:0 8px 22px rgba(74,47,60,.12);transition:transform .2s,box-shadow .2s}
.t:nth-child(4n+1){border-color:#ffd1e0}.t:nth-child(4n+2){border-color:#cdeeff}.t:nth-child(4n+3){border-color:#fff1b3}.t:nth-child(4n){border-color:#d8f5d0}
.t:hover,.t:active{transform:translateY(-4px) rotate(-1deg);box-shadow:0 14px 28px rgba(74,47,60,.18)}
.t img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.f{text-align:center;padding:10px 16px 34px;color:#8a5a6f;font-size:16px}
.bubbles i{position:fixed;border-radius:50%;opacity:.35;z-index:0}
.bubbles i:nth-child(1){width:120px;height:120px;background:#ffd1e0;top:6%;left:-30px}
.bubbles i:nth-child(2){width:80px;height:80px;background:#cdeeff;top:30%;right:-20px}
.bubbles i:nth-child(3){width:60px;height:60px;background:#fff1b3;bottom:12%;left:8%}
.bubbles i:nth-child(4){width:150px;height:150px;background:#d8f5d0;bottom:-50px;right:10%}
.bubbles i:nth-child(5){width:40px;height:40px;background:#ffd1e0;top:55%;left:45%}