From 20b4ec53279536be3b1c9134968beee58db4c393 Mon Sep 17 00:00:00 2001
From: travis <travis@heinstrom.com>
Date: Thu, 2 Apr 2026 16:16:10 -0400
Subject: [PATCH] Make card more prominent and fix iOS touch

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 css/style.css | 23 ++++++++++++-----------
 js/main.js    |  3 ++-
 2 files changed, 14 insertions(+), 12 deletions(-)

diff --git a/css/style.css b/css/style.css
index d65b758..544a600 100755
--- a/css/style.css
+++ b/css/style.css
@@ -41,9 +41,9 @@ body {
 .card {
   display: block;
   position: relative;
-  max-width: 420px;
-  width: 80%;
-  height: 260px;
+  max-width: 500px;
+  width: 85%;
+  height: 300px;
   color: #fff;
   flex: none;
   perspective: 1000px;
@@ -56,8 +56,8 @@ body {
   min-height: 100%;
   display: block;
   position: relative;
-  background: #111;
-  border-radius: 3px;
+  background: linear-gradient(145deg, #161616, #0e0e0e);
+  border-radius: 5px;
 }
 
 .card__figure::before {
@@ -67,10 +67,10 @@ body {
   height: calc(100% - 14px);
   top: 6px;
   left: 6px;
-  border: 1px solid rgba(255, 255, 255, 0.1);
-  border-radius: 2px;
+  border: 1px solid rgba(255, 255, 255, 0.12);
+  border-radius: 3px;
   pointer-events: none;
-  box-shadow: 0 30px 20px rgb(0 0 0 / 50%);
+  box-shadow: 0 30px 40px rgb(0 0 0 / 60%), 0 0 80px rgb(0 0 0 / 30%);
 }
 
 .card__deco {
@@ -100,7 +100,7 @@ body {
 
 figcaption {
   height: 100%;
-  padding: 25px;
+  padding: 30px;
   color: #eee;
   font-family: Avenir;
   display: flex;
@@ -110,9 +110,10 @@ figcaption {
 
 h1 {
   margin: 0;
-  font-size: 3.3rem;
-  line-height: 3.3rem;
+  font-size: 3.6rem;
+  line-height: 3.6rem;
   font-weight: 900;
+  letter-spacing: -0.02em;
 }
 
 .links {
diff --git a/js/main.js b/js/main.js
index af229bb..94266d5 100644
--- a/js/main.js
+++ b/js/main.js
@@ -105,6 +105,7 @@
     };
 
     this.touchmoveFn = function (ev) {
+      ev.preventDefault();
       if (self._gyroActive) return;
       var touch = ev.touches[0];
       if (!touch) return;
@@ -123,7 +124,7 @@
     this.DOM.el.addEventListener("mouseleave", this.mouseleaveFn);
     this.DOM.el.addEventListener("mouseenter", this.mouseenterFn);
     this.DOM.el.addEventListener("touchstart", this.touchstartFn, { passive: true });
-    this.DOM.el.addEventListener("touchmove", this.touchmoveFn, { passive: true });
+    this.DOM.el.addEventListener("touchmove", this.touchmoveFn, { passive: false });
     this.DOM.el.addEventListener("touchend", this.debounceLeaveFn);
   };