:root{--black:#050505;--panel:#0d0b09;--panel-soft:#15110d;--gold:#b8894f;--gold-light:#d8c09a;--bone:#d8cbb4;--muted:#9b8a72;--red:#8e1b12;--border:rgba(184,137,79,.35);--shadow:0 25px 70px rgba(0,0,0,.65)}
*{box-sizing:border-box;margin:0;padding:0} 
body{background:radial-gradient(circle at top,#21150e 0%,#080706 38%,#030303 100%);color:var(--bone);font-family:Georgia,'Times New Roman',serif;line-height:1.6} 
img{max-width:100%;display:block} 
a{text-decoration:none;color:inherit} 
h1,h2,h3,h4{text-transform:uppercase;letter-spacing:.08em;line-height:1.08} 
h1{font-size:clamp(3rem,8vw,7rem);text-shadow:0 8px 30px #000} 
h2{font-size:clamp(1.7rem,4vw,3rem);color:var(--gold-light);margin-bottom:14px} 
p{margin-bottom:14px}
.eyebrow{color:var(--gold);letter-spacing:.25em;text-transform:uppercase;font-size:.78rem;font-weight:800}.
hero{min-height:72vh;display:grid;place-items:center;text-align:center;padding:80px 6vw;background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.50),rgba(0,0,0,.9)),radial-gradient(circle at center,#4a2716,#050505 68%);border-bottom:1px solid var(--border)}.home-hero{min-height:88vh}.story-hero{background:linear-gradient(90deg,rgba(0,0,0,.9),rgba(0,0,0,.45),rgba(0,0,0,.9)),radial-gradient(circle at center,#341616,#050505 70%)}.gallery-hero,.merch-hero{background:linear-gradient(90deg,rgba(0,0,0,.9),rgba(0,0,0,.45),rgba(0,0,0,.9)),radial-gradient(circle at center,#3a2b18,#050505 70%)}.hero-inner{max-width:850px}.hero-logo{width:150px;min-height:150px;margin:0 auto 20px;border:1px solid var(--border);border-radius:50%;object-fit:cover;background:#050505;box-shadow:0 20px 45px rgba(0,0,0,.55)}.hero p{font-size:1.2rem;color:#c9b99d}.hero-quote{display:inline-block;margin-top:16px;padding:14px 18px;border-left:3px solid var(--gold);background:rgba(184,137,79,.09);font-style:italic;color:#e2d2b6}.site-nav{position:sticky;top:0;z-index:1000;display:flex;justify-content:center;gap:8px;flex-wrap:wrap;background:rgba(5,5,5,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}.site-nav a{padding:15px 18px;text-transform:uppercase;letter-spacing:2px;color:var(--gold-light);font-size:.85rem}.site-nav a:hover,.site-nav a.active{background:var(--gold);color:#080706}.container{width:min(1250px,94vw);margin:auto;padding:52px 0}.card,.story-box{background:linear-gradient(145deg,rgba(16,13,10,.96),rgba(6,6,6,.96));border:1px solid var(--border);box-shadow:var(--shadow);padding:26px;margin-bottom:24px}.section-grid,.story-grid,.merch-grid,.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}.story-box h3,.story-card h3{color:var(--gold-light);margin-bottom:8px}.button-row{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin-top:24px}.btn,button,input[type=submit]{display:inline-block;padding:12px 17px;border:1px solid var(--gold);background:linear-gradient(135deg,#b8894f,#6e3c1d);color:#090807;font-weight:800;text-transform:uppercase;letter-spacing:.12em;border-radius:4px;cursor:pointer}.btn.secondary,button.secondary{background:transparent;color:var(--gold-light)}.split-card{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:center}.feature-img{border:1px solid var(--border);background:#050505;min-height:280px;object-fit:cover}.dark-section{background:#050505;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-top:28px}.dark-title{text-align:center}.story-card,.merch-card,.gallery-item{background:var(--panel);border:1px solid var(--border);overflow:hidden;box-shadow:0 14px 35px rgba(0,0,0,.35);transition:.25s ease}.story-card:hover,.merch-card:hover,.gallery-item:hover{transform:translateY(-5px);border-color:var(--gold)}.story-card img,.merch-card img,.gallery-item img{width:100%;height:240px;object-fit:cover;background:#060606}.story-content,.merch-card-content,.desc{padding:18px}.compact-grid{margin-top:18px}.timeline{display:grid;gap:14px}.timeline-item{border-left:2px solid var(--gold);padding:12px 0 12px 18px;background:rgba(255,255,255,.025)}.storyboard-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}.tab-btn{background:#090807;color:var(--gold-light)}.tab-btn.active{background:var(--gold);color:#090807}.storyboard-section{display:none}.storyboard-section.active{display:block}.tags{display:flex;gap:8px;flex-wrap:wrap}.tag,.merch-badge{display:inline-block;border:1px solid var(--border);color:var(--gold-light);padding:5px 8px;font-size:.75rem;text-transform:uppercase}.merch-image-wrap{position:relative}.merch-badge{position:absolute;top:12px;left:12px;background:#050505}.merch-title-row{display:flex;justify-content:space-between;gap:12px;align-items:center}.cart-box,.chat-box,#commentBox{border:1px solid var(--border);padding:16px;background:#050505;min-height:70px;margin:14px 0}.chat-input,.comment-form{display:flex;gap:10px}.chat-input textarea,.comment-form input{flex:1} label{display:block;color:var(--gold-light);margin-top:12px;margin-bottom:5px} input,textarea{width:100%;background:#070707;color:var(--bone);border:1px solid var(--border);padding:12px;font-family:inherit}textarea{min-height:150px}.notice{color:var(--muted);font-style:italic}.upload-box{border:1px dashed var(--border);padding:18px;margin:18px 0;background:rgba(184,137,79,.06)}.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:2000;display:none;align-items:center;justify-content:center;padding:30px}.lightbox.show{display:flex}.lightbox img{max-height:88vh;width:auto;max-width:96vw;border:1px solid var(--gold)}.close-lightbox{position:absolute;top:20px;right:25px;font-size:2rem;color:var(--gold-light);background:transparent}.site-footer{padding:45px 20px;text-align:center;border-top:1px solid var(--border);color:var(--muted);background:#030303}@media(max-width:850px){.split-card{grid-template-columns:1fr}.site-nav a{padding:12px}.chat-input,.comment-form{flex-direction:column}.hero{min-height:64vh}}
/* =========================================
   COMMUNITY HUB
========================================= */

.community-hub{
  display:grid;
  gap:28px;
  margin-top:32px;
}

.community-card{
  position:relative;
  overflow:hidden;
}

/* =========================================
   DONATION SECTION
========================================= */

.donation-card{
  text-align:center;
  position:relative;
  overflow:hidden;
}

.donation-card::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at top,
    rgba(184,137,79,.12),
    transparent 65%);
  pointer-events:none;
}

.donation-header{
  margin-bottom:18px;
}

.cashapp-container{
  display:flex;
  justify-content:center;
  margin-top:28px;
}

.cashapp-panel{
  width:min(500px,100%);
  padding:32px;
  border:1px solid var(--border);
  background:
    linear-gradient(
      145deg,
      rgba(22,18,14,.95),
      rgba(6,6,6,.96)
    );
  box-shadow:
    0 20px 50px rgba(0,0,0,.45);
  border-radius:12px;
}

.cashapp-title{
  color:var(--gold-light);
  text-transform:uppercase;
  letter-spacing:.2em;
  font-size:.8rem;
  margin-bottom:12px;
}

.cashapp-tag{
  display:inline-block;
  font-size:clamp(1.8rem,5vw,3rem);
  font-weight:800;
  color:#00d66b;
  margin-bottom:18px;
  transition:.25s ease;
}

.cashapp-tag:hover{
  transform:scale(1.05);
  text-shadow:
    0 0 12px rgba(0,214,107,.45),
    0 0 24px rgba(0,214,107,.25);
}

.donation-note{
  color:var(--muted);
  font-style:italic;
  margin-top:10px;
}

/* =========================================
   COMMENT SECTION
========================================= */

.comment-form{
  margin-top:14px;
}

#commentBox{
  min-height:100px;
}

/* =========================================
   COMMUNITY VISUAL SPACING
========================================= */

.chat-box,
#commentBox{
  border-radius:8px;
}

