Watch: My Zen Place Trailer</h1> <meta name="description" content="Watch the official trailer for My Zen Place. A calming sand garden app for relaxation, focus, and better sleep."> <link rel="canonical" href="https://my-zen-place.com/teaser.html" />  <meta property="og:title" content="My Zen Place Trailer"> <meta property="og:description" content="Experience the calm. Draw in sand, ripple water, and breathe."> <meta property="og:type" content="video.other"> <meta property="og:url" content="https://my-zen-place.com/teaser.html"> <meta property="og:image" content="https://my-zen-place.com/preview.jpg"> <meta property="og:video" content="https://my-zen-place.com/videos/my-zen-place.mp4">  <script type="application/ld+json"> { "@context": "https://schema.org", "@type": "VideoObject", "name": "My Zen Place - Official Trailer", "description": "A glimpse into the relaxing world of My Zen Place. A mindful sandbox for relaxation and focus. Totally offline. Totally yours.", "thumbnailUrl": [ "https://my-zen-place.com/preview.jpg" ], "uploadDate": "2026-01-05T08:00:00+08:00", "duration": "PT0M30S", "contentUrl": "https://my-zen-place.com/videos/my-zen-place.mp4", "embedUrl": "https://my-zen-place.com/teaser.html", "interactionStatistic": { "@type": "InteractionCounter", "interactionType": { "@type": "WatchAction" }, "userInteractionCount": 1284 }, "regionsAllowed": "ALL" } </script> <style> :root { --bg: #0f172a; --text: #f8fafc; --accent: #568C20; } body { margin: 0; padding: 0; background-color: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; text-align: center; } .container { width: 90%; max-width: 1000px; padding: 40px 20px; } video { width: 100%; border-radius: 12px; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.5); background: #000; } h1 { margin: 30px 0 10px; font-size: 2rem; font-weight: 800; } p { color: #94a3b8; font-size: 1.1rem; max-width: 600px; margin: 0 auto 30px; } .btn { display: inline-block; background: var(--accent); color: white; padding: 12px 30px; border-radius: 30px; text-decoration: none; font-weight: 700; transition: transform 0.2s; } .btn:hover { transform: translateY(-2px); } footer { margin-top: 50px; font-size: 0.9rem; color: #64748b; } </style> </head> <body> <div class="container"> <video controls autoplay playsinline poster="images/trailer-poster.jpg"> <source src="videos/my-zen-place.mp4" type="video/mp4"> <source src="videos/my-zen-place.webm" type="video/webm"> Your browser does not support the video tag. </video> <h1>My Zen Place Trailer</h1> <p>A mindful sandbox for relaxation and focus. Draw in sand, ripple water, and breathe.</p> <a href="/" class="btn">Visit Website</a> </div> <footer> © 2026 My Zen Place. All rights reserved. </footer> </body> </html>