/* Community landing views only. The hero shares the anime page's full bleed. */
body:not(.landing-route) .main-content:has(.community-hero-shell) { padding-top:0; }
.community-page:has(.community-hero-shell) { max-width:none; width:100%; margin:0; padding:0 0 64px; }
.community-hero-shell { --hero-blue:#a6d4fb; position:relative; }
.community-hero { display:grid; position:relative; isolation:isolate; min-height:clamp(560px,68svh,780px); overflow:hidden; border:0; border-radius:0; background:#10141b; touch-action:pan-y; }
.community-hero-slide { display:flex; align-items:flex-end; position:relative; grid-area:1/1; visibility:hidden; opacity:0; pointer-events:none; transition:opacity .4s ease,visibility .4s; }
.community-hero-slide.is-active { visibility:visible; opacity:1; pointer-events:auto; }
.community-hero-art { position:absolute; inset:0; z-index:-1; overflow:hidden; background:#10141b; }
.community-hero-art img { display:block; width:100%; height:100%; object-fit:cover; object-position:65% 40%; }
.community-hero-slide[data-kind=art] .community-hero-art img { object-position:65% 48%; }
.community-hero-slide[data-kind=discuss] .community-hero-art img { object-position:75% 45%; }
.community-hero-slide[data-kind=posts] .community-hero-art img { object-position:35% 45%; }
.community-hero-slide[data-kind=music] .community-hero-art img { object-position:50% 45%; }
.community-hero-art::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#0009 0%,#0005 34%,#0000 72%),linear-gradient(0deg,#000 0%,#000b 15%,#0000 58%),linear-gradient(180deg,#0005,transparent 26%); }
.community-hero-copy { width:min(100%,1800px); margin-inline:auto; padding:160px clamp(16px,3vw,48px) 108px; }
.community-hero-kicker { display:block; color:#b5d6f4; font-size:10px; font-weight:600; letter-spacing:.17em; line-height:1.6; }
.community-hero-copy h2 { max-width:780px; margin:16px 0 14px; color:#f6f8fc; font-size:clamp(38px,5vw,72px); font-weight:700; line-height:1.12; letter-spacing:-.05em; }
.community-hero-copy p { margin:0; color:#c5d2df; font-size:14px; line-height:1.7; }
.community-hero svg { width:18px; height:18px; flex:0 0 18px; }
.community-hero-controls { position:absolute; right:max(clamp(16px,3vw,48px),calc((100% - 1704px)/2)); bottom:22px; display:flex; align-items:center; gap:4px; z-index:2; }
.community-hero-count { padding:0 8px; color:#e4f1ff; font-size:11px; font-variant-numeric:tabular-nums; }
.community-hero-count>span { margin-left:4px; color:#8ca2b7; font-size:10px; }
.community-hero-controls button { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:50%; background:transparent; color:#c9dced; cursor:pointer; transition:background .18s; }
.community-hero-controls button:hover { background:#ffffff12; }
.community-hero-controls button:disabled { opacity:.4; cursor:default; }
.community-hero-playback span { display:flex; }
.community-hero-playback .community-hero-play { display:none; }
.community-hero[data-playing=false] .community-hero-pause { display:none; }
.community-hero[data-playing=false] .community-hero-play { display:flex; }
.community-portals { position:absolute; left:max(clamp(16px,3vw,48px),calc((100% - 1704px)/2)); bottom:22px; display:flex; align-items:center; gap:24px; }
.community-portals a { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:8px 2px; border:0; border-bottom:2px solid transparent; border-radius:0; color:#9daebe; font-size:13px; font-weight:500; text-decoration:none; transition:color .18s,border-color .18s; }
.community-portals a:hover { color:#edf5fe; }
.community-portals a[aria-current=page] { color:#e6f3ff; border-color:var(--hero-blue); }
.community-hero-shell :is(a,button):focus-visible { outline:2px solid #a6d4fb; outline-offset:2px; }
.community-content-body { max-width:1800px; margin-inline:auto; padding:24px clamp(16px,3vw,48px) 0; scroll-margin-top:100px; }
.community-content-body :is(.art-filters,.discuss-filters,.news-filters) { display:flex; align-items:center; gap:10px; margin-bottom:14px; }
.community-content-body :is(.art-search,.discuss-search,.news-search) { flex:1; min-width:0; height:44px; min-height:44px; padding:0 2px 0 12px; border-color:#ffffff14; border-radius:8px; background:#ffffff04; }
.community-content-body :is(.art-search,.discuss-search,.news-search) input { min-height:0; font-size:14px; }
.community-content-body :is(.art-search,.discuss-search,.news-search) button { display:grid; place-items:center; flex:0 0 44px; width:44px; min-height:44px; height:44px; padding:0; background:transparent; border:0; border-radius:7px; color:#9ebdd8; }
.community-content-body :is(.art-search,.discuss-search,.news-search) button:hover { background:#ffffff09; }
.community-filters { position:relative; flex:0 0 auto; color:#b7c8d8; font-size:13px; }
.community-filters summary { display:flex; align-items:center; justify-content:center; gap:8px; min-width:70px; min-height:44px; padding:8px 12px; border:1px solid #ffffff14; border-radius:8px; cursor:pointer; list-style:none; }
.community-filters summary::-webkit-details-marker { display:none; }
.community-filters summary svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; }
.community-filters[open] summary { background:#122033; border-color:#506980; }
.community-filter-popover { display:grid; gap:16px; position:absolute; z-index:20; top:calc(100% + 8px); right:0; width:248px; max-width:calc(100vw - 32px); padding:18px; border:1px solid #304154; border-radius:12px; background:#0c141f; box-shadow:0 12px 40px #0008; }
.community-filter-popover label { display:grid; gap:7px; font-size:12px; color:#9eb4c8; }
.community-filter-popover select { width:100%; min-width:0; min-height:44px; padding:8px 10px; border:1px solid #2c3c4c; border-radius:7px; background:#111d2b; color:#d9e5f1; color-scheme:dark; font:inherit; font-size:13px; }
.community-filter-popover :is(.art-refresh,.discuss-refresh) { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:44px; border:1px solid #2c3c4c; background:#111d2b; color:#b5d5ee; font:inherit; font-size:12px; }
.community-content-body :is(.art-toolbar,.discuss-toolbar,.community-toolbar) { border:0; padding:0; margin:0 0 18px; font-size:11px; color:#7c93a8; }
.community-content-body :is(.art-toolbar,.discuss-toolbar) a { color:#86a9c7; }
.community-content-body .community-toolbar { justify-content:flex-end; }
#community-feed-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.community-content-body .community-write { flex:0 0 44px; width:44px; height:44px; padding:0; border:1px solid #ffffff14; border-radius:8px; background:#ffffff04; color:#b7d4ed; cursor:pointer; font-size:22px; }
.community-content-body :is(summary,button,select,a):focus-visible { outline:2px solid #a6d4fb; outline-offset:3px; }
@media(max-width:700px) {
    .community-hero { min-height:clamp(480px,66svh,640px); }
    .community-hero-copy { padding-top:130px; padding-bottom:144px; }
    .community-hero-copy h2 { font-size:clamp(38px,8vw,50px); }
    .community-hero-art img { object-position:65% 40%; }
    .community-hero-slide[data-kind=art] .community-hero-art img { object-position:66% 45%; }
    .community-hero-art::after { background:linear-gradient(0deg,#000 0%,#000a 24%,#0000 70%),linear-gradient(90deg,#0005,transparent 80%),linear-gradient(180deg,#0005,transparent 28%); }
    .community-hero-controls { bottom:66px; right:12px; }
    .community-portals { left:16px; right:16px; bottom:14px; gap:clamp(12px,4vw,24px); }
    .community-portals a { font-size:12px; }
    .community-content-body { padding-top:18px; }
    .community-content-body :is(.art-search,.discuss-search,.news-search) input { font-size:16px; }
    .community-filters summary { min-width:58px; padding-inline:10px; }
    .community-filters summary svg { display:none; }
}
@media(prefers-reduced-motion:reduce) {
    .community-hero-shell * { transition:none!important; animation:none!important; }
}