.community { max-width: 820px; margin-inline: auto; }
.community-tabs { display:flex; flex-wrap:wrap; gap:.35rem; margin-bottom:1.5rem; }
.community-tabs button { flex:1; min-width:90px; padding:.45rem; }
.community-tabs button[aria-pressed=true] { border-color:var(--mint); color:var(--mint); }
.community form { display:grid; gap:.5rem; margin-block:1rem; }
.community label { color:var(--mint); }
.community input,.community select,.community textarea { width:100%; min-width:0; font:inherit; color:var(--ink); background:#0d1423; border:1px solid var(--edge); border-radius:0; padding:.65rem; }
.community-line { display:flex; gap:.5rem; }
.community-line input { flex:1; }
.community h3 { color:var(--gold); font-size:1.2rem; }
.friend-code { color:var(--gold); letter-spacing:.1em; overflow-wrap:anywhere; font-size:1.65rem; }
.friend-row,.setting-row { display:flex; align-items:center; justify-content:space-between; gap:1rem; border-bottom:1px solid var(--edge); padding:.8rem 0; }
.friend-row p,.setting-row p { margin:.2rem 0; }
.friend-row .actions { flex-shrink:0; }
.buddy-feature { display:grid; grid-template-columns:5rem 1fr; align-items:center; gap:.85rem; border:1px solid var(--edge); background:#0e1b30; padding:.8rem; }
.buddy-feature strong { font-size:1.35rem; }
.buddy-feature p { margin:.3rem 0 0; }
.buddy-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.65rem; }
@media (max-width: 540px) { .buddy-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.buddy-card { border:1px solid var(--edge); padding:.7rem .45rem; text-align:center; }
.buddy-card .creature { width:58px; margin:auto; }
.buddy-card h3 { margin:.4rem 0 .2rem; font-size:1.1rem; }
.buddy-card p { margin:.2rem 0 .45rem; color:var(--muted); font-size:.9rem; }
.buddy-card button { width:100%; min-height:44px; padding:.3rem .4rem; }
.buddy-card[data-equipped=true] { border-color:var(--mint); background:#14273c; }
.buddy-card[data-locked=true] .creature, .party-avatar:disabled .creature { filter:grayscale(1) brightness(.65); animation:none; }
[data-buddy=coral] { --buddy-atlas:url("/shrimp-swim.png"); }
[data-buddy=mint] { --buddy-atlas:url("/buddy-mint.png"); }
[data-buddy=violet] { --buddy-atlas:url("/buddy-violet.png"); }
[data-buddy=gold] { --buddy-atlas:url("/buddy-gold.png"); }
[data-buddy=pearl] { --buddy-atlas:url("/buddy-pearl.png"); }
.reduce-motion *, .reduce-motion *::before, .reduce-motion *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
.low-power .creature { animation-duration:2.666s !important; }
.low-power .diver-motion,.low-power .bubble,.low-power .arena::after { animation:none !important; }
.high-contrast { --muted:#e2ecf8; --edge:#90aecb; --ink:#fff; }
.high-contrast .panel { background:#090d17; }
.high-contrast [data-tier="0"] { --tier-light:#9aa8ba; }
.high-contrast [data-tier="10"] { --tier-light:#ffffff; }
.high-contrast [data-tier="15"] { --tier-light:#f0e442; }
.high-contrast [data-tier="30"] { --tier-light:#56b4e9; }
.high-contrast [data-tier="60"] { --tier-light:#009e73; }
.high-contrast [data-tier="85"] { --tier-light:#cc79a7; }
.high-contrast [data-tier="100"] { --tier-light:#e69f00; }
.high-contrast :is(.round-pip, .tile)[data-tier]:not([data-tier="pending"]) { background:var(--tier-light); }
.home-tools { display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; margin-top:1rem; }
.score-band { color:var(--gold); text-transform:uppercase; letter-spacing:.14em; }
@media(max-width:520px) { .friend-row { flex-wrap:wrap; } .friend-row .actions { width:100%; } .community-line { flex-wrap:wrap; } .community-line button { width:100%; } }

.friend-privacy, .friend-comparison { margin-block: .8rem; padding: .7rem; border: 1px solid var(--edge); }
.friend-privacy label { display: flex; gap: .5rem; align-items: center; }
.friend-privacy input[type=checkbox] { width: 1.1rem; height: 1.1rem; flex: 0 0 auto; accent-color: var(--mint); }
.friend-privacy p, .friend-comparison p { margin: .35rem 0; }
.friend-dive { flex-wrap: wrap; gap: .35rem; }
.friend-dive .actions { margin: .2rem 0; }
.friend-dive button { padding: .4rem .55rem; }
.friend-comparison table { width: 100%; border-collapse: collapse; text-align: left; }
.friend-comparison td, .friend-comparison th { padding: .38rem .32rem; border-bottom: 1px solid var(--edge); overflow-wrap: anywhere; }
