/* Compact community links at the end of the landing page. */
:is(#community-links,#community-links-top){box-sizing:border-box;width:calc(100% - 40px);max-width:480px;margin:36px auto 28px;padding:24px 0 0;border:0;border-top:1px solid #b9aa8966;border-radius:0;background:transparent;color:#24483b;text-align:center}
:is(#community-links,#community-links-top) h2{margin:0 0 16px;padding:0;font:700 19px/1.3 "League Spartan",sans-serif;letter-spacing:0;text-transform:none}
:is(#community-links,#community-links-top) .community-join-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:auto}
:is(#community-links,#community-links-top) .community-join-button{box-sizing:border-box;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:9px;min-width:0;min-height:50px;padding:10px 12px;border:1px solid #24483b40;border-radius:8px;background:#fff8e940;color:#24483b;text-decoration:none;font:700 15px/1.2 "League Spartan",sans-serif;box-shadow:none;animation:none;transform:none;transition:background .2s}
:is(#community-links,#community-links-top) .community-join-telegram{color:#28566a;border-color:#28566a40}
:is(#community-links,#community-links-top) .community-brand-disc{display:flex;align-items:center;justify-content:center;position:static;flex:0 0 23px;width:23px;height:23px;border:0;border-radius:0;background:none;color:inherit;box-shadow:none;transform:none}
:is(#community-links,#community-links-top) .community-brand-disc:before,:is(#community-links,#community-links-top) .community-brand-disc:after{display:none}
:is(#community-links,#community-links-top) .community-brand-mark{display:block;width:23px;height:23px;transform:none;filter:none}
:is(#community-links,#community-links-top) .community-join-arrow{display:none}
:is(#community-links,#community-links-top) .community-join-button:hover{background:#fff8e9;filter:none}
:is(#community-links,#community-links-top) .community-join-button:focus-visible{outline:2px solid #8d2531;outline-offset:4px}

/* Keep the full mascot and signature in their own layout row. */
.hero .hero-copy{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;min-height:0!important;height:auto!important;padding:24px 18px!important;gap:22px!important;overflow:hidden!important}
.hero .hero-copy .hero-mascot{position:relative!important;inset:auto!important;order:0;flex:none!important;align-self:center!important;width:min(48%,190px)!important;max-width:190px!important;margin:0 auto!important;transform:none!important;z-index:2!important}
.hero .hero-copy .hero-mascot img{display:block!important;width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important}
.hero .hero-copy .hero-poster-event{position:relative!important;inset:auto!important;order:1;flex:none!important;align-self:stretch!important;width:100%!important;max-width:100%!important;margin:0!important;transform:none!important;z-index:3!important}
.hero .hero-copy .hero-border-sketch{position:absolute!important;top:25px!important;bottom:auto!important;left:0!important;width:100%!important;max-height:300px!important;object-fit:contain!important;z-index:0!important;opacity:.35!important}
#community-links-top{margin:24px auto!important}

/* Recognizable community colours with a subtle vintage relief. */
:is(#community-links,#community-links-top) .community-join-button{--community-color:#176b46;--community-shadow:#104b32;min-height:68px;padding:10px 12px;gap:10px;border:2px solid var(--community-shadow);border-radius:10px;background:var(--community-color);color:#fff9e9;box-shadow:0 4px 0 var(--community-shadow);font-size:16px;transition:transform .18s,box-shadow .18s,filter .18s}
:is(#community-links,#community-links-top) .community-join-telegram{--community-color:#1677a5;--community-shadow:#12516f}
:is(#community-links,#community-links-top) .community-brand-disc{flex:0 0 42px;width:42px;height:42px;border:1px solid #fff9e9;border-radius:50%;background:#fff9e9;color:var(--community-color);box-shadow:0 2px 0 #0003}
:is(#community-links,#community-links-top) .community-brand-mark{width:28px;height:28px}
:is(#community-links,#community-links-top) .community-join-button:hover{background:var(--community-color);filter:brightness(1.08);transform:translateY(-2px);box-shadow:0 6px 0 var(--community-shadow)}
:is(#community-links,#community-links-top) .community-join-button:active{transform:translateY(3px);box-shadow:0 1px 0 var(--community-shadow)}
@media(max-width:360px){:is(#community-links,#community-links-top) .community-join-button{gap:7px;padding:10px 7px;font-size:14px}:is(#community-links,#community-links-top) .community-brand-disc{flex-basis:36px;width:36px;height:36px}:is(#community-links,#community-links-top) .community-brand-mark{width:25px;height:25px}}
@media(prefers-reduced-motion:reduce){:is(#community-links,#community-links-top) .community-join-button{transition:none}}

/* The lower community links use simple icons with comfortable tap targets. */
#community-links .community-join-actions{display:flex;justify-content:center;gap:16px}
#community-links .community-join-button{position:relative;flex:0 0 48px;width:48px;height:48px;min-height:48px;gap:0;padding:8px;border:0;border-radius:4px;background:transparent;color:var(--community-color);box-shadow:none;animation:none;transform:none;transition:opacity .18s}
#community-links .community-brand-disc{flex:0 0 32px;width:32px;height:32px;border:0;border-radius:0;background:transparent;color:inherit;box-shadow:none}
#community-links .community-brand-mark{width:32px;height:32px}
#community-links .community-join-button>span[translate="no"]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
#community-links .community-join-button:hover,#community-links .community-join-button:active{background:transparent;filter:none;transform:none;box-shadow:none;opacity:.75}
@media(prefers-reduced-motion:reduce){#community-links .community-join-button{transition:none}}
