/* A shared closing invitation, with tool-specific copy and original Labs artwork. */
.tool-community{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:center;gap:8px;margin:48px 0 0;border-radius:16px;overflow:hidden;background:#050505;color:#fff;text-align:left;isolation:isolate}
.tool-community-copy{position:relative;z-index:1;padding:38px 0 38px 38px;min-width:0}
body[data-page=labs] .tool-community h2{margin:0 0 14px;color:#ff936c;font-family:Alcyone,system-ui,sans-serif;font-weight:400;font-size:clamp(1.65rem,2.7vw,2.25rem);line-height:1.2;letter-spacing:-.025em;text-wrap:balance}
body[data-page=labs] .tool-community p{margin:0;max-width:48ch;color:#ede4df;font-size:1rem;line-height:1.6;text-wrap:pretty}
.tool-community-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px 24px;margin-top:24px}
body[data-page=labs] .tool-community-actions a{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;font-size:.9375rem;line-height:1.4;text-decoration:none}
body[data-page=labs] a.tool-community-discord{padding:12px 18px;border-radius:8px;background:#ff936c;color:#21110b}
body[data-page=labs] a.tool-community-discord:hover{background:#ffac8e}
body[data-page=labs] a.tool-community-idea{color:#fff;text-decoration:underline;text-underline-offset:5px;text-decoration-color:#7a6d65}
body[data-page=labs] a.tool-community-idea:hover{color:#ffac8e;text-decoration-color:currentColor}
.tool-community-actions svg{flex:none}
body[data-page=labs] .tool-community a:focus-visible{outline:2px solid #ffac8e;outline-offset:5px}
.tool-community-art{display:block;width:100%;height:300px;object-fit:contain;max-width:none;pointer-events:none}
.tool-community ::selection{background:#ff936c;color:#21110b}
@media(max-width:900px){.tool-community-copy{padding:30px 0 30px 28px}.tool-community-art{height:280px}.tool-community-actions{gap:8px 18px}}
@media(max-width:700px){
  .tool-community{display:block;margin-top:28px;background:#e8d8c8;color:#30231a}
  .tool-community-copy{padding:22px 20px}
  body[data-page=labs] .tool-community h2{margin-bottom:10px;color:#8d3613;font-size:1.375rem;line-height:1.25}
  body[data-page=labs] .tool-community p{color:#58463a;line-height:1.5}
  .tool-community-art{display:none}
  .tool-community-actions{gap:8px 18px;margin-top:16px}
  body[data-page=labs] .tool-community-actions a{min-height:44px;max-width:100%;font-size:.9375rem}
  body[data-page=labs] a.tool-community-discord{padding:10px 14px}
  body[data-page=labs] a.tool-community-idea{color:#30231a;text-decoration-color:#8c7564}
  body[data-page=labs] a.tool-community-idea:hover{color:#8d3613}
  body[data-page=labs] .tool-community a:focus-visible{outline-color:#8d3613}
  html[data-theme=dark] .tool-community{background:#30231c}
  html[data-theme=dark] body[data-page=labs] .tool-community h2{color:#ff936c}
  html[data-theme=dark] body[data-page=labs] .tool-community p{color:#ede4df}
  html[data-theme=dark] body[data-page=labs] .tool-community a:focus-visible{outline-color:#ffac8e}
}
@media(prefers-reduced-motion:no-preference){.tool-community-actions a{transition:background-color .18s ease,color .18s ease}}
/* Keep the banner's contrast independent of the shell's dark-mode link color. */
html[data-theme=dark] body[data-page=labs] .tool-community a.tool-community-discord{color:#21110b}
html[data-theme=dark] body[data-page=labs] .tool-community a.tool-community-idea{color:#fff}
html[data-theme=dark] body[data-page=labs] .tool-community a.tool-community-idea:hover{color:#ffac8e}
