/* style.css — light-mode site style (user rule: light UI only).
   NEVER DELETE COMMENTS — explain every non-obvious line. */
body { margin: 0; font: 16px/1.4 -apple-system, system-ui, sans-serif; background: #fafafa; color: #111; }
main { max-width: 900px; margin: 0 auto; padding: 16px; }
h1 { font-size: 20px; margin: 12px 0; }
video { width: 100%; max-height: 80vh; background: #000; border-radius: 8px; }  /* black letterbox behind clip */
.banner { display: block; margin: 12px 0; padding: 14px 16px; border-radius: 10px;    /* Spicy Feed promo under every video */
          background: linear-gradient(90deg, #ff3d6e, #ff8a3d); color: #fff; text-decoration: none; font-size: 18px; text-align: center; }
.banner span { display: inline-block; white-space: nowrap; }                /* each phrase wraps as a unit — never splits "Spicy Feed" on mobile */
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 12px; }
.grid a { color: inherit; text-decoration: none; }
.grid img { width: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: 6px; }