Files
lukeandClaude Opus 5 821b78aa74 Give episode pages margins and centre the player bar
The player, transcript and nav sections had no width constraint at all, so
they ran edge to edge while .page-header above them sat in the site's usual
900px centred container.

- Transcript now sits in a 680px centred column at 1.05rem/1.7, which holds
  the measure near 75 characters per line; 900px runs past 90, which is tiring
  over a full transcript. Gutters are 1.5rem, tightening to 1.15rem under 600px
- Player bar is centred at max-width 640px instead of stretching the column,
  and goes full width on phones
- Bumped the stylesheet cache-buster to v=8 and regenerated all 58 episode
  pages so existing transcripts pick the styles up

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-08-15 17:05:25 -05:00

337 lines
19 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Luke at the Roost — Late-Night Call-In Comedy from Alpine, Texas</title>
<meta name="description" content="A late-night call-in comedy podcast from Alpine, Texas, in the Big Bend. Callers from Marfa, Terlingua, Marathon and Fort Stockton talk to Luke MacNeil about life, love, and the Marfa Lights. 50+ episodes. Call in: 208-439-LUKE.">
<meta name="keywords" content="Big Bend podcast, Alpine Texas podcast, Marfa podcast, Marfa Lights, Terlingua, West Texas radio, call-in radio, late-night radio, Luke MacNeil, AI podcast, AI-generated callers, comedy podcast">
<meta name="theme-color" content="#1a1209">
<link rel="canonical" href="https://lukeattheroost.com">
<!-- OG / Social -->
<meta property="og:site_name" content="Luke at the Roost">
<meta property="og:title" content="Luke at the Roost — Late-Night Call-In Comedy from Alpine, Texas">
<meta property="og:description" content="A late-night call-in comedy podcast from Alpine, Texas, in the Big Bend. Callers from Marfa, Terlingua, Marathon and Fort Stockton talk to Luke about life, love, and everything in between. 50+ episodes.">
<meta property="og:image" content="https://cdn.lukeattheroost.com/media/podcasts/LukeAtTheRoost/cover_feed.png?v=3">
<meta property="og:url" content="https://lukeattheroost.com">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Luke at the Roost — Late-Night Call-In Comedy from Alpine, Texas">
<meta name="twitter:description" content="A late-night call-in comedy podcast from Alpine, Texas, in the Big Bend. Callers from Marfa, Terlingua, Marathon and Fort Stockton talk to Luke about life, love, and everything in between. 50+ episodes.">
<meta name="twitter:image" content="https://cdn.lukeattheroost.com/media/podcasts/LukeAtTheRoost/cover_feed.png?v=3">
<!-- Favicon -->
<link rel="icon" href="favicon.ico" sizes="48x48">
<link rel="icon" type="image/svg+xml" href="favicon.svg">
<link rel="icon" type="image/png" sizes="192x192" href="favicon-192.png">
<link rel="icon" type="image/png" sizes="48x48" href="favicon-48.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon-32.png">
<link rel="icon" type="image/png" sizes="16x16" href="favicon-16.png">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<link rel="alternate" type="application/rss+xml" title="Luke at the Roost RSS Feed" href="https://podcast.macneilmediagroup.com/@LukeAtTheRoost/feed.xml">
<link rel="stylesheet" href="css/style.css?v=8">
<!-- Structured Data -->
<script type="application/ld+json">
[{
"@context": "https://schema.org",
"@type": "PodcastSeries",
"name": "Luke at the Roost",
"description": "A late-night call-in comedy podcast broadcast from Alpine, Texas, in the Big Bend country of far West Texas. Real callers and AI-generated characters from Marfa, Terlingua, Marathon, Fort Stockton and the Big Bend talk to host Luke MacNeil about life, love, relationships, the Marfa Lights, and everything in between. 50+ episodes of unpredictable conversations.",
"url": "https://lukeattheroost.com",
"image": "https://cdn.lukeattheroost.com/media/podcasts/LukeAtTheRoost/cover_feed.png?v=3",
"author": {
"@type": "Person",
"name": "Luke MacNeil",
"url": "https://lukeattheroost.com"
},
"publisher": {
"@type": "Organization",
"name": "MacNeil Media Group",
"url": "https://macneilmediagroup.com"
},
"genre": ["Comedy", "Talk", "Technology"],
"inLanguage": "en",
"webFeed": "https://podcast.macneilmediagroup.com/@LukeAtTheRoost/feed.xml",
"startDate": "2026-02",
"keywords": "Big Bend podcast, Alpine Texas, Marfa, Marfa Lights, Terlingua, Marathon Texas, Fort Stockton, West Texas, call-in radio, late-night talk show, AI podcast, AI-generated callers, comedy",
"contentLocation": {
"@type": "Place",
"name": "Big Bend, West Texas",
"address": {
"@type": "PostalAddress",
"addressLocality": "Alpine",
"addressRegion": "TX",
"addressCountry": "US"
},
"geo": {
"@type": "GeoCoordinates",
"latitude": 30.3585,
"longitude": -103.661
}
},
"spatialCoverage": {
"@type": "Place",
"name": "Big Bend region, far West Texas",
"description": "Alpine, Marfa, Marathon, Terlingua, Fort Stockton, Fort Davis, Presidio and Big Bend National Park."
},
"about": [
{ "@type": "Place", "name": "Alpine, Texas" },
{ "@type": "Place", "name": "Marfa, Texas" },
{ "@type": "Place", "name": "Terlingua, Texas" },
{ "@type": "Place", "name": "Big Bend National Park" },
{ "@type": "Thing", "name": "Marfa Lights" }
],
"sameAs": [
"https://open.spotify.com/show/0ZrpMigG1fo0CCN7F4YmuF",
"https://podcasts.apple.com/us/podcast/luke-at-the-roost/id1875205848",
"https://www.youtube.com/watch?v=xryGLifMBTY&list=PLGq4uZyNV1yYH_rcitTTPVysPbC6-7pe-",
"https://discord.gg/5CnQZxDM",
"https://www.instagram.com/lukeattheroost/",
"https://x.com/lukeattheroost",
"https://www.tiktok.com/@luke.at.the.roost",
"https://bsky.app/profile/lukeattheroost.bsky.social",
"https://www.facebook.com/profile.php?id=61588191627949",
"https://www.linkedin.com/company/luke-at-the-roost"
]
},
{
"@context": "https://schema.org",
"@type": "WebSite",
"name": "Luke at the Roost",
"url": "https://lukeattheroost.com",
"description": "Official website for Luke at the Roost, an AI-powered late-night call-in comedy podcast.",
"publisher": {
"@type": "Organization",
"name": "MacNeil Media Group",
"url": "https://macneilmediagroup.com",
"logo": {
"@type": "ImageObject",
"url": "https://cdn.lukeattheroost.com/media/podcasts/LukeAtTheRoost/cover_feed.png?v=3"
},
"contactPoint": {
"@type": "ContactPoint",
"email": "luke@lukeattheroost.com",
"contactType": "customer support"
}
}
}]
</script>
<script defer data-website-id="ae816554-19c8-4e97-a2cb-d0226c27e9bc" data-host-url="/" src="/p/script"></script>
</head>
<body>
<a href="#main-content" class="skip-link">Skip to content</a>
<nav class="site-nav">
<a href="/" class="site-nav-brand">Luke at the Roost</a>
<div class="site-nav-links">
<a href="/how-it-works">How It Works</a>
<a href="/clips">Clips</a>
<a href="/stats">Stats</a>
</div>
</nav>
<main id="main-content">
<!-- Banner -->
<div class="banner">
<img src="images/banner.png" alt="Luke at the Roost — ON AIR" class="banner-img" width="1500" height="500" sizes="100vw" fetchpriority="high">
</div>
<!-- Hero -->
<section class="hero">
<div class="hero-grid">
<div class="hero-text">
<h1 class="sr-only">Luke at the Roost</h1>
<p class="tagline tagline--hero">Every caller is AI. Every conversation is real. Every episode is a disaster.</p>
<p class="tagline tagline--sub">The call-in talk show where Luke gives life advice to biologically questionable organisms.</p>
<div class="phone" id="phone-section">
<div class="on-air-badge" id="on-air-badge">
<span class="on-air-dot"></span>
ON AIR
</div>
<div class="off-air-badge" id="off-air-badge">
OFF AIR
</div>
<span class="phone-inline">Call in: <strong>208-439-LUKE</strong></span>
</div>
<div class="subscribe-row">
<span class="subscribe-label">Listen On</span>
<div class="subscribe-buttons">
<a href="https://open.spotify.com/show/0ZrpMigG1fo0CCN7F4YmuF?si=f990713adce84ba4" target="_blank" rel="noopener" class="subscribe-btn">
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.4 0 0 5.4 0 12s5.4 12 12 12 12-5.4 12-12S18.66 0 12 0zm5.521 17.34c-.24.359-.66.48-1.021.24-2.82-1.74-6.36-2.101-10.561-1.141-.418.122-.779-.179-.899-.539-.12-.421.18-.78.54-.9 4.56-1.021 8.52-.6 11.64 1.32.42.18.479.659.301 1.02zm1.44-3.3c-.301.42-.841.6-1.262.3-3.239-1.98-8.159-2.58-11.939-1.38-.479.12-1.02-.12-1.14-.6-.12-.48.12-1.021.6-1.141C9.6 9.9 15 10.561 18.72 12.84c.361.181.54.78.241 1.2zm.12-3.36C15.24 8.4 8.82 8.16 5.16 9.301c-.6.179-1.2-.181-1.38-.721-.18-.601.18-1.2.72-1.381 4.26-1.26 11.28-1.02 15.721 1.621.539.3.719 1.02.419 1.56-.299.421-1.02.599-1.559.3z"/></svg>
Spotify
</a>
<a href="https://podcasts.apple.com/us/podcast/luke-at-the-roost/id1875205848" target="_blank" rel="noopener" class="subscribe-btn">
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M5.34 0A5.328 5.328 0 0 0 0 5.34v13.32A5.328 5.328 0 0 0 5.34 24h13.32A5.328 5.328 0 0 0 24 18.66V5.34A5.328 5.328 0 0 0 18.66 0zm6.525 2.568c2.336 0 4.448.902 4.448 3.545 0 1.497-.89 2.67-1.916 3.545-.663.566-.795 .84-.795 1.347 0 .6.397 1.173.894 1.722 1.417 1.564 1.96 2.853 1.96 4.448 0 3.063-2.673 4.257-5.165 4.257-.315 0-.658-.02-.994-.063-1.523-.195-2.86-.9-3.632-.9-.82 0-1.98.623-3.377.87A5.715 5.715 0 0 1 3.15 21.4c-1.27 0-2.1-.96-2.1-2.663 0-1.2.6-2.7 1.845-4.29.63-.81 1.62-1.83 2.91-2.31-.06-.6-.09-1.14-.09-1.62 0-4.28 2.76-7.95 6.15-7.95z"/></svg>
Apple
</a>
<a href="https://www.youtube.com/watch?v=xryGLifMBTY&list=PLGq4uZyNV1yYH_rcitTTPVysPbC6-7pe-" target="_blank" rel="noopener" class="subscribe-btn">
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>
YouTube
</a>
<a href="https://podcast.macneilmediagroup.com/@LukeAtTheRoost/feed.xml" target="_blank" rel="noopener" class="subscribe-btn">
<svg viewBox="0 0 24 24" fill="currentColor"><path d="M6.503 20.752c0 1.794-1.456 3.248-3.251 3.248S0 22.546 0 20.752s1.456-3.248 3.252-3.248 3.251 1.454 3.251 3.248zM.002 9.473v4.594c5.508.163 9.929 4.584 10.092 10.091h4.594C14.524 16.21 7.849 9.636.002 9.473zM.006 0v4.604C10.81 4.77 19.23 13.19 19.396 24h4.604C23.834 10.952 13.054.166.006 0z"/></svg>
RSS
</a>
</div>
</div>
<div class="hero-links">
<a href="/how-it-works">How It Works</a>
<span class="hero-links-sep">&middot;</span>
<a href="https://ko-fi.com/lukemacneil" target="_blank" rel="noopener" class="support-link">Support the Show</a>
</div>
</div>
</div>
</section>
<!-- Social Proof Strip -->
<section class="proof-strip">
<div class="proof-strip-inner">
<blockquote class="proof-quote">"I've been Diane for seven months and I can't stop."<cite>— Not Diane, Ep. 24</cite></blockquote>
<blockquote class="proof-quote">"I tasted the exit sign. Like green metal in my mouth."<cite>— Floyd, Ep. 15</cite></blockquote>
<blockquote class="proof-quote">"I'm holding his dogs until he pays up. All three of them."<cite>— Mavis, Ep. 24</cite></blockquote>
</div>
</section>
<!-- Best Clips -->
<section class="home-clips-section">
<div class="home-clips-header">
<h2>Best Clips</h2>
<a href="/clips" class="clips-see-all">See all clips &rarr;</a>
</div>
<div class="home-clips-grid" id="home-clips"></div>
</section>
<!-- Featured Episode -->
<section class="featured-episode-section">
<h2>Latest Episode</h2>
<div id="featured-episode"></div>
</section>
<!-- Episodes -->
<section class="episodes-section">
<h2 id="episodes-heading">Episodes</h2>
<div class="episodes-list" id="episodes-list">
<div class="episodes-loading">Loading episodes...</div>
</div>
</section>
<!-- Testimonials -->
<section class="testimonials-section">
<h2>What Callers Are Saying</h2>
<div class="testimonials-slider" id="testimonials-slider">
<div class="testimonials-track" id="testimonials-track">
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9733;</div>
<p class="testimonial-text">"I called in at 2 AM about my neighbor's rooster situation and Luke talked me off the ledge. Literally saved my relationship with the entire block. My wife thinks I'm crazy for calling a radio show but hey, it worked."</p>
<div class="testimonial-author">
<span class="testimonial-name">Tony M.</span>
<span class="testimonial-location">Alpine, TX</span>
</div>
</div></div>
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9733;</div>
<p class="testimonial-text">"Called to talk about the Severance finale and ended up getting life advice I didn't know I needed. Luke somehow connected Lumon Industries to my actual job and I quit the next week. Best decision I ever made."</p>
<div class="testimonial-author">
<span class="testimonial-name">Carmen R.</span>
<span class="testimonial-location">Marfa, TX</span>
</div>
</div></div>
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9733;</div>
<p class="testimonial-text">"I've been listening since episode one. Called in about my truck breaking down outside Marathon and Luke spent twenty minutes just talking me through it. Turns out it was the alternator AND my attitude. He was right about both."</p>
<div class="testimonial-author">
<span class="testimonial-name">Dale W.</span>
<span class="testimonial-location">Marathon, TX</span>
</div>
</div></div>
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9734;</div>
<p class="testimonial-text">"I called in to ask about astrophotography tips and somehow ended up telling Luke about my divorce. He's got this way of getting you to open up. Still shooting the Milky Way every clear night though. Thanks Luke."</p>
<div class="testimonial-author">
<span class="testimonial-name">Jessie K.</span>
<span class="testimonial-location">Fort Davis, TX</span>
</div>
</div></div>
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9733;</div>
<p class="testimonial-text">"My buddy dared me to call in and I ended up having the most real conversation I've had in years. We talked about The Wire for like ten minutes and then he hit me with some truth about why I keep ghosting people. This show is something else."</p>
<div class="testimonial-author">
<span class="testimonial-name">Marcus T.</span>
<span class="testimonial-location">Alpine, TX</span>
</div>
</div></div>
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9733;</div>
<p class="testimonial-text">"I work night shifts in the oilfield and this show keeps me sane. Finally called in about a thing with my sister and Luke gave me advice that actually made sense. We're talking again for the first time in three years."</p>
<div class="testimonial-author">
<span class="testimonial-name">Ray D.</span>
<span class="testimonial-location">Fort Stockton, TX</span>
</div>
</div></div>
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9733;</div>
<p class="testimonial-text">"Called about my poker game falling apart because my best friend cheated. Luke compared it to a Breaking Bad episode and somehow made me see the whole situation differently. We play again every Thursday now."</p>
<div class="testimonial-author">
<span class="testimonial-name">Elena S.</span>
<span class="testimonial-location">Terlingua, TX</span>
</div>
</div></div>
<div class="testimonial-card"><div class="testimonial-inner">
<div class="testimonial-stars">&#9733;&#9733;&#9733;&#9733;&#9734;</div>
<p class="testimonial-text">"I was just gonna ask about quantum entanglement because I read this article, but Luke turned it into a metaphor for my long distance relationship and honestly? He wasn't wrong. We're moving in together next month."</p>
<div class="testimonial-author">
<span class="testimonial-name">Priya N.</span>
<span class="testimonial-location">Presidio, TX</span>
</div>
</div></div>
</div>
</div>
<div class="testimonials-dots" id="testimonials-dots"></div>
</section>
</main>
<footer class="footer"></footer>
<!-- Sticky CTA Bar — appears after scrolling past hero -->
<div class="sticky-cta" id="sticky-cta" aria-hidden="true">
<a href="tel:+12084395853" class="sticky-cta-link">
<svg class="sticky-cta-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
Call in live: <strong>208-439-LUKE</strong>
</a>
</div>
<!-- Sticky Audio Player -->
<div class="sticky-player" id="sticky-player">
<div class="player-inner">
<button class="player-play-btn" id="player-play-btn" aria-label="Play/Pause">
<svg class="icon-play" viewBox="0 0 24 24"><path d="M8 5v14l11-7z"/></svg>
<svg class="icon-pause" viewBox="0 0 24 24" style="display:none"><path d="M6 19h4V5H6v14zm8-14v14h4V5h-4z"/></svg>
</button>
<div class="player-info">
<div class="player-title" id="player-title"></div>
<div class="player-progress-row">
<div class="player-progress" id="player-progress" role="slider" aria-label="Audio progress" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" tabindex="0">
<div class="player-progress-fill" id="player-progress-fill"></div>
</div>
<span class="player-time" id="player-time">0:00 / 0:00</span>
</div>
</div>
</div>
</div>
<audio id="audio-element" preload="none"></audio>
<script src="js/footer.js"></script>
<script src="js/clips.js"></script>
<script>renderFeaturedClipsInline('home-clips');</script>
<script src="js/player.js"></script>
<script src="js/app.js?v=6"></script>
</body>
</html>