/* Member clubhouses, icon buttons and context menus. Themes only change decoration and accents; body text stays light on dark. */
.bb .theme-bude{--ch-bg:#1f1c35;--ch-panel:#26243d;--ch-accent:#f2d27e;--ch-accent2:#b5a1ff;--ch-line:#5a4d6e;--ch-hero:linear-gradient(120deg,#9d30443d,#6459ba33 55%,#72b6ff1f)}
.bb .theme-neon{--ch-bg:#140f26;--ch-panel:#1c1533;--ch-accent:#ff6fe0;--ch-accent2:#4ff3ff;--ch-line:#5b2f73;--ch-hero:linear-gradient(110deg,#ff4fd83a,#3a1d6b40 50%,#3ef2ff30)}
.bb .theme-lagerfeuer{--ch-bg:#22170f;--ch-panel:#2d1f15;--ch-accent:#ffbd5c;--ch-accent2:#ff7b4d;--ch-line:#6b4528;--ch-hero:radial-gradient(ellipse at 20% 120%,#ff7b4d55,transparent 60%),linear-gradient(160deg,#3a2414,#22170f)}
.bb .theme-pixel{--ch-bg:#0c140c;--ch-panel:#111d11;--ch-accent:#8dff8a;--ch-accent2:#ffd84d;--ch-line:#2f5a2f;--ch-hero:repeating-linear-gradient(0deg,#8dff8a0d 0 2px,transparent 2px 4px),linear-gradient(135deg,#143014,#0c140c)}
.bb .theme-weltall{--ch-bg:#0d1233;--ch-panel:#141b45;--ch-accent:#a6d8ff;--ch-accent2:#cdb1ff;--ch-line:#2f3d80;--ch-hero:radial-gradient(1px 1px at 12% 30%,#fff,transparent),radial-gradient(1px 1px at 38% 70%,#fff,transparent),radial-gradient(2px 2px at 64% 22%,#fffbe0,transparent),radial-gradient(1px 1px at 82% 58%,#fff,transparent),radial-gradient(1px 1px at 92% 12%,#fff,transparent),radial-gradient(ellipse at 80% 100%,#6a4bd655,transparent 60%),linear-gradient(160deg,#1a2160,#0d1233)}
.bb .theme-krone{--ch-bg:#28141a;--ch-panel:#341b22;--ch-accent:#f2d27e;--ch-accent2:#ff757e;--ch-line:#7a5a35;--ch-hero:linear-gradient(120deg,#f2d27e2e,#9d304455 60%,#28141a)}

/* Icon buttons: 44px targets with tooltip text in aria-label/title. */
.bb .icon-button{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:44px;height:44px;min-height:44px;margin:0;padding:0;border:1px solid #8e764a;border-radius:10px;background:#252239;color:var(--ink);font-size:20px;line-height:1;text-decoration:none;cursor:pointer;list-style:none;transition:border-color .15s,background .15s}
.bb .icon-button.small{font-size:15px}
.bb .icon-button:hover,.bb .icon-button:focus-visible,.bb details[open]>summary.icon-button{border-color:var(--gold);background:#f2d27e1f;color:var(--ink)}
.bb .member-surface details>summary.icon-button{margin:0;padding:0;min-height:44px;gap:0;color:var(--ink);font-size:20px}
.bb .member-surface details>summary.icon-button.small{font-size:15px}
.bb .member-surface details>summary.icon-button::after{content:none}
.bb .member-surface details[open]>summary.icon-button{margin:0}
.bb .icon-button b,.bb .icon-button i,.bb .icon-button u,.bb .icon-button s{font-family:Georgia,serif;font-size:17px}

.bb .context-menu{position:relative;display:inline-block}
.bb .context-items{position:absolute;z-index:12;right:0;top:calc(100% + 6px);display:grid;gap:2px;min-width:220px;padding:6px;border:1px solid #74608f;border-radius:12px;background:#222035;box-shadow:0 16px 50px #0009}
.bb .context-items form{margin:0}
.bb .context-item{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:8px 12px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:inherit;font-size:14px;text-align:left;text-decoration:none;cursor:pointer}
.bb .context-item>span{width:22px;text-align:center}
.bb .context-item:hover,.bb .context-item:focus-visible{background:#f2d27e1f;color:var(--ink)}
.bb .context-item.is-danger{color:#ffb8ba}
.bb .context-items hr{width:100%;margin:4px 0;border:0;border-top:1px solid #51483e}

/* Every username leads to its clubhouse. */
.bb a.member-link{color:inherit;font-weight:inherit;text-decoration:underline;text-decoration-color:#f2d27e66;text-underline-offset:3px;overflow-wrap:anywhere}
.bb a.member-link:hover,.bb a.member-link:focus-visible{color:var(--gold);text-decoration-color:var(--gold)}
.bb .player-card a.member-link,.bb .leaderboard a.member-link{text-decoration:none}

.bb .clubhouse{--ch-radius:16px;margin-top:8px;padding:16px;border:1px solid var(--ch-line);border-radius:20px;background:var(--ch-bg)}
.bb .theme-pixel.clubhouse,.bb .theme-pixel .ch-card,.bb .theme-pixel .ch-hero{--ch-radius:0;font-family:Consolas,"Courier New",monospace}
.bb .ch-hero{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;padding:20px;border:1px solid var(--ch-line);border-radius:var(--ch-radius);background:var(--ch-hero),var(--ch-panel)}
.bb .ch-identity{display:flex;flex-wrap:wrap;align-items:center;gap:18px;min-width:0;flex:1 1 320px}
.bb .ch-who{min-width:0;flex:1 1 200px}
.bb .ch-who .eyebrow{color:var(--ch-accent)}
.bb .ch-name{margin:2px 0 4px;font-size:clamp(28px,6vw,44px);line-height:1.1;letter-spacing:-1px;overflow-wrap:anywhere}
.bb .ch-headline{margin:0 0 6px;font-size:17px;font-weight:600;color:var(--ink);overflow-wrap:anywhere}
.bb .ch-mood{margin:0 0 8px;color:#e4dcf7;overflow-wrap:anywhere}
.bb .ch-meta{margin:0;font-size:13px}
.bb .ch-avatar{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:48px;height:48px;border-radius:50%;object-fit:cover;border:2px solid var(--ch-accent,var(--gold));background:#2b2940;color:#201737;font-weight:800;font-size:16px}
.bb .ch-avatar.is-initials{background:linear-gradient(135deg,var(--ch-accent,var(--gold)),var(--ch-accent2,var(--accent)))}
.bb .ch-avatar.is-large{width:112px;height:112px;font-size:36px;border-width:3px;box-shadow:0 0 0 4px #00000040,0 0 30px color-mix(in srgb,var(--ch-accent) 35%,transparent)}
.bb .ch-avatar.is-small{width:40px;height:40px;font-size:13px}
.bb .theme-pixel .ch-avatar{border-radius:0;image-rendering:pixelated}
.bb .ch-hero-side{display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.bb .ch-actions{display:flex;flex-wrap:wrap;gap:8px}

/* Retro visitor counter. */
.bb .ch-counter{display:inline-flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:10px;letter-spacing:2px;color:var(--muted)}
.bb .ch-digits{display:inline-flex;gap:2px;padding:4px;border:1px solid #000;border-radius:4px;background:#050507;box-shadow:inset 0 0 8px #000}
.bb .ch-digits b{display:inline-block;min-width:18px;padding:2px 0;border-radius:2px;background:linear-gradient(#1c1c22 50%,#101014 50%);color:#ffcf5a;font:700 18px/1.2 Consolas,"Courier New",monospace;text-align:center;text-shadow:0 0 6px #ffb02e99}

.bb .ch-props{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0}
.bb .ch-props form{margin:0}
.bb .ch-prop{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:6px 12px;border:1px solid var(--ch-line);border-radius:999px;background:var(--ch-panel);color:var(--ink);font:inherit;font-size:18px;cursor:default}
.bb button.ch-prop{cursor:pointer}
.bb button.ch-prop:hover,.bb button.ch-prop:focus-visible{border-color:var(--ch-accent)}
.bb .ch-prop[aria-pressed="true"]{border-color:var(--ch-accent);background:color-mix(in srgb,var(--ch-accent) 18%,var(--ch-panel));box-shadow:0 0 14px color-mix(in srgb,var(--ch-accent) 30%,transparent)}
.bb .ch-prop b{font-size:14px}
.bb .ch-props-hint{font-size:12px}

.bb .ch-layout{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.bb .ch-main,.bb .ch-side{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;align-content:start;min-width:0}
.bb .ch-widgets{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;min-width:0}
.bb .ch-card{position:relative;min-width:0;padding:18px;border:1px solid var(--ch-line);border-radius:var(--ch-radius);background:var(--ch-panel);overflow-wrap:anywhere}
.bb .ch-card h3{margin:0 0 12px;font-size:19px;color:var(--ch-accent)}
.bb .ch-widget-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.bb .ch-widget-head h3{min-width:0}
.bb .ch-empty{text-align:center}
.bb .ch-empty .ch-actions{justify-content:center}
.bb .ch-image{display:block;width:100%;max-height:520px;object-fit:contain;border-radius:calc(var(--ch-radius) - 6px);background:#0003}
.bb .ch-video{display:block;width:100%;max-height:520px;border-radius:10px;background:#000}
.bb .ch-games{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px;margin:0;padding:0;list-style:none}
.bb .ch-games li{overflow:hidden;border:1px solid var(--ch-line);border-radius:10px;background:#0003}
.bb .ch-games img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.bb .ch-games span{display:block;padding:8px 10px;font-size:13px;font-weight:600}
.bb .ch-embed{display:grid;place-items:center;gap:6px;min-height:150px;padding:20px;border:1px dashed var(--ch-line);border-radius:10px;background:#0004;text-align:center}
.bb .ch-embed.is-video{aspect-ratio:16/9;width:100%;min-height:0}
.bb .ch-embed .button{width:auto;margin:0}
.bb .ch-embed iframe{display:block;width:100%;height:100%;min-height:152px;border:0;border-radius:10px}
.bb .ch-embed.is-loaded{padding:0;border:0;background:none}
.bb .ch-player{display:flex;align-items:center;gap:14px}
.bb .ch-player audio{flex:1;min-width:0}
.bb .ch-vinyl{flex-shrink:0;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle,var(--ch-accent) 0 7px,#111 8px 12px,#222 13px 14px,#111 15px 20px,#262626 21px 22px,#111 23px 27px,#2a2a2a 28px 29px,#0b0b0b 30px);box-shadow:0 0 0 2px var(--ch-line)}
.bb .ch-vinyl.is-playing{animation:ch-spin 2.4s linear infinite}

/* Wall */
.bb .ch-wall-form{display:grid;gap:8px;margin-bottom:18px}
.bb .ch-wall-form label{font-weight:600}
.bb .clubhouse textarea,.bb .ch-dialog textarea,.bb .clubhouse input[type=url],.bb .ch-dialog input:not([type=radio]):not([type=checkbox]):not([type=file]){width:100%;min-width:0;min-height:48px;padding:12px;border:1px solid #867044;border-radius:8px;background:#1c1d31;color:var(--ink);font:16px/1.5 "Segoe UI",Arial,sans-serif}
.bb .clubhouse textarea:focus,.bb .ch-dialog textarea:focus{border-color:var(--gold);outline:none}
.bb .ch-wall-extras{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px}
.bb .ch-wall-extras details[open]{flex-basis:100%}
.bb .ch-send{margin-left:auto;min-height:44px}
.bb .ch-wall-extras fieldset{margin:8px 0 0;border:0;padding:0}
.bb .ch-gif-fields{display:grid;gap:8px;margin-top:8px}
.bb .gif-icon{font-size:12px;font-weight:800;letter-spacing:.5px}
.bb .sticker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:6px}
.bb .sticker-choice,.bb .ch-mood-choice,.bb .ch-kind-choice,.bb .ch-theme-choice{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:56px;padding:8px;border:1px solid #54496f;border-radius:10px;background:#1c1d31;text-align:center;cursor:pointer}
.bb .sticker-choice input,.bb .ch-mood-choice input,.bb .ch-kind-choice input,.bb .ch-theme-choice input{position:absolute;opacity:0;pointer-events:none}
.bb .sticker-choice:has(input:checked),.bb .ch-mood-choice:has(input:checked),.bb .ch-kind-choice:has(input:checked),.bb .ch-theme-choice:has(input:checked){border-color:var(--gold);background:#f2d27e1f}
.bb .sticker-choice:has(input:focus-visible),.bb .ch-mood-choice:has(input:focus-visible),.bb .ch-kind-choice:has(input:focus-visible),.bb .ch-theme-choice:has(input:focus-visible){outline:2px solid var(--accent);outline-offset:2px}
.bb .sticker-choice b,.bb .ch-mood-choice span,.bb .ch-kind-choice span{font-size:24px;line-height:1.2}
.bb .sticker-choice span{display:flex;flex-direction:column;align-items:center;font-size:12px}
.bb .ch-mood-choice small,.bb .ch-kind-choice small{font-size:11px;color:var(--muted)}
.bb .ch-mood-grid,.bb .ch-kind-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:6px}
.bb .ch-theme-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px}
.bb .ch-theme-choice{align-items:flex-start;text-align:left;background:var(--ch-panel)}
.bb .ch-theme-choice strong{font-size:14px}
.bb .ch-theme-choice small{font-size:11px;color:#d5cde8}
.bb .ch-swatch{display:block;width:100%;height:28px;margin-bottom:6px;border-radius:6px;background:linear-gradient(90deg,var(--ch-accent),var(--ch-accent2))}
.bb .ch-dialog{max-width:640px}
.bb .ch-dialog form{display:grid;gap:12px}
.bb .ch-dialog fieldset{margin:0;padding:0;border:0}
.bb .ch-dialog legend{margin-bottom:8px;font-weight:600}
.bb .ch-dialog label{display:grid;gap:6px}
.bb .ch-dialog label.check-option,.bb .ch-dialog .check-option{display:flex;align-items:center;gap:10px;min-height:44px}
.bb .ch-dialog .button{margin-top:6px}
.bb .ch-dialog [hidden]{display:none!important}

.bb .ch-posts{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.bb .ch-post{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;padding:12px;border:1px solid var(--ch-line);border-radius:12px;background:#0002}
.bb .ch-post-avatar{display:block;line-height:0}
.bb .ch-post header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:4px}
.bb .ch-post header>span{min-width:0;padding-top:10px;font-weight:600}
.bb .ch-post time{font-weight:400;font-size:12px}
.bb .ch-gif{display:block;max-width:min(100%,360px);max-height:320px;margin-top:8px;border-radius:10px}
.bb .ch-wall-empty{text-align:center}

/* Stickers bounce once in, then rest; static with reduced motion. */
.bb .ch-sticker{display:inline-flex;align-items:center;gap:10px;margin:4px 0 6px;padding:6px 14px 6px 8px;border:2px solid var(--ch-accent);border-radius:999px;background:color-mix(in srgb,var(--ch-accent) 14%,#0000);transform:rotate(-3deg);font-weight:800;font-size:15px;letter-spacing:.3px;text-transform:uppercase}
.bb .ch-sticker b{font-size:34px;line-height:1;animation:ch-pop .7s cubic-bezier(.3,1.6,.5,1) both}
.bb .sticker-fire b,.bb .sticker-party b{animation:ch-pop .7s cubic-bezier(.3,1.6,.5,1) both,ch-wiggle 1.2s ease-in-out .7s 3}
.bb .sticker-ragequit{border-color:#ff757e}
.bb .sticker-respawn b{animation:ch-pop .7s both,ch-spin 1.2s ease-in-out .7s 2}

/* Groups and the top crew live in the hero: quiet tags, then a row of faces (name as label and tooltip). */
.bb .ch-tags.ch-groups{margin:10px 0 0}
.bb .ch-crew{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin-top:10px}
.bb .ch-crew:not(:has(*)){display:none}
.bb .ch-crew-label{font-size:13px;font-weight:600;color:var(--ch-accent)}
.bb .ch-crew-label.muted{font-weight:400;color:var(--muted)}
.bb .ch-crew-faces{display:flex;flex-wrap:wrap;gap:2px;margin:0;padding:0;list-style:none}
.bb .ch-crew-faces a{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;text-decoration:none}
.bb .ch-crew-faces .ch-avatar{width:38px;height:38px;font-size:13px;transition:transform .12s,border-color .12s}
.bb .ch-crew-faces a:hover .ch-avatar,.bb .ch-crew-faces a:focus-visible .ch-avatar{border-color:var(--gold);transform:translateY(-2px)}
.bb .ch-crew-faces small{position:absolute;right:-2px;bottom:-2px;font-size:14px;line-height:1}
.bb .ch-crew-of{flex-basis:100%;margin:0;font-size:13px}
.bb .ch-badges{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 8px;padding:0;list-style:none}
.bb .ch-badges li{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--ch-line);border-radius:10px;background:#0003;font-size:20px}
.bb .ch-visitors ul{display:grid;gap:6px;margin:0;padding:0;list-style:none}

/* BB-Code output */
.bb .bb-text{line-height:1.6;overflow-wrap:anywhere}
.bb .bb-text a{color:var(--ch-accent,var(--gold))}
.bb .bb-u{text-decoration:underline}
.bb .bb-c-gold{color:#f2d27e}.bb .bb-c-red{color:#ff8b92}.bb .bb-c-violet{color:#c9b9ff}.bb .bb-c-blue{color:#8cc7ff}.bb .bb-c-green{color:#8ee59b}.bb .bb-c-pink{color:#ff9ad5}.bb .bb-c-orange{color:#ffb36b}.bb .bb-c-white{color:#fff}.bb .bb-c-muted{color:var(--muted)}
.bb .bb-size-small{font-size:.85em}.bb .bb-size-big{font-size:1.35em;font-weight:700}.bb .bb-size-huge{font-size:1.9em;font-weight:800;line-height:1.2}
.bb .bb-center{text-align:center}.bb .bb-right{text-align:right}
.bb .bb-quote{margin:8px 0;padding:8px 14px;border-left:3px solid var(--ch-accent,var(--gold));border-radius:0 8px 8px 0;background:#0003}
.bb .bb-quote cite{display:block;font-size:12px;font-style:normal;color:var(--muted)}
.bb .bb-list{margin:6px 0;padding-left:22px}
.bb .bb-code{display:block;padding:8px 10px;border-radius:6px;background:#0006;font-family:Consolas,monospace;font-size:14px;white-space:pre-wrap}
.bb .bb-img{max-width:100%;border-radius:8px}
.bb .bb-emoji{font-size:1.15em}
.bb .bb-rainbow{background:linear-gradient(90deg,#ff7b7b,#ffcf5a,#8ee59b,#72b6ff,#c9b9ff,#ff9ad5,#ff7b7b);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:700;animation:ch-rainbow 4s linear infinite}
.bb .bb-glow{color:#fff;text-shadow:0 0 6px var(--ch-accent,var(--gold)),0 0 16px var(--ch-accent2,var(--accent))}
.bb .bb-marquee{display:block;overflow:hidden;white-space:nowrap;contain:inline-size}
.bb .bb-marquee>span{display:inline-block;padding-left:100%;animation:ch-marquee 12s linear infinite}
.bb .bb-wobble{display:inline-block;animation:ch-wiggle 1.4s ease-in-out infinite}
.bb .bb-sparkle{position:relative;color:#fff3c4;text-shadow:0 0 8px #f2d27e99}
.bb .bb-sparkle::after{content:"✨";margin-left:2px;font-size:.8em;animation:ch-twinkle 1.6s ease-in-out infinite}

/* BB toolbar */
.bb .bb-toolbar{display:flex;flex-wrap:wrap;gap:4px}
.bb .bb-toolbar details[open]{flex-basis:100%;order:2}
.bb .emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:4px;margin-top:6px;padding:6px;border:1px solid #54496f;border-radius:10px;background:#1c1d31}
.bb .emoji{min-width:44px;min-height:44px;border:0;border-radius:8px;background:transparent;font-size:22px;cursor:pointer}
.bb .emoji:hover,.bb .emoji:focus-visible{background:#f2d27e1f}
.bb .bb-help-panel{margin-top:6px;padding:10px 14px;border:1px solid #54496f;border-radius:10px;background:#1c1d31;font-size:13px}
.bb .bb-help-panel ul{margin:6px 0 0;padding-left:18px}
.bb .bb-tool-i{font-style:italic}

/* Directory */
.bb .ch-directory-intro{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;color:var(--muted)}
.bb .ch-directory{display:grid;gap:12px;margin:16px 0 0;padding:0;list-style:none}
.bb .ch-house a{display:flex;align-items:center;gap:14px;min-height:72px;padding:14px;border:1px solid var(--ch-line);border-top:3px solid var(--ch-accent);border-radius:14px;background:var(--ch-hero),var(--ch-panel);color:var(--ink);text-decoration:none}
.bb .ch-house a:hover,.bb .ch-house a:focus-visible{border-color:var(--ch-accent)}
.bb .ch-house-text{display:grid;min-width:0;gap:2px}
.bb .ch-house-text strong{font-size:17px;overflow-wrap:anywhere}
.bb .ch-house-text small{color:#ddd6ee;overflow-wrap:anywhere}
.bb .ch-house-meta{font-size:12px}

/* Party mode from the Konami code on a clubhouse */
.bb.ch-party .clubhouse{animation:ch-party 1.2s linear infinite}

@keyframes ch-spin{to{transform:rotate(360deg)}}
@keyframes ch-pop{0%{transform:scale(.2) rotate(-20deg);opacity:0}100%{transform:none;opacity:1}}
@keyframes ch-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-8deg)}75%{transform:rotate(8deg)}}
@keyframes ch-rainbow{to{background-position:200% 0}}
@keyframes ch-marquee{to{transform:translateX(-100%)}}
@keyframes ch-twinkle{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes ch-party{0%{box-shadow:0 0 30px #ff757e88}33%{box-shadow:0 0 30px #f2d27e88}66%{box-shadow:0 0 30px #72b6ff88}100%{box-shadow:0 0 30px #ff757e88}}

@media(min-width:600px){.bb .clubhouse{padding:20px}.bb .ch-directory{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* The clubhouse lays itself out by its own width (it sits between the side columns on desktop), not the screen's.
   Narrow: one column, the wall right after the content, then showcase, Spielecke and visitors. From 600 px of
   clubhouse those small cards become tiles side by side above the wall, and "Über dich" runs full width above the widgets, which flow in two
   columns like a pinboard – only when there are at least two, so a lone widget keeps the full width. */
.bb .clubhouse{container:clubhouse/inline-size}
.bb .ch-layout{grid-template-areas:"main" "wall" "side"}.bb .ch-main{grid-area:main}.bb .ch-wall{grid-area:wall}.bb .ch-side{grid-area:side}
@container clubhouse (min-width:600px){
  .bb .ch-layout{grid-template-areas:"main" "side" "wall"}
  .bb .ch-side{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
  .bb .ch-side .ch-card{padding:16px}
  .bb .ch-side .ch-card h3{font-size:17px;margin-bottom:10px}
  .bb .ch-widgets:has(> .ch-widget:nth-of-type(2)){display:block;columns:2;column-gap:16px}
  .bb .ch-widgets:has(> .ch-widget:nth-of-type(2))>*{break-inside:avoid;margin-bottom:16px}
  .bb .ch-widgets:has(> .ch-widget:nth-of-type(2))>:last-child{margin-bottom:0}
  .bb .ch-widgets:has(> .ch-widget:nth-of-type(2))>.ch-about{column-span:all}
}
@media(min-width:1250px){.bb .ch-directory{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:599px){.bb .ch-hero-side{align-items:flex-start;width:100%}.bb .ch-counter{align-items:flex-start}.bb .ch-avatar.is-large{width:84px;height:84px;font-size:28px}.bb .context-items{min-width:200px}}
@media(prefers-reduced-motion:reduce){.bb .bb-rainbow,.bb .bb-marquee>span,.bb .bb-wobble,.bb .bb-sparkle::after,.bb .ch-sticker b,.bb .ch-vinyl.is-playing,.bb.ch-party .clubhouse{animation:none!important}.bb .bb-marquee{white-space:normal;contain:none}.bb .bb-marquee>span{padding-left:0}}
.bb .player-avatar.has-image{overflow:hidden;padding:0}
.bb .player-avatar.has-image img{display:block;width:100%;height:100%;object-fit:cover}
/* Member pages fill every form button gold; menu entries and respect pills keep their own look. */
.bb .member-surface form>button.context-item{min-height:44px;padding:8px 12px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:400 14px "Segoe UI",Arial,sans-serif;margin:0}
.bb .member-surface form>button.context-item.is-danger{color:#ffb8ba}
.bb .member-surface form>button.context-item:hover,.bb .member-surface form>button.context-item:focus-visible{background:#f2d27e1f;filter:none}
.bb .member-surface form>button.ch-prop{margin:0;padding:6px 12px;border:1px solid var(--ch-line);border-radius:999px;background:var(--ch-panel);color:var(--ink);font:400 18px "Segoe UI",Arial,sans-serif}
.bb .member-surface form>button.ch-prop[aria-pressed="true"]{border-color:var(--ch-accent);background:color-mix(in srgb,var(--ch-accent) 18%,var(--ch-panel))}
.bb .member-surface form>button.ch-prop:hover,.bb .member-surface form>button.ch-prop:focus-visible{border-color:var(--ch-accent);filter:none}
.bb .member-surface a.context-item,.bb .member-surface a.icon-button,.bb .member-surface .ch-crew-faces a,.bb .member-surface .ch-house a{color:var(--ink)}

/* Grouped sidebar navigation: gaming in gold/red, community in lavender; the personal clubhouse sits apart in its card. */
.bb .nav-section{display:grid;gap:5px}
.bb .nav-section+.nav-section{margin-top:10px}
.bb .nav-group{margin:6px 13px 2px;color:#9d93b3;font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase}
.bb .nav-section.is-community .nav-group{color:var(--accent)}
.bb .nav-section.is-community a[aria-current]{color:#e3daff;background:#b5a1ff1f;border-color:#8a78ef}
.bb .mobile-menu nav{max-height:calc(100dvh - 110px);overflow-y:auto}
.bb .clubhouse-card{position:relative;display:flex;align-items:center;gap:6px;min-width:0;padding:8px;border:1px solid #4f4470;border-radius:14px;background:#b5a1ff12}
.bb .clubhouse-card.is-active{border-color:var(--accent);background:#b5a1ff26;box-shadow:0 0 18px #8a78ef33}
.bb .clubhouse-card-link{display:flex;flex:1;align-items:center;gap:10px;min-width:0;min-height:48px;padding:2px 4px;border:0;border-radius:10px;color:var(--ink);text-decoration:none}
.bb nav .clubhouse-card-link{padding:2px 4px;border:0}
.bb .clubhouse-card-link:hover strong,.bb .clubhouse-card-link:focus-visible strong{color:var(--gold)}
.bb .clubhouse-card .ch-avatar{width:40px;height:40px;font-size:13px;--ch-accent:#b5a1ff;--ch-accent2:#ff757e}
.bb .clubhouse-card-text{display:grid;min-width:0}
.bb .clubhouse-card-text small{color:var(--accent);font-size:10px;letter-spacing:.5px}
.bb .clubhouse-card-text strong{font-size:14px;overflow-wrap:anywhere}
.bb .clubhouse-card-status{color:var(--muted);font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bb .clubhouse-card-status.has-news{color:var(--gold);font-weight:600}
.bb .clubhouse-card-status.has-news::before{content:"";display:inline-block;width:7px;height:7px;margin-right:5px;border-radius:50%;background:var(--red);vertical-align:1px}
.bb .clubhouse-card .context-items{top:auto;bottom:calc(100% + 6px)}
.bb .mobile-menu .clubhouse-card{margin-bottom:6px}
.bb .profile.is-clubhouse{display:none}
@media (min-width:1000px){.bb .profile.is-clubhouse{display:block;padding:14px 0 18px}.bb .sidebar-bottom{padding-top:24px}}

/* GIPHY search in the wall form */
.bb .giphy-search{display:grid;gap:8px}
.bb .giphy-search input[type=search]{width:100%;min-height:48px;padding:12px;border:1px solid #867044;border-radius:8px;background:#1c1d31;color:var(--ink);font:16px/1.5 "Segoe UI",Arial,sans-serif}
.bb .giphy-results{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:6px;max-height:320px;overflow-y:auto}
.bb .giphy-pick{display:block;aspect-ratio:1;min-height:44px;padding:0;overflow:hidden;border:2px solid transparent;border-radius:8px;background:#0004;cursor:pointer}
.bb .giphy-pick img{display:block;width:100%;height:100%;object-fit:cover}
.bb .giphy-pick:hover,.bb .giphy-pick:focus-visible{border-color:var(--accent)}
.bb .giphy-pick[aria-pressed="true"]{border-color:var(--gold);box-shadow:0 0 0 2px #f2d27e55}
.bb .member-surface .giphy-search .button.small{width:auto;justify-self:start;margin:0}
.bb .giphy-status:empty{display:none}
.bb .giphy-credit{margin:0;color:var(--muted);font-size:11px;letter-spacing:.3px}
@media (min-width:1000px){.bb .profile.is-clubhouse{position:sticky;bottom:0;z-index:2;margin-top:auto;padding:12px 0 16px;border-top:1px solid var(--line);background:#161725}}
.bb .clubhouse-card-text small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bb .profile .context-items{min-width:210px}
.bb nav .clubhouse-card-link>span{width:auto;font-size:inherit;text-align:left}
.bb nav .clubhouse-card-link>.ch-avatar{width:40px;font-size:13px;text-align:center}
.bb nav .clubhouse-card-text small{margin:0;padding:0;border:0;font-size:10px}
.bb nav .clubhouse-card-link[aria-current]{background:transparent;border:0}
/* Sidebar card: a slim borderless ⋯ so the name stays readable (still 44px tall). */
.bb .clubhouse-card{gap:2px;padding:6px 4px 6px 8px}
.bb .clubhouse-card-link{gap:8px;padding:2px 0}
.bb .clubhouse-card>.context-menu>summary.icon-button{width:30px;border-color:transparent;background:transparent;color:var(--muted);font-size:18px}
.bb .clubhouse-card>.context-menu>summary.icon-button:hover,.bb .clubhouse-card>.context-menu>summary.icon-button:focus-visible,.bb .clubhouse-card>.context-menu[open]>summary.icon-button{border-color:var(--gold);color:var(--ink);background:#f2d27e1f}
/* Budenverwaltung: GIPHY key. Icon test button sits next to the labelled remove button. */
.bb .giphy-settings code{overflow-wrap:anywhere}
.bb .giphy-key-form{display:grid;gap:8px;max-width:480px}
.bb .member-surface .giphy-settings form>button.icon-button{margin:0;padding:0;border:1px solid #8e764a;background:#252239;color:var(--ink);font-size:20px}
.bb .member-surface .giphy-settings form>button.danger{margin:0;min-height:44px}
/* The pinned card area blends into the sidebar: same colour, full width, soft fade instead of a hard line. */
@media (min-width:1000px){.bb .profile.is-clubhouse{margin-inline:-18px;padding:20px 18px 16px;border-top:0;background:linear-gradient(#1c1d3100,#1c1d31 18px)}}
/* Phones: flat clubhouse. The theme background runs edge to edge and sections are separated by hairlines
   instead of nested framed boxes, so content uses the full width minus the 16px page gutter. Desktop unchanged. */
@media(max-width:599px){
.bb .clubhouse{margin:8px -16px 0;padding:0 0 8px;border:0;border-radius:0}
.bb .ch-hero{gap:16px;padding:20px 16px;border:0;border-radius:0}
.bb .ch-identity{flex-wrap:nowrap;align-items:flex-start;gap:14px}
.bb .ch-avatar.is-large{width:64px;height:64px;font-size:22px;border-width:2px;box-shadow:none}
.bb .ch-who{flex:1 1 0}
.bb .ch-name{font-size:28px}
.bb .ch-hero-side{flex-direction:row;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;width:100%}
.bb .ch-props{margin:0;padding:12px 16px}
.bb .ch-layout,.bb .ch-main,.bb .ch-side,.bb .ch-widgets{gap:0}
.bb .ch-card{padding:20px 16px;border:0;border-top:1px solid var(--ch-line);border-radius:0;background:transparent}
.bb .ch-card h3{margin-bottom:10px}
.bb .ch-widget-head .context-menu>summary.icon-button,.bb .ch-post .context-menu>summary.icon-button,.bb .member-surface .ch-post a.icon-button{border-color:transparent;background:transparent}
.bb .ch-games{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 8px}
.bb .ch-games li{border:0;background:none}
.bb .ch-games img{border-radius:8px}
.bb .ch-games span{padding:6px 0 0}
.bb .ch-posts{gap:0}
.bb .ch-post{grid-template-columns:32px minmax(0,1fr);gap:10px;padding:14px 0;border:0;border-top:1px solid #ffffff14;border-radius:0;background:none}
.bb .ch-post .ch-avatar.is-small{width:32px;height:32px;font-size:11px;border-width:1px}
.bb .ch-post header>span{padding-top:4px}
.bb .ch-embed{border-radius:8px}
}
/* Budenverwaltung → Nodes: one row per node with its name, RAM and CPU size; wraps on phones. */
.bb .node-sizes{display:grid;gap:8px;margin:4px 0;padding:10px 12px;border:1px solid var(--line);border-radius:12px}
.bb .node-size-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
.bb .node-size-name{flex:1 1 100%;font-weight:700}
.bb .member-surface .node-size-row label{display:inline-flex;align-items:center;gap:8px;margin:0;font-size:13px;white-space:nowrap}
.bb .member-surface .node-size-row input:not([type=hidden]){flex:none;width:96px;margin:0}