textarea,
input{
  border-radius:6px;
}

button:hover,
.btn:hover{
  filter:brightness(1.1);
}
/* =========================================================
   CLEANUP ADD-ON CSS
   Add this to the bottom of css/stylesheet.css
   ========================================================= */

/* Screen-reader-only labels: keeps forms accessible without visible clutter. */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Keeps the community/chat/comment/donation area organized. */
.community-hub {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.25rem;
  margin-top: 1.5rem;
}

.community-card,
.donation-card,
.upload-card {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.chat-box,
#commentBox {
  min-height: 140px;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(0, 0, 0, 0.25);
}

.chat-input,
.comment-form {
  display: grid;
  gap: 0.75rem;
}

.chat-input textarea,
.comment-form input {
  width: 100%;
  padding: 0.85rem 1rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;
  background: rgba(0, 0, 0, 0.35);
  color: inherit;
}

.chat-input button,
.comment-form button {
  cursor: pointer;
}

/* Donation card styling. */
.donation-card {
  border-color: rgba(0, 255, 120, 0.25);
}

.cashapp-container {
  display: flex;
  justify-content: center;
}

.cashapp-panel {
  width: min(100%, 420px);
  padding: 1.25rem;
  text-align: center;
  border: 1px solid rgba(0, 255, 120, 0.25);
  border-radius: 18px;
  background: rgba(0, 0, 0, 0.32);
}

.cashapp-title {
  margin: 0 0 0.5rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.cashapp-tag {
  display: inline-block;
  margin: 0.35rem 0;
  padding: 0.75rem 1.1rem;
  border-radius: 999px;
  font-size: 1.15rem;
  font-weight: 800;
  text-decoration: none;
}

.donation-note {
  margin-bottom: 0;
  opacity: 0.85;
}

/* Gallery grouping: fixes repeated duplicate #gallery problem by using classes. */
.gallery-archive {
  display: grid;
  gap: 2rem;
}

.gallery-group {
  display: grid;
  gap: 1rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.gallery-group-header h2,
.gallery-group-header p {
  margin: 0;
}

.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem;
}

.gallery-item {
  margin: 0;
  overflow: hidden;
  border-radius: 16px;
  background: rgba(0, 0, 0, 0.25);
}

.gallery-item img {
  display: block;
  width: 100%;
  height: 180px;
  object-fit: cover;
}

.gallery-item .desc {
  padding: 0.75rem;
  font-weight: 700;
  text-align: center;
}

.upload-box {
  display: grid;
  gap: 0.75rem;
}