leDailySquirrel/fp.html

360 lines
14 KiB
HTML
Raw Normal View History

2026-07-03 15:44:56 +00:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Le Daily Squirrel</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=Old+Standard+TT:ital,wght@0,400;0,700;1,400&family=Oswald:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
:root {
--ink: #1a1a1a;
--paper: #f3ecdb;
--paper-shade: #e8dfca;
--faded: #4a4640;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
background: #d9d2bf;
color: var(--ink);
font-family: 'Old Standard TT', Georgia, serif;
line-height: 1.3;
padding: 24px 12px;
display: flex;
justify-content: center;
}
.newspaper {
width: 100%;
max-width: 960px;
background: var(--paper);
/* aged paper grain + vignette */
background-image:
radial-gradient(ellipse at 50% 0%, rgba(0,0,0,0) 60%, rgba(60,50,30,0.10) 100%),
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
padding: 26px 30px 40px;
box-shadow: 0 8px 40px rgba(0,0,0,0.4);
position: relative;
}
hr.rule { border: none; border-top: 2px solid var(--ink); margin: 0; }
hr.thin { border: none; border-top: 1px solid var(--ink); margin: 0; }
hr.hair { border: none; border-top: 1px solid var(--faded); margin: 0; }
/* ---------- MASTHEAD ---------- */
.ears {
display: flex;
justify-content: space-between;
align-items: flex-start;
font-family: 'Oswald', sans-serif;
font-size: 11px;
line-height: 1.35;
text-transform: uppercase;
letter-spacing: 0.3px;
font-weight: 600;
padding-bottom: 4px;
}
.ears .left { text-align: left; }
.ears .right { text-align: right; }
.masthead {
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
gap: 10px;
padding: 6px 0 10px;
}
.nameplate {
font-family: 'Playfair Display', serif;
font-weight: 900;
font-size: clamp(38px, 8.5vw, 86px);
letter-spacing: 2px;
line-height: 0.9;
white-space: nowrap;
}
.nameplate.left { text-align: right; padding-right: 6px; }
.nameplate.right { text-align: left; padding-left: 6px; }
.emblem { width: clamp(64px, 12vw, 104px); height: auto; display: block; }
.dateline {
display: flex;
justify-content: space-between;
align-items: baseline;
font-family: 'Old Standard TT', serif;
font-size: 13px;
padding: 5px 2px;
}
.dateline .vol { font-weight: 700; }
.dateline .place { font-style: italic; }
.dateline .price { font-weight: 700; }
/* ---------- MAIN HEADLINE ---------- */
.banner {
font-family: 'Oswald', sans-serif;
font-weight: 700;
text-transform: uppercase;
font-size: clamp(40px, 10.5vw, 96px);
line-height: 0.92;
letter-spacing: -1px;
text-align: center;
padding: 14px 0 12px;
transform: scaleY(1.08);
}
/* ---------- BODY GRID ---------- */
.columns {
display: grid;
grid-template-columns: 1.05fr 0.95fr 1fr;
gap: 0;
}
.col { padding: 12px 16px; }
.col + .col { border-left: 1px solid var(--ink); }
.col p {
text-align: justify;
hyphens: auto;
font-size: 13px;
line-height: 1.42;
margin-bottom: 9px;
color: var(--faded);
}
.col p:first-of-type::first-letter,
.lede::first-letter {
/* drop cap on the lede only */
}
/* sub-headlines */
.hed-xl {
font-family: 'Oswald', sans-serif;
font-weight: 700;
font-size: 30px;
line-height: 0.98;
text-transform: none;
margin-bottom: 8px;
}
.hed-lg {
font-family: 'Oswald', sans-serif;
font-weight: 700;
font-size: 23px;
line-height: 1.0;
margin-bottom: 6px;
}
.hed-md {
font-family: 'Oswald', sans-serif;
font-weight: 600;
font-size: 19px;
line-height: 1.02;
margin: 4px 0 6px;
}
.kicker {
font-family: 'Old Standard TT', serif;
font-weight: 700;
font-size: 13px;
text-align: center;
margin: 6px 0;
}
.byline {
font-family: 'Old Standard TT', serif;
font-style: italic;
font-size: 11px;
text-align: center;
color: var(--faded);
margin-bottom: 8px;
}
.center { text-align: center; }
/* photo */
.photo {
width: 100%;
display: block;
filter: grayscale(1) contrast(1.05) sepia(0.12);
border: 1px solid var(--ink);
}
.caption {
font-size: 10.5px;
line-height: 1.3;
text-align: justify;
color: var(--faded);
margin-top: 5px;
}
/* boxed feature inside a column */
.boxed {
border: 1px solid var(--ink);
padding: 8px 10px;
margin: 10px 0;
text-align: center;
}
.boxed .hed-lg { font-size: 26px; }
/* lower banner heds */
.col .hed-section {
font-family: 'Oswald', sans-serif;
font-weight: 700;
font-size: 26px;
line-height: 0.95;
margin: 8px 0 6px;
}
.weather {
font-family: 'Old Standard TT', serif;
text-align: center;
margin-top: 8px;
}
.weather .label {
font-family: 'Oswald', sans-serif;
font-weight: 600;
font-size: 15px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.weather p { text-align: center; font-style: italic; }
.jump {
font-style: italic;
font-size: 11px;
text-align: right;
color: var(--faded);
}
.spacer-rule { margin: 8px 0; }
/* ---------- responsive ---------- */
@media (max-width: 760px) {
.newspaper { padding: 20px 16px 30px; }
.columns { grid-template-columns: 1fr; }
.col + .col { border-left: none; border-top: 1px solid var(--ink); }
.nameplate { letter-spacing: 1px; }
.ears { font-size: 9px; }
}
@media (max-width: 480px) {
.masthead { gap: 4px; }
.emblem { width: 54px; }
}
</style>
</head>
<body>
<div class="newspaper">
<!-- top ears -->
<div class="ears">
<div class="left">
Associated Acorns<br>
Nutwire Service<br>
Bushy-Tail Syndicate
</div>
<div class="right">
Classified Nuts<br>
Bring Results
</div>
</div>
<hr class="thin">
<!-- masthead -->
<div class="masthead">
<div class="nameplate left">DAILY</div>
<svg class="emblem" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" aria-label="Globe with squirrel">
<circle cx="50" cy="50" r="46" fill="none" stroke="#1a1a1a" stroke-width="2"/>
<ellipse cx="50" cy="50" rx="22" ry="46" fill="none" stroke="#1a1a1a" stroke-width="1.2"/>
<line x1="4" y1="50" x2="96" y2="50" stroke="#1a1a1a" stroke-width="1.2"/>
<path d="M4 32 Q50 20 96 32" fill="none" stroke="#1a1a1a" stroke-width="1"/>
<path d="M4 68 Q50 80 96 68" fill="none" stroke="#1a1a1a" stroke-width="1"/>
<!-- little squirrel silhouette -->
<path d="M50 38 q-7 0 -9 7 q-1 4 1 8 q-6 2 -7 9 q5 1 9 -2 q1 4 5 5 q6 1 9 -3 q4 1 7 -2 q-2 -4 -6 -4 q3 -5 1 -10 q4 -2 3 -7 q-4 1 -5 4 q-2 -6 -8 -5 z" fill="#1a1a1a"/>
</svg>
<div class="nameplate right">SQUIRREL</div>
</div>
<hr class="rule">
<!-- dateline -->
<div class="dateline">
<span class="vol">Volume VII, Number 142</span>
<span class="place">Opelousas, Louisiana, Thursday, October 9, 2025</span>
<span class="price">Price 3 Acorns</span>
</div>
<hr class="rule">
<!-- main banner headline -->
<div class="banner">ACORN HOARD AT RECORD<br>HIGH AS WINTER LOOMS</div>
<hr class="thin spacer-rule">
<!-- body columns -->
<div class="columns">
<!-- LEFT COLUMN -->
<div class="col">
<div class="hed-lg center">Beloved Oak-Voiced Hazel Bushtail Retires</div>
<hr class="hair" style="margin:4px 0 8px;">
<img class="photo" src="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='240'%3E%3Crect width='320' height='240' fill='%23bdb39a'/%3E%3Crect x='0' y='0' width='320' height='240' fill='none' stroke='%23000' stroke-width='1'/%3E%3Cellipse cx='160' cy='130' rx='70' ry='80' fill='%23968a6e'/%3E%3Ccircle cx='160' cy='80' r='34' fill='%23a89b7c'/%3E%3Cpath d='M120 70 q-14 -34 4 -44 q10 16 8 34z' fill='%23877b60'/%3E%3Cpath d='M200 70 q14 -34 -4 -44 q-10 16 -8 34z' fill='%23877b60'/%3E%3Cpath d='M210 150 q60 -10 70 -90 q14 60 -34 110z' fill='%23877b60'/%3E%3Ccircle cx='150' cy='78' r='4' fill='%23222'/%3E%3Ccircle cx='172' cy='78' r='4' fill='%23222'/%3E%3Cpath d='M156 90 q5 5 10 0' fill='none' stroke='%23222' stroke-width='2'/%3E%3C/svg%3E" alt="Hazel Bushtail">
<p class="caption">The forest community paused this week to honor Hazel Bushtail, whose famous chattering calls guided three generations of saplings to safety. Above, she is shown beside the Grand Oak where she nested for nineteen seasons.</p>
<p class="lede">With her trademark flick of the tail, Hazel Bushtail announced her retirement to a crowd of well-wishers gathered beneath the old hickory. For nearly two decades she served as lookout for the eastern grove, sounding the alarm at the first sign of hawk or hound.</p>
<p>Neighbors recalled her tireless winters and the countless caches she helped recover when the snow buried every familiar landmark. "She never lost a single nut she meant to find," said one tearful admirer.</p>
<hr class="rule" style="margin:10px 0 8px;">
<div class="hed-md">'Tall Fences Will Not Keep Us From The Feeders' Mayor Tells Grove</div>
<p>OAK HOLLOW, Oct. 9 — In a rousing address delivered from the top rail of the garden gate, the mayor pledged that no barrier would stand between the colony and its rightful share of the sunflower seed.</p>
<p>The speech drew chittering approval from rooftops across the district, though several elders urged caution against the resident terrier.</p>
<hr class="rule" style="margin:10px 0 8px;">
<div class="hed-md">PRESIDENT OF THE BIRD FEEDER FLEES HIS POST</div>
<p>BACKYARD CITY, Oct. 9 — The cardinal long thought to rule the hanging feeder abandoned his perch at dawn, leaving the bounty unguarded for the first time in memory.</p>
</div>
<!-- CENTER COLUMN -->
<div class="col">
<div class="hed-xl">Bold Raiders Only 12 Feet From Pantry; Feast Near</div>
<hr class="hair" style="margin:6px 0 8px;">
<div class="hed-lg">Elder Nutkin Counsels 29 Young Foragers</div>
<p class="kicker">Large, Well-Whiskered Group<br>Sets Out For The Pecan Grove</p>
<hr class="hair" style="margin:6px 0 8px;">
<p>With the venerable Elder Nutkin presiding, twenty-nine young foragers received their parting counsel this morning before departing for the pecan grove at the far edge of the meadow.</p>
<p>The elder delivered a warm, sincere send-off, reminding each that "a nut buried in haste is a nut lost to spring." The youngsters, well-known throughout the hollow, listened with twitching ears.</p>
<p>"If you know what a hard winter is," Elder Nutkin instructed, "you do not expect sympathy — you bury, and you remember." He closed with his best wishes and a flick of the tail.</p>
<div class="boxed">
<div class="hed-lg">CACHE COUNT<br>TOMORROW</div>
</div>
<p>After days of probing into the colony's winter reserves, the granary committee will release its long-awaited cache count tomorrow morning at first light.</p>
<p>Various forager figures, including all members of the spring litter, have been summoned to the council stump to verify the tally before the frost settles over the grove.</p>
<p>Today, committee members made an inspecting tour of all parish hollows and storage knots.</p>
<hr class="rule" style="margin:10px 0 8px;">
<div class="weather">
<div class="label">The Weather</div>
<hr class="hair" style="margin:5px 0;">
<p>Partly cloudy tonight. Friday considerably crisper, scattered acorn-fall likely. High temperature near 62°.</p>
</div>
</div>
<!-- RIGHT COLUMN -->
<div class="col">
<div class="hed-xl">Squirrel Stakes Everything On The Dash</div>
<p class="kicker">Colony Claims Million Sunflower Seeds Secured By<br>Fast-Moving Tail Brigade as Cat Warns Of Fence</p>
<p class="byline">(By Nutwire Service)</p>
<hr class="hair" style="margin:4px 0 8px;">
<p class="lede">The grove's boldest and greatest offensive against the well-stocked pantry reached flood tide today. A stream of proclamations and announcements from the council stump claimed that foraging forces had smashed to within twelve feet of the pantry door.</p>
<p>The whole backyard front has been broken, scouts reported, with sixty to seventy bird feeders — possibly a thousand seeds each — emptied and the squirrel position considered all but unassailable.</p>
<div class="hed-section">RECORD HOARD</div>
<hr class="hair" style="margin:0 0 8px;">
<p>Down in the hollow, there was no denying the festive mood that has settled north of the old oak, at least for the moment. The brigade swept the lower garden, leaving behind the scattered and scratched-over patches of the once-tidy flower bed.</p>
<p>The council painted a picture of foragers advancing swiftly toward the porch under clear skies and along dry roads, leaving behind the bewildered and largely indifferent house cat.</p>
<p>It was revealed that the lead forager made a statement at the crack of dawn, declaring the offensive everything she had — risking everything in a desperate dash for the suet cake before nightfall.</p>
<p>Resident birds, for their part, criticized the willful acrobatic actions of the brigade, warning it was unlikely to spread to colder weather without consequence.</p>
<p class="jump">(Continued on Page 18-B)</p>
</div>
</div>
<hr class="rule" style="margin-top:14px;">
</div>
</body>
</html>