/* One home shell and one stationary Workshop background, transitioning to Community. */
.gallery { --home-morph:1.5s; --home-ease:cubic-bezier(.65,0,.25,1); isolation:isolate; background-color:#f6f3ec;
  transition:background-color var(--home-morph) var(--home-ease),color 1.05s ease; }
.gallery .gal-bg::before { content:'';position:absolute;inset:0;background:radial-gradient(1300px 800px at 55% 15%,#fdfcf7 0%,#f6f3ec 45%,#ece8dc 100%);transition:opacity var(--home-morph) var(--home-ease); }
.gallery .studfield { transition:color var(--home-morph) var(--home-ease); }
.gallery .gal-bg .blob { transition:opacity var(--home-morph) var(--home-ease); }
.gallery header { min-height:65px;flex:none;transition:background-color var(--home-morph) var(--home-ease),color 1.05s ease,border-color var(--home-morph) var(--home-ease); }
.gallery .home-nav { position:absolute;left:50%;transform:translateX(-50%);display:flex;gap:5px;padding:4px;border-radius:11px;background:#eeebe4;transition:background-color var(--home-morph) var(--home-ease); }
.home-nav a { padding:8px 21px;text-decoration:none;color:#70747d;border-radius:8px;font-weight:600;transition:color 1.05s,background-color var(--home-morph) var(--home-ease); }
.home-nav a[aria-current=page] { color:#242731;background:#fff;box-shadow:0 1px 4px #0002; }
#galleryUser { max-width:clamp(80px,11vw,180px);overflow:hidden;white-space:nowrap;text-overflow:ellipsis; }
.workshop-card-actions { display:flex;justify-content:flex-end;padding:0 12px 10px;margin-top:auto; }
.workshop-share { font-size:12px;padding:5px 11px;border-radius:7px; }
.home-page[hidden],.community-toast[hidden],#communityMore[hidden],#communityUpdate[hidden],#communityShareError[hidden] { display:none!important; }
.home-page.home-leaving { opacity:0;transition:opacity .24s ease; }
.home-page.home-arriving { animation:community-page-arrive .8s .18s ease both; }
@keyframes community-page-arrive { from{opacity:0}to{opacity:1} }
.gallery.community-dark { color:#f6f2ec;background-color:#090e16;--notebook-dot-color:rgba(224,232,248,.42); }
.gallery.community-dark .gal-bg::before { opacity:0; }
.gallery.community-dark .gal-bg .blob { opacity:.14; }
.gallery.community-dark header { background:rgba(9,14,22,.94);border-color:#303946; }
.community-dark .home-nav { background:#141c27; }
.community-dark .home-nav a { color:#a6acb7; }
.community-dark .home-nav a[aria-current=page] { background:#283344;color:#f6f2ec; }
.community-dark #galleryUser { color:#a6acb7; }
.community-dark .tour-replay { display:none; }
.community-dark #logoutBtn { background:#1a222d;border-color:#39414c;color:#e8eaf0; }
.community-content { max-width:1180px;margin:0 auto;padding:36px 36px 48px; }
.community-content h1 { font:700 clamp(28px,3vw,38px)/1.15 'Space Grotesk','Segoe UI',sans-serif;letter-spacing:-.8px;margin:0 0 18px; }
.community-hero { position:relative;height:clamp(440px,48vw,560px);background:transparent; }
#communityCanvas { display:block;width:100%;height:calc(100% - 90px);opacity:1;transition:opacity .3s ease;touch-action:pan-y; }
#communityCanvas.model-fading { opacity:0; }
.community-model-status { position:absolute;top:42%;left:20px;right:20px;text-align:center;color:#b6bdc8;font-size:14px;pointer-events:none; }
.community-hero-info { position:absolute;bottom:24px;left:24px;max-width:60%;pointer-events:none;text-shadow:0 2px 10px #0008; }
.community-eyebrow { text-transform:uppercase;color:#ffa3a9;letter-spacing:2px;font-size:10px;font-weight:700;margin-bottom:7px; }
.community-hero-info h2 { font:600 24px/1.25 'Space Grotesk','Segoe UI',sans-serif;letter-spacing:-.4px;margin:0;padding:0;color:#f6f2ec;text-transform:none; }
.community-cycle { position:absolute;bottom:24px;right:18px;display:flex;align-items:center;gap:12px; }
.community-cycle>button { font-size:11px;background:#111925dc;color:#d2d8e2;border:1px solid #39414c;border-radius:18px;padding:8px 12px; }
.community-dots { display:flex;gap:0;max-width:170px;flex-wrap:wrap;justify-content:flex-end; }
.community-dots button { display:grid;place-items:center;border:0;background:transparent;border-radius:50%;width:15px;height:22px;padding:0; }
.community-dots button::before { content:'';width:5px;height:5px;border-radius:50%;background:#6b7788; }
.community-dots button[aria-pressed=true]::before { background:#ff8b94; }
.community-filterbar { display:flex;gap:18px;align-items:center;justify-content:space-between;margin:25px 0 18px; }
.community-filters { display:flex;gap:7px; }
.community-filters button { background:transparent;border:0;color:#aeb7c6;padding:9px 15px;font-size:13px; }
.community-filters button[aria-pressed=true] { background:#303c4d;color:#fff; }
#communityCount { color:#99a5b6;font-size:12px; }
.community-grid { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px; }
.community-card { position:relative;min-width:0;background:#1a222d;border:1px solid #39414c;border-radius:12px;overflow:hidden;transition:transform .18s,border-color .18s; }
.community-card:hover { transform:translateY(-2px);border-color:#91a0b5; }
.community-card.selected { border-color:#ed6975;box-shadow:0 0 0 1px #ed6975; }
.community-select { width:100%;display:block;background:transparent;border:0;border-radius:0;padding:0;text-align:left;color:#f5f2ee; }
.community-select img { display:block;width:100%;height:auto;aspect-ratio:1.6;object-fit:contain;padding:10px;background:radial-gradient(ellipse at 50% 65%,#34404e,#1a222d 82%); }
.community-card-name { display:flex;align-items:center;min-height:62px;padding:12px 52px 12px 14px;font-size:13px;font-weight:600;line-height:1.4; }
.community-add { position:absolute;right:12px;bottom:15px;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #556174;border-radius:50%;background:#303d50;color:#f4f6fa; }
.community-add::before,.community-add::after { content:'';position:absolute;width:12px;height:1.5px;background:currentColor;border-radius:2px; }
.community-add::after { transform:rotate(90deg); }
.community-add.added::before { width:12px;height:7px;background:transparent;border-left:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-2px) rotate(-45deg); }
.community-add.added::after { display:none; }
.community-add.added { background:#254536;color:#c0ebd6;border-color:#48765f;opacity:1; }
.community-add:disabled:not(.added) { opacity:.45; }
.community-list-status { color:#b6bdc8;line-height:1.6; }
.community-list-status:empty { display:none; }
.community-list-status button,#communityMore { background:#1a2534;color:#e1e7ef;border:1px solid #445368; }
.community-list-status button { margin-left:12px; }
#communityMore { display:block;margin:24px auto 0;padding:10px 20px; }
.community-toast { position:absolute;top:82px;right:24px;z-index:12;max-width:calc(100% - 48px);border-radius:9px;padding:12px 18px;background:#edf8f1;color:#254e38;border:1px solid #aed4bb;box-shadow:0 8px 25px #0002; }
.community-publish-row { display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid #dfdbd3;margin-top:20px;padding-top:19px; }
.community-publish-row label { cursor:pointer; }
.community-publish-row strong { display:block;font-size:14px; }
.community-publish-row label span { display:block;font-size:12px;color:#747580;line-height:1.5;margin-top:5px; }
input.community-switch { appearance:none;flex-shrink:0;width:42px;height:24px;padding:0;background:#cecdd0;border:0;border-radius:20px;position:relative;cursor:pointer;transition:background .2s; }
.community-switch::before { content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s; }
input.community-switch:checked { background:#df2632; }
.community-switch:checked::before { transform:translateX(18px); }
.community-switch:disabled { opacity:.55;cursor:wait; }
.community-update { margin-top:14px;font-size:12px; }
.share-modal p.community-share-error { margin:14px 0 0;padding:11px 13px;border-radius:8px;background:#fff0ed;color:#924231;font-size:12px; }
@media(max-width:1050px) { .community-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:850px) {
  .gallery header { flex-wrap:wrap; }
  .gallery .home-nav { position:static;left:auto;transform:none;order:5;flex-basis:auto;margin:auto; }
  .gallery header::after { content:'';flex-basis:100%;order:4; }
  .community-content { padding:30px 24px; }
  .community-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #communityCanvas { height:calc(100% - 130px); }
  .community-hero-info { bottom:62px;left:10px;max-width:90%; }
  .community-cycle { left:10px;right:auto;bottom:15px; }
}
@media(max-width:450px) {
  .community-content { padding:26px 18px; }
  .community-grid { grid-template-columns:1fr; }
  .community-hero { height:440px; }
  .community-hero-info h2 { font-size:21px; }
  .community-filters { gap:2px; }
  .community-filters button { padding:9px 12px; }
  #communityCount { font-size:11px; }
  #galleryUser { display:none; }
}
@media(pointer:coarse) { .community-add{width:40px;height:40px;bottom:11px}.community-dots button{width:24px;height:30px}.community-dots{max-width:144px}.community-cycle{gap:8px} }
@media(prefers-reduced-motion:reduce) { .gallery,.gallery *,.gallery ::before,.gallery ::after{transition:none!important;animation:none!important} }
