:root { --season-tint:#e9d9bd; }
.seasonal { margin:0; border-radius:18px; overflow:hidden; background:#183d32; box-shadow:0 18px 45px #183d3218; }
.seasonal-view { width:100%; aspect-ratio:3/2; background:#718574 url('/assets/seasonal-creek.jpg') no-repeat; background-size:200% 200%; background-position:0 100%; }
.seasonal[data-season="spring"] .seasonal-view { background-position:0 0; }
.seasonal[data-season="summer"] .seasonal-view { background-position:100% 0; }
.seasonal[data-season="winter"] .seasonal-view { background-position:100% 100%; }
.seasonal figcaption { padding:24px; color:#f6f3e9; border-top:3px solid var(--season-tint); }
.seasonal-caption { display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px; align-items:center; }
.seasonal .eyebrow { margin:0; color:#dce6d5; font-size:9px; }
.seasonal-status { font-size:11px; color:var(--season-tint); }
.seasonal figcaption>p { font-size:25px; letter-spacing:-.025em; line-height:1.25; margin:12px 0 18px; }
.seasonal-controls { display:flex; flex-wrap:wrap; gap:5px; }
.seasonal-controls[hidden] { display:none; }
.seasonal button { cursor:pointer; border:1px solid #ffffff40; border-radius:20px; padding:7px 11px; min-height:40px; font:12px 'Segoe UI',Arial,sans-serif; background:transparent; color:#f6f3e9; }
.seasonal button:hover { background:#ffffff18; }
.seasonal button[aria-pressed="true"] { background:var(--season-tint); border-color:var(--season-tint); color:#183d32; }
.seasonal button:focus-visible { outline:3px solid #f4d392; outline-offset:3px; }
.seasonal-workflow { margin:0 0 64px; padding:28px 32px; }
.seasonal-workflow ol { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:30px; margin:0; }
.seasonal-workflow .eyebrow { margin-bottom:12px; }
.seasonal-workflow li { padding-top:18px; gap:14px; }
.seasonal-workflow strong { font-size:18px; }
@media(max-width:640px) { .seasonal figcaption { padding:20px; } .seasonal-workflow { padding:24px; } .seasonal-workflow ol { grid-template-columns:1fr; gap:0; } }
@media print { .seasonal { display:none; } }

/* Decorative seasonal atmosphere; never intercepts links, selection or scrolling. */
.seasonal-atmosphere { position:fixed; inset:0; overflow:hidden; pointer-events:none; z-index:2; }
.seasonal-particle { position:absolute; top:0; left:0; width:20px; height:20px; opacity:.46; transform-origin:center; will-change:transform; }
.seasonal-particle::before { content:""; position:absolute; inset:0; background:var(--season-symbol) center/contain no-repeat; transform:scale(1); transition:transform 160ms ease-out, opacity 260ms ease-out, filter 260ms ease-out; }
.seasonal-particle::after { content:""; position:absolute; inset:-25%; border:1px solid transparent; border-radius:50%; pointer-events:none; }
body[data-season="autumn"] { --season-symbol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 48'%3E%3Cpath fill='%23bc6b28' d='M20 39C-2 30 5 11 34 2c-1 16 10 29-14 37Z'/%3E%3Cpath fill='none' stroke='%23794c29' stroke-width='1.5' d='M12 47 28 13M19 32 11 21M23 23l8-3'/%3E%3C/svg%3E"); }
body[data-season="spring"] { --paper:#f7f5ec; --soft:#e4ebd9; --season-symbol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 50 50'%3E%3Cg fill='%23fffaf4' stroke='%23c88d9b' stroke-width='1.2'%3E%3Cpath d='M25 25C7 16 12 1 22 3l3 3 3-3c10-2 15 13-3 22Z'/%3E%3Cpath d='M25 25C34 7 49 12 47 22l-3 3 3 3c2 10-13 15-22-3Z'/%3E%3Cpath d='M25 25c18 9 13 24 3 22l-3-3-3 3c-10 2-15-13 3-22Z'/%3E%3Cpath d='M25 25C16 43 1 38 3 28l3-3-3-3C1 12 16 7 25 25Z'/%3E%3C/g%3E%3Ccircle cx='25' cy='25' r='4' fill='%238ca24b'/%3E%3C/svg%3E"); }
body[data-season="spring"] .seasonal-particle { opacity:.65; }
body[data-season="summer"] { --paper:#f3f7e9; --soft:#deedcc; --fern:#39732b; --season-symbol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 60'%3E%3Cg fill='none' stroke='%23fffef8' stroke-width='1.3' stroke-linecap='round'%3E%3Cpath d='M24 29 5 17m19 12L8 10m16 19L15 5m9 24V3m0 26L33 5m-9 24L40 10M24 29l19-12M24 29 3 24m21 5 21-5'/%3E%3Cpath d='m3 14 2 3-4 1m5-11 2 3-4 1m8-8 3 2-3 2m9-6 3 2 3-2m3 2 3 2 3-1m2 3 2 3 3-1m-2 4 2 3 4-1M1 22l2 2-2 2m42-4 2 2 2 2'/%3E%3C/g%3E%3Cpath d='M24 29c-1 8 0 14 3 21' fill='none' stroke='%23958b6c' stroke-width='1.1'/%3E%3Cellipse cx='28' cy='53' rx='1.8' ry='4' transform='rotate(-18 28 53)' fill='%238d7955'/%3E%3C/svg%3E"); }
/* Dandelion parachutes float slowly, with a soft breeze and a small tilt. */
body[data-season="summer"] .seasonal-particle { opacity:.8; filter:drop-shadow(0 1px 1px #61754b66); }
@keyframes summer-drift { 0% { transform:translate3d(-25px,-45px,0) rotate(-18deg); } 35% { transform:translate3d(var(--drift),35vh,0) rotate(14deg); } 70% { transform:translate3d(30px,72vh,0) rotate(-10deg); } 100% { transform:translate3d(var(--drift),calc(100vh + 100px),0) rotate(20deg); } }
body[data-season="winter"] { --paper:#eff5f8; --soft:#e0ebf0; --line:#cedde5; --fern:#496d77; --season-symbol:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 2v28M4 9l24 14M4 23 28 9M12 5l4 4 4-4M12 27l4-4 4 4M5 13l6-1-1-6M22 26l-1-6 6-1M5 19l6 1-1 6M22 6l-1 6 6 1' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); }
body[data-season="winter"] .seasonal-particle { opacity:.85; filter:drop-shadow(0 1px 1px #708d9f55); }
body[data-season="winter"] .card, body[data-season="winter"] .band, body[data-season="winter"] .workflow, body[data-season="winter"] .seasonal { box-shadow:0 -5px 0 #fff, 0 10px 24px #506d7b12; }
body[data-season="winter"] footer { background:#e0eaf0; border-top:5px solid white; }
.seasonal .seasonal-motion { margin-top:14px; padding:4px 0; min-height:32px; border:0; border-radius:0; font-size:11px; color:#dce6d5; text-decoration:underline; text-underline-offset:3px; }
.seasonal .seasonal-motion[hidden] { display:none; }
.seasonal-motion-global { margin-left:18px; border:1px solid #183d3255; border-radius:18px; padding:5px 10px; background:transparent; color:inherit; cursor:pointer; font:inherit; }
.seasonal-motion-global:focus-visible { outline:3px solid #7ea26f; outline-offset:2px; }
.seasonal-atmosphere.is-paused .seasonal-particle { transition:none; }
.seasonal-particle.is-caught::before { transform:scale(2); }
.seasonal-particle.is-stacked::before { transform:scaleX(var(--pile-scale,1)); filter:drop-shadow(0 2px 2px #20352a44); }
.seasonal-particle.is-stacked { will-change:auto; }
.seasonal-particle.is-popping::before { transform:scale(2.8); opacity:0; filter:blur(2px); }
.seasonal-particle.is-popping::after { border-color:#fff9; animation:seasonal-pop 280ms ease-out forwards; }
@keyframes seasonal-pop { from { transform:scale(.35); opacity:1; } to { transform:scale(2.25); opacity:0; } }
@keyframes seasonal-fall { 0% { transform:translate3d(0,-30px,0) rotate(0deg); } 50% { transform:translate3d(var(--drift),52vh,0) rotate(100deg); } 100% { transform:translate3d(0,calc(100vh + 85px),0) rotate(210deg); } }
@media(prefers-reduced-motion:reduce) { .seasonal-particle, body[data-season="summer"] .seasonal-particle { animation:none; display:none; } .seasonal .seasonal-motion, .seasonal-motion-global { display:none; } }
@media print { .seasonal-atmosphere, .seasonal-motion { display:none; } }