/* ==========================================================================
   BAYAN COMMUNITY V4
   Visual patch:
   - calmer palette
   - navy / gold support
   - standalone Three.js boat host
   ========================================================================== */

:root {
  --bc-green-900: #143a38;
  --bc-green-800: #1d5450;
  --bc-green-700: #246a63;
  --bc-green-600: #2c8778;
  --bc-green-500: #38a189;
  --bc-soft-1: #f7f6f2;
  --bc-soft-2: #f1f1ec;
  --bc-soft-3: #e9ece8;
  --bc-line: rgba(23, 49, 72, .10);
  --bc-text: #203649;
  --bc-subtle: #6c7784;
}

#bayan-community-panel .bc-app-shell {
  background:
    radial-gradient(circle at 80% 8%, rgba(196,168,96,.10), transparent 22%),
    linear-gradient(180deg, rgba(247,246,242,.98) 0%, rgba(239,242,239,.98) 100%);
  color: var(--bc-text);
}

#bayan-community-panel .bc-app-header {
  border-bottom: 1px solid rgba(28,53,77,.10);
  background:
    linear-gradient(180deg, rgba(255,255,255,.76) 0%, rgba(255,255,255,.46) 100%);
}

#bayan-community-panel .bc-brand-top {
  color: #8a6a2c;
}

#bayan-community-panel .bc-brand-title,
#bayan-community-panel .bc-post-title,
#bayan-community-panel .bc-composer-title,
#bayan-community-panel .bc-profile-name {
  color: #203649;
}

#bayan-community-panel .bc-brand-sub,
#bayan-community-panel .bc-post-time,
#bayan-community-panel .bc-feed-toolbar-meta,
#bayan-community-panel .bc-policy-item p,
#bayan-community-panel .bc-rail-card p {
  color: #6d7883;
}

#bayan-community-panel .bc-card-shell,
#bayan-community-panel .bc-post {
  background: rgba(255,255,255,.92);
  border: 1px solid rgba(23,49,72,.08);
  box-shadow: 0 16px 40px rgba(20,32,50,.06);
}

#bayan-community-panel .bc-pill,
#bayan-community-panel .bc-meta-chip,
#bayan-community-panel .bc-chip-btn,
#bayan-community-panel .bc-action-btn,
#bayan-community-panel .bc-lang-toggle,
#bayan-community-panel .bc-policy-item,
#bayan-community-panel .bc-rail-card,
#bayan-community-panel .bc-nav-btn,
#bayan-community-panel .bc-rail-action {
  background: rgba(27,49,79,.05);
  color: #29465e;
}

#bayan-community-panel .bc-meta-chip.is-strong,
#bayan-community-panel .bc-chip-btn.is-active,
#bayan-community-panel .bc-nav-btn.is-active,
#bayan-community-panel .bc-rail-action.is-active,
#bayan-community-panel .bc-action-btn.is-active {
  background: linear-gradient(180deg, rgba(196,168,96,.20) 0%, rgba(56,161,137,.14) 100%);
  color: #24495f;
}

#bayan-community-panel .bc-btn-soft {
  background: rgba(23,49,72,.06);
  color: #26445d;
}

#bayan-community-panel .bc-btn-ghost {
  background: rgba(255,255,255,.84);
  color: #26445d;
  border: 1px solid rgba(23,49,72,.10);
}

#bayan-community-panel .bc-btn-primary,
#bayan-community-panel .bc-lang-btn.is-active {
  background: linear-gradient(180deg, #2d8f7b 0%, #23695d 100%);
  color: #f8fffc;
  box-shadow: 0 10px 24px rgba(35,105,93,.16);
}

#bayan-community-panel .bc-field-label,
#bayan-community-panel .bc-side-title,
#bayan-community-panel .bc-section-nav-title,
#bayan-community-panel .bc-feed-title,
#bayan-community-panel .bc-profile-role {
  color: #7f6427;
}

#bayan-community-panel .bc-input,
#bayan-community-panel .bc-textarea,
#bayan-community-panel .bc-header-search input,
#bayan-community-panel .bc-comment-form input {
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(23,49,72,.10);
  color: #203649;
}

#bayan-community-panel .bc-post-media,
#bayan-community-panel .bc-image-box {
  border: 1px solid rgba(23,49,72,.08);
  background: rgba(233,238,236,.60);
}

#bayan-community-panel .bc-avatar {
  background: linear-gradient(180deg, #efe6cf 0%, #dfe8dd 100%);
  color: #27465a;
}

#bayan-community-panel .bc-comment,
#bayan-community-panel .bc-policy-item,
#bayan-community-panel .bc-rail-card,
#bayan-community-panel .bc-rail-action {
  border: 1px solid rgba(23,49,72,.06);
}

#bayan-community-panel .bc-post-stats,
#bayan-community-panel .bc-comment p {
  color: #667481;
}

/* Three.js boat host */

.bc-using-3d-boat #bayan-community-boat {
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  overflow: hidden !important;
}

#bayan-community-boat-3d-host {
  position: absolute;
  left: calc(var(--bc-boat-left) - .4%);
  top: calc(var(--bc-boat-top) + .8%);
  width: min(15vw, 220px);
  height: min(11vw, 165px);
  transform: translate(-50%, -50%);
  border: 0;
  padding: 0;
  margin: 0;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
  z-index: 2;
  transition: transform .18s ease, filter .18s ease, opacity .18s ease;
}

#bayan-community-boat-3d-host:hover,
#bayan-community-boat-3d-host:focus-visible {
  transform: translate(-50%, -50%) scale(1.02);
  filter: drop-shadow(0 10px 24px rgba(17,42,58,.18));
}

#bayan-community-boat-3d-host:focus-visible {
  outline: 2px solid rgba(247, 238, 214, .96);
  outline-offset: 4px;
}

#bayan-community-boat-3d-host canvas {
  display: block;
  width: 100%;
  height: 100%;
}

#bayan-community-boat-3d-caption {
  position: absolute;
  inset: auto 0 -10px 0;
  text-align: center;
  font-family: var(--bc-font);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  color: rgba(240,248,244,.78);
  pointer-events: none;
  text-shadow: 0 2px 10px rgba(0,0,0,.20);
}

#bayan-community-boat-3d-host:hover + #bayan-community-dock,
#bayan-community-dock.is-open {
  opacity: .94;
  transform: translate(-50%, -50%) scale(1);
}

@media (max-width: 1100px) {
  #bayan-community-boat-3d-host {
    width: min(18vw, 190px);
    height: min(14vw, 145px);
  }
}

@media (max-width: 760px) {
  #bayan-community-boat-3d-host {
    width: min(22vw, 150px);
    height: min(18vw, 118px);
  }
}