[hidden]{display:none!important}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{--forest:#1c2b1a;--moss:#3d5e38;--fern:#5a7d53;--parchment:#f0e8d5;--cream:#faf5ec;--sienna:#b85c2a;--gold:#c9963a;--gold-lt:#e8be6a;--ink:#2a1f14;--muted:#6f6454}
html{scroll-behavior:smooth}
body{background:var(--cream);color:var(--ink);font:300 1rem/1.6 'Lato',sans-serif;overflow-x:hidden;min-height:100vh}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
h1,h2,h3{font-family:'Playfair Display',serif;color:var(--forest)}

/* cursor (mouse devices only) */
#cur,.spark{display:none}
@media (hover:hover) and (pointer:fine){
  body,a,button{cursor:none}
  #cur{display:block;position:fixed;width:14px;height:14px;border:2px solid var(--gold);border-radius:50%;pointer-events:none;z-index:9999;transform:translate(-50%,-50%);transition:transform .15s,border-color .3s;mix-blend-mode:multiply}
  #cur.big{transform:translate(-50%,-50%) scale(2.8);border-color:var(--sienna);background:rgba(184,92,42,.08)}
  .spark{display:block;position:fixed;border-radius:50%;pointer-events:none;z-index:9998;transform:translate(-50%,-50%);background:var(--gold-lt)}
}

/* nav */
nav{position:fixed;inset:0 0 auto 0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1.5rem,5vw,4rem);height:68px;background:var(--forest);border-bottom:2px solid var(--gold)}
.nav-logo{font-family:'Playfair Display',serif;font-size:1.25rem;color:var(--parchment);letter-spacing:.04em;text-decoration:none;display:flex;gap:.5rem;align-items:center}
.nav-links{display:flex;gap:2rem;list-style:none;align-items:center}
.nav-links a,.mobile-menu a{font-size:.85rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--parchment);text-decoration:none;opacity:.8;padding-bottom:2px;border-bottom:1px solid transparent;transition:opacity .2s,border-color .2s}
.nav-links a:hover,.nav-links a.active,.mobile-menu a:hover{opacity:1;border-color:var(--gold)}
.nav-links a.discord-btn{display:flex;gap:.45rem;align-items:center;background:#5865F2;color:#fff;padding:.45rem 1rem;border-radius:6px;opacity:1;border:0}
.nav-links a.discord-btn:hover{background:#4752c4}
.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:0;padding:8px}
.hamburger span{display:block;width:24px;height:2px;background:var(--parchment)}
.mobile-menu{display:none;position:fixed;top:68px;inset-inline:0;background:var(--forest);border-bottom:2px solid var(--gold);padding:1.5rem clamp(1.5rem,5vw,4rem);flex-direction:column;gap:1.2rem;z-index:99}
.mobile-menu.open{display:flex}
@media (max-width:680px){.nav-links{display:none}.hamburger{display:flex}}

.notice{background:var(--gold-lt);color:var(--forest);text-align:center;padding:.6rem 1rem;font-weight:700;font-size:.9rem;margin-top:68px}
.notice[hidden]{display:none}
.page{display:none;padding-top:68px}.notice:not([hidden]) ~ .page{padding-top:0}
.page.active{display:block}

/* hero */
.hero{min-height:calc(100vh - 68px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:4rem clamp(1.5rem,5vw,4rem);position:relative;overflow:hidden;background:radial-gradient(ellipse 80% 60% at 50% 30%,rgba(61,94,56,.18),transparent 70%),var(--cream)}
.hero-bg{position:absolute;inset:0;pointer-events:none;opacity:.06;display:flex;align-items:center;justify-content:center}
.hero-bg svg{width:min(600px,90vw)}
.hero-eyebrow{font-size:.78rem;letter-spacing:.3em;text-transform:uppercase;color:var(--fern);font-weight:700}
.hero h1{font-size:clamp(3rem,8vw,6.5rem);font-weight:700;line-height:1.05;margin:.6rem 0 .5rem}
.hero h1 em{font-style:italic;color:var(--sienna)}
.hero-desc{font-size:clamp(.95rem,2.2vw,1.2rem);color:var(--muted);max-width:560px;line-height:1.7;margin:0 auto 2.5rem}
.hero-actions{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}
.hero>*:not(.hero-bg){animation:riseIn .9s ease both}.hero>.hero-desc{animation-delay:.2s}.hero>.hero-actions{animation-delay:.35s}
.btn-primary,.btn-outline,.btn{display:inline-block;padding:.75rem 1.8rem;border-radius:4px;font:700 .9rem 'Lato',sans-serif;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;transition:background .2s,transform .15s,color .2s,border-color .2s}
.btn-primary{background:var(--sienna);color:var(--cream);border:2px solid var(--sienna)}.btn-primary:hover{background:#9e4a20;transform:translateY(-2px)}
.btn-outline{color:var(--forest);border:2px solid var(--moss);background:none}.btn-outline:hover{border-color:var(--sienna);color:var(--sienna);transform:translateY(-2px)}
.vine-divider{text-align:center;font-size:1.4rem;color:var(--moss);opacity:.5;margin:1rem 0;letter-spacing:.5rem}

.feature-strip{background:var(--forest);color:var(--parchment);padding:3.5rem clamp(1.5rem,5vw,4rem);display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2.5rem;text-align:center}
.feature-item .icon{font-size:2rem;margin-bottom:.6rem}
.feature-item h3{font-size:1.1rem;font-weight:400;color:var(--gold-lt);margin-bottom:.4rem}
.feature-item p{font-size:.9rem;line-height:1.6;opacity:.75}

.wrap{max-width:1200px;margin:0 auto;padding:3rem clamp(1.5rem,5vw,4rem)}
.section-head{display:flex;align-items:baseline;gap:1.5rem;margin-bottom:2rem;flex-wrap:wrap}
.section-head h2,.wrap>h1{font-size:clamp(1.6rem,3vw,2.4rem)}
.section-head a{font-size:.82rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--sienna);text-decoration:none}
.section-head a:hover{text-decoration:underline}
.lede{color:var(--muted);margin:.4rem 0 1.4rem}

/* scanner status */
.status{display:flex;flex-wrap:wrap;gap:.5rem 1.2rem;align-items:center;font-size:.8rem;color:var(--muted);margin-bottom:1.5rem}
.status i{width:8px;height:8px;border-radius:50%;background:var(--fern);display:inline-block;margin-right:.4rem}
.status.off i{background:var(--gold)}
.status button{background:none;border:0;color:var(--sienna);font-weight:700;text-decoration:underline;font-size:.8rem}

/* tabs + chips */
.tab-bar{display:flex;border-bottom:2px solid var(--parchment);margin-bottom:2rem;overflow-x:auto}
.tab-btn{background:none;border:0;padding:.7rem 1.6rem;font:700 .85rem 'Lato',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-2px;white-space:nowrap}
.tab-btn:hover{color:var(--forest)}.tab-btn.active{color:var(--sienna);border-bottom-color:var(--sienna)}
.tab-panel{display:none}.tab-panel.active{display:block}
.chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.6rem}
.chip{background:var(--parchment);border:1px solid rgba(61,94,56,.25);color:var(--moss);font:700 .78rem 'Lato',sans-serif;padding:.4rem .95rem;border-radius:20px}
.chip:hover{border-color:var(--moss)}.chip[aria-pressed=true]{background:var(--moss);color:var(--cream);border-color:var(--moss)}

/* video cards (thumbnail first, player loads on click) */
.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:1.8rem}
.vid-card{background:#fff;border-radius:6px;overflow:hidden;box-shadow:0 2px 12px rgba(30,40,20,.08);transition:transform .2s,box-shadow .2s}
.vid-card:hover{transform:translateY(-4px);box-shadow:0 8px 28px rgba(30,40,20,.14)}
.embed-wrap{position:relative;aspect-ratio:16/9;background:var(--forest)}
.embed-wrap iframe,.embed-wrap button{position:absolute;inset:0;width:100%;height:100%;border:0}
.embed-wrap button{background:center/cover no-repeat;padding:0}
.embed-wrap button::after{content:'';position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px;border-radius:50%;background:rgba(28,43,26,.78) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23e8be6a' d='M9 6.5v11l9-5.5z'/%3E%3C/svg%3E") center/60% no-repeat;border:2px solid var(--gold);transition:transform .2s}
.embed-wrap button:hover::after{transform:scale(1.12)}
.vid-info{padding:1rem 1.1rem}
.vid-info h3{font-size:1rem;line-height:1.35;margin-bottom:.3rem}
.vid-info small{font-size:.78rem;color:var(--muted)}
.featured-hero{margin-bottom:2rem;border-radius:8px;overflow:hidden;box-shadow:0 4px 24px rgba(30,40,20,.12);background:#fff}
.featured-hero .vid-info h3{font-size:1.5rem}
.featured-label{display:inline-block;background:var(--sienna);color:#fff;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:.25rem .7rem;border-radius:3px;margin-bottom:1rem}
.more{display:block;margin:2rem auto 0}
.empty{background:var(--parchment);border:1px dashed var(--fern);border-radius:8px;padding:2rem;text-align:center;color:var(--moss);grid-column:1/-1}
.empty strong{display:block;font:700 1.1rem 'Playfair Display',serif;color:var(--forest);margin-bottom:.3rem}

/* about */
.about-wrap{max-width:820px;margin:0 auto;padding:4rem clamp(1.5rem,5vw,4rem)}
.about-wrap h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.1;margin-bottom:1.5rem}
.about-wrap h1 em{font-style:italic;color:var(--sienna)}
.about-intro{font:italic 400 1.15rem/1.8 'Playfair Display',serif;border-left:3px solid var(--gold);padding-left:1.5rem;margin-bottom:1.5rem}
.about-body p{line-height:1.85;margin-bottom:1.2rem}
.about-tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:2rem 0}
.tag{background:var(--parchment);border:1px solid rgba(61,94,56,.25);color:var(--moss);font-size:.78rem;font-weight:700;letter-spacing:.08em;padding:.35rem .85rem;border-radius:20px}
.about-cta{margin-top:2.5rem;padding:2rem;background:var(--forest);border-radius:8px;color:var(--parchment);text-align:center}
.about-cta h3{font-size:1.4rem;color:var(--gold-lt);margin-bottom:.6rem}
.about-cta p{opacity:.8;margin-bottom:1.2rem}

/* discord */
.discord-wrap{min-height:calc(100vh - 68px);display:flex;align-items:center;justify-content:center;padding:4rem clamp(1.5rem,5vw,4rem);text-align:center;background:radial-gradient(ellipse 70% 50% at 50% 40%,rgba(61,94,56,.12),transparent 70%)}
.discord-card{max-width:540px;width:100%}
.discord-icon{font-size:4rem;margin-bottom:1rem}
.discord-card h1{font-size:clamp(1.8rem,5vw,2.8rem);margin-bottom:1rem}
.discord-card>p{font-size:1.05rem;color:var(--muted);line-height:1.7;margin-bottom:2rem}
.discord-big-btn{display:inline-flex;align-items:center;gap:.7rem;background:#5865F2;color:#fff;padding:1rem 2.5rem;border-radius:6px;font-size:1.1rem;font-weight:700;text-decoration:none;transition:background .2s,transform .15s}
.discord-big-btn:hover{background:#4752c4;transform:translateY(-2px)}
.discord-features{margin-top:3rem;display:grid;grid-template-columns:1fr 1fr;gap:1rem;text-align:left}
.discord-feat{background:var(--parchment);border-radius:6px;padding:1rem 1.2rem;font-size:.9rem;line-height:1.5}
.discord-feat strong{display:block;color:var(--forest);margin-bottom:.2rem}
.house-rule{margin-top:1.2rem;font-size:.9rem;color:var(--moss);border:1px solid rgba(61,94,56,.3);border-radius:6px;padding:.8rem 1rem}
@media (max-width:520px){.discord-features{grid-template-columns:1fr}}

footer{background:var(--forest);color:var(--parchment);padding:2rem clamp(1.5rem,5vw,4rem);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;border-top:2px solid var(--gold)}
.foot-brand{font-family:'Playfair Display',serif;color:var(--gold-lt)}
.foot-links{display:flex;gap:1.5rem;list-style:none}
.foot-links a,.foot-links button{font:inherit;font-size:.82rem;color:var(--parchment);text-decoration:none;opacity:.7;background:none;border:0;padding:0}
.foot-links a:hover,.foot-links button:hover{opacity:1}
footer small{font-size:.75rem;opacity:.55;width:100%;text-align:center}

/* embedded admin */
#adminOverlay{position:fixed;inset:0;z-index:500;background:rgba(28,43,26,.82);display:none;padding:clamp(.5rem,3vw,2rem)}
#adminOverlay.open{display:block}
#adminOverlay iframe{width:100%;height:100%;border:2px solid var(--gold);border-radius:8px;background:var(--cream)}
#adminClose{position:absolute;top:.4rem;right:.9rem;z-index:2;background:var(--gold);color:var(--forest);border:0;border-radius:50%;width:34px;height:34px;font-size:1.2rem;font-weight:700}

@keyframes riseIn{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
