html[data-theme=dark] :where(.circle-cover){background:var(--color-raised)}html[data-theme=dark] .circle-switcher{background:var(--color-surface)}.circle-directory-main{padding-block:var(--space-24) var(--space-64)}.circle-section-heading{justify-content:space-between;align-items:center;gap:var(--space-16);min-height:28px;display:flex}.circle-section-heading h2{font-size:var(--font-size-18);margin:0}.circle-section-heading>span{color:var(--color-faint);font-size:var(--font-size-12)}.circle-directory-grid{gap:var(--space-16);margin-top:var(--space-20);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.circle-directory-card{align-items:center;gap:var(--space-20);min-width:0;padding:var(--space-24);border-radius:var(--radius-12);background:var(--color-surface);display:flex}.circle-directory-card .circle-logo-large{border-radius:var(--radius-12);flex-basis:4rem;width:4rem;height:4rem}.circle-logo-fallback{background:var(--color-raised)}.circle-directory-copy{gap:var(--space-6);min-width:0;display:grid}.circle-name-row{align-items:center;gap:var(--space-6);min-width:0;display:flex}.circle-name-row>strong{min-width:0}.circle-new-badge{height:16px;padding-inline:var(--space-4);border:1px solid var(--color-highlight-line);border-radius:var(--radius-4);background:var(--color-highlight-soft);color:var(--color-highlight-icon);font-size:var(--font-size-10);font-weight:var(--weight-semibold);letter-spacing:.02em;flex:none;align-items:center;line-height:1;display:inline-flex}.circle-directory-copy strong{font-size:var(--font-size-20);text-overflow:ellipsis;white-space:nowrap;transition:color var(--motion-fast) var(--motion-ease-out);line-height:1.4;overflow:hidden}@media (hover:hover){.circle-directory-card:hover .circle-directory-copy strong{color:var(--color-brand-ink)}}.circle-directory-copy small{color:var(--color-muted);font-size:var(--font-size-13)}.circle-directory-arrow{color:var(--color-muted);flex-shrink:0;margin-left:auto}.circle-empty-state{min-height:280px;margin-top:var(--space-18);border-radius:var(--radius-10);background:var(--color-surface);color:var(--color-muted);text-align:center;place-content:center;justify-items:center;display:grid}.circle-empty-state h2{margin:var(--space-14) 0 0;color:var(--color-ink);font-size:var(--font-size-18)}.circle-empty-state p{margin:var(--space-6) 0 0;font-size:var(--font-size-13)}.circle-login-button{margin-top:var(--space-16);min-height:var(--control-height-md);padding:var(--space-8) var(--space-24);border-radius:var(--radius-control);background:var(--color-accent);color:var(--color-on-accent);font-size:var(--font-size-14);cursor:pointer;border:none}@media (hover:hover){.circle-login-button:hover{background:var(--color-accent-hover)}}.circle-top-posts{padding:var(--space-16) var(--space-24);border-radius:var(--radius-panel);background:var(--color-surface);margin-top:0}.circle-top-list{margin:var(--space-10) 0 0;gap:var(--space-8);padding:0;list-style:none;display:grid}.circle-top-list li{align-items:center;gap:var(--space-8);min-width:0;display:flex}.circle-top-list img{flex:none;width:16px;height:16px}.circle-top-list a{text-overflow:ellipsis;white-space:nowrap;color:var(--color-ink);font-size:var(--font-size-14);overflow:hidden}@media (hover:hover){.circle-top-list a:hover{color:var(--color-brand-ink)}}.circle-detail-main{padding-top:var(--space-16);padding-bottom:var(--space-64)}.circle-switcher{align-items:center;gap:var(--space-10);padding:var(--space-8) var(--space-12);border-radius:var(--radius-panel);background:var(--color-surface);display:flex;overflow:hidden}.circle-switcher-track{align-items:center;gap:var(--space-8);overscroll-behavior-inline:contain;scrollbar-width:none;flex:auto;min-width:0;display:flex;overflow-x:auto}.circle-switcher-track::-webkit-scrollbar{display:none}.circle-switcher-track>a{min-width:112px;padding:var(--space-4) var(--space-8);border-radius:var(--radius-8);align-items:center;gap:var(--space-8);color:var(--color-muted);border:1px solid #0000;flex:none;display:flex}.circle-switcher-track>a.active{border-color:var(--color-control-border);background:var(--color-accent-soft);color:var(--color-ink)}@media (hover:hover){.circle-switcher-track>a:hover{border-color:var(--color-control-border);background:var(--color-accent-soft);color:var(--color-ink)}}.circle-switcher-track>a strong{max-width:76px;font-size:var(--font-size-12);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.circle-switcher-logo{flex:none;display:inline-flex;position:relative}.circle-switcher-logo .circle-new-badge{top:calc(var(--space-4) * -1);right:calc(var(--space-8) * -1);height:14px;padding-inline:var(--space-3);font-size:var(--font-size-9);position:absolute}.circle-switcher .circle-logo{border-radius:var(--radius-8);flex-basis:34px;width:34px;height:34px}.circle-switcher-more{align-items:center;gap:var(--space-9);padding:var(--space-7) var(--space-9);border-radius:var(--radius-8);color:var(--color-muted);font:inherit;cursor:pointer;background:0 0;border:1px solid #0000;flex:none;display:flex}.circle-switcher-more[aria-expanded=true]{border-color:var(--color-control-border);background:var(--color-accent-soft);color:var(--color-ink)}.circle-all-popover{width:min(520px,100vw - 32px);max-height:min(480px,70dvh);padding:var(--space-8);overscroll-behavior:contain;overflow-y:auto}.circle-all-list{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:0;list-style:none;display:grid}.circle-all-list a{min-width:0;padding:var(--space-8);border-radius:var(--radius-10);align-items:center;gap:var(--space-10);color:var(--color-ink);border:1px solid #0000;display:flex}@media (hover:hover){.circle-all-list a:hover{background:var(--color-raised)}}.circle-all-list a.active{border-color:var(--color-control-border);background:var(--color-accent-soft)}.circle-all-list a>span{gap:var(--space-2);min-width:0;display:grid}.circle-all-list strong,.circle-all-list small{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.circle-all-list strong{font-size:var(--font-size-14);font-weight:var(--weight-medium)}.circle-all-list small{color:var(--color-faint);font-size:var(--text-meta-size)}.circle-all-sheet{--ui-sheet-padding:var(--space-40) var(--space-16) calc(var(--space-16) + env(safe-area-inset-bottom));height:min(75dvh,640px)}.circle-all-sheet h2{margin-bottom:var(--space-12);font-size:var(--font-size-18)}.circle-all-sheet .circle-all-list a{padding:var(--space-8) var(--space-6);gap:var(--space-8)}.circle-all-sheet .circle-logo{flex-basis:36px;width:36px;height:36px}@media (hover:hover){.circle-switcher-more:hover{border-color:var(--color-control-border);background:var(--color-accent-soft);color:var(--color-ink)}}.circle-switcher-more>span{border-radius:var(--radius-8);background:var(--color-raised);flex:none;place-items:center;width:34px;height:34px;display:grid}.circle-detail-layout{margin-top:var(--space-12);grid-template-columns:minmax(0, 1fr) var(--layout-sidebar-width);align-items:start;gap:var(--layout-column-gap);display:grid}.circle-detail-main .embedded-loading-state{margin-top:var(--space-12);background:0 0;padding:0}.circle-detail-main .embedded-skeleton{grid-template-columns:minmax(0, 1fr) var(--layout-sidebar-width);gap:var(--layout-column-gap);max-width:none}.circle-detail-column,.circle-detail-sidebar{gap:var(--space-12);min-width:0;display:grid}.circle-detail-sidebar{position:sticky;top:84px}.circle-cover{min-height:104px;padding:var(--space-32);border-radius:var(--radius-panel);gap:var(--space-20);background:var(--color-surface);color:var(--color-ink);isolation:isolate;flex-direction:column;display:flex;position:relative;overflow:hidden}.circle-cover-bg{z-index:-1;object-fit:cover;object-position:center;filter:brightness(.68);width:100%;height:100%;position:absolute;inset:0}.circle-cover:has(.circle-cover-bg:not([hidden])){color:var(--color-white)}.circle-cover:has(.circle-cover-bg:not([hidden])) :is(h1,.circle-cover-count strong){color:var(--color-white);text-shadow:0 1px 6px var(--palette-rgb-0-0-0-35)}.circle-cover:has(.circle-cover-bg:not([hidden])) :is(.circle-cover-identity>div>span,.circle-cover-count>span),.circle-cover:has(.circle-cover-bg:not([hidden])) .circle-cover-master{color:var(--palette-rgb-255-255-255-86);text-shadow:0 1px 4px var(--palette-rgb-0-0-0-35)}.circle-cover:has(.circle-cover-bg:not([hidden])) .circle-cover-game{border-color:var(--palette-rgb-255-255-255-35);background:var(--palette-rgb-255-255-255-12);color:var(--palette-rgb-255-255-255-96);text-shadow:none}@media (hover:hover){.circle-cover:has(.circle-cover-bg:not([hidden])) .circle-cover-game:hover{border-color:var(--color-brand);color:var(--color-brand)}}.circle-cover:has(.circle-cover-bg:not([hidden])) .circle-cover-master strong{color:var(--color-white)}.circle-cover:has(.circle-cover-bg:not([hidden])) .circle-tool-grid button{background:var(--palette-rgb-255-255-255-18);color:var(--palette-rgb-255-255-255-96);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-color:#0000}@media (hover:hover){.circle-cover:has(.circle-cover-bg:not([hidden])) .circle-tool-grid button:hover{border-color:var(--palette-rgb-255-255-255-62);background:var(--palette-rgb-255-255-255-20);color:var(--color-white)}}.circle-cover:has(.circle-cover-bg:not([hidden])) .circle-tool-grid button.active{border-color:var(--color-brand);background:var(--color-brand);color:var(--color-on-brand)}.circle-cover-main{justify-content:space-between;align-items:center;gap:var(--space-32);display:flex}.circle-cover-identity{align-items:center;gap:var(--space-16);min-width:0;display:flex}.circle-cover-identity .circle-logo{border:0}.circle-cover-identity h1{margin:0 0 var(--space-4);font-size:var(--text-page-title-size);line-height:var(--text-page-title-leading);font-weight:var(--weight-semibold);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.circle-cover-identity h1:has(.circle-new-badge){align-items:center;gap:var(--space-8);display:flex}.circle-cover-identity h1>span:first-child{text-overflow:ellipsis;min-width:0;overflow:hidden}.circle-cover-identity>div>span,.circle-cover-count>span{color:var(--color-faint);font-size:var(--text-meta-size)}.circle-cover-identity>div>span{-webkit-line-clamp:2;overflow-wrap:anywhere;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.circle-cover-meta{min-width:0;margin-top:var(--space-6);align-items:center;gap:var(--space-4) var(--space-12);flex-wrap:wrap;display:flex}.circle-cover-master{align-items:center;gap:var(--space-4);min-width:0;color:var(--color-faint);font-size:var(--text-meta-size);display:flex}.circle-cover-master svg{color:var(--color-brand);flex:none}.circle-cover-master i{font-style:normal}.circle-cover-game{padding:var(--space-2) var(--space-8) var(--space-2) var(--space-10);border:1px solid var(--color-line);border-radius:var(--radius-999);align-items:center;gap:var(--space-2);color:var(--color-muted);font-size:var(--text-meta-size);white-space:nowrap;line-height:1.4;display:inline-flex}@media (hover:hover){.circle-cover-game:hover{border-color:var(--color-brand-ink);color:var(--color-brand-ink)}}.circle-cover-master strong{min-width:0;color:var(--color-muted);font-weight:var(--weight-medium);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.circle-cover-count{gap:var(--space-4);text-align:center;min-width:110px;display:grid}.circle-cover-count strong{color:var(--color-ink);font-size:var(--text-section-size);font-weight:var(--weight-semibold)}.circle-feed-panel{border-radius:var(--radius-panel);background:var(--color-surface);overflow:hidden}.circle-tool-grid{gap:var(--space-8);border:0;flex-wrap:wrap;min-width:0;margin:0;padding:0;display:flex}.circle-tool-grid button{min-width:0;max-width:100%;min-height:var(--control-height-md);padding:var(--space-8) var(--space-12);border-radius:var(--radius-control);align-items:center;gap:var(--space-8);background:var(--color-raised);color:var(--color-muted);cursor:pointer;border:1px solid #0000;display:inline-flex}@media (hover:hover){.circle-tool-grid button:hover{border-color:var(--color-brand-ink);color:var(--color-brand-ink)}}.circle-tool-grid button.active{border-color:var(--color-control-border);background:var(--color-accent-soft);color:var(--color-accent-ink)}.circle-tool-grid button>span{width:var(--control-icon-size);height:var(--control-icon-size);color:inherit;flex:none;place-items:center;display:grid}.circle-tool-grid button strong{max-width:100%;font-size:var(--text-meta-size);font-weight:var(--weight-medium);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.circle-feed-tabs{height:52px;padding:0 var(--space-24);border-bottom:1px solid var(--color-line);align-items:center;gap:var(--space-24);display:flex}.circle-feed-tabs button{height:100%;color:var(--color-muted);font-size:var(--font-size-14);cursor:pointer;background:0 0;border:0;padding:0;position:relative}.circle-feed-tabs button.active{color:var(--color-ink);font-weight:var(--weight-semibold)}.circle-feed-tabs button.active:after{border-radius:var(--radius-3);background:var(--color-accent);content:"";height:2px;position:absolute;bottom:-1px;left:0;right:0}.circle-feed-tabs>span{color:var(--color-faint);font-size:var(--font-size-12);margin-left:auto}.circle-feed-post:last-of-type{border-bottom:0}.circle-feed-skeleton-list .feed-skeleton{margin:0 var(--feed-row-padding-x);padding:var(--feed-row-padding-y) 0}.circle-feed-skeleton-list .feed-skeleton:last-child{border-bottom:0}.circle-feed-state{justify-content:center;align-items:center;gap:var(--space-8);min-height:190px;color:var(--color-muted);font-size:var(--font-size-13);flex-direction:column;display:flex}.circle-feed-state p{margin:0}.circle-load-more{min-height:var(--control-height-md);min-width:120px;padding:0 var(--space-16);border:1px solid var(--color-control-border);border-radius:var(--radius-control);background:var(--color-surface);color:var(--color-ink);font-size:var(--font-size-12);cursor:pointer;font-weight:700}@media (hover:hover){.circle-load-more:hover{border-color:var(--color-brand-ink);color:var(--color-brand-ink)}}.circle-load-more{min-width:112px;margin:var(--space-14) auto var(--space-18);justify-content:center;align-items:center;gap:var(--space-6);display:flex}@media (max-width:900px){.circle-detail-layout,.circle-detail-main .embedded-skeleton{grid-template-columns:minmax(0,1fr)}.circle-detail-sidebar{grid-template-columns:repeat(2,minmax(0,1fr));position:static}}@media (max-width:640px){.circle-directory-grid{gap:var(--space-8);margin-top:var(--space-12);grid-template-columns:1fr}.circle-directory-card{gap:var(--space-12);padding:var(--space-16)}.circle-directory-card .circle-logo-large{border-radius:var(--radius-10);flex-basis:3rem;width:3rem;height:3rem}.circle-directory-copy strong{font-size:var(--font-size-18)}}@media (max-width:700px){.circle-directory-main{padding-bottom:var(--space-82)}.community-shell.circle-detail-main{width:100%;padding-bottom:var(--space-82)}.circle-switcher{gap:var(--space-4);padding:var(--space-6) var(--space-8);background:var(--color-surface);border:0;border-radius:0;display:flex}.circle-switcher-track{gap:0}.circle-switcher .scroll-track[data-overflow] .scroll-track-arrow{display:none}.circle-switcher-track>a{width:auto;min-width:44px;padding:var(--space-2) var(--space-4);border-radius:var(--radius-8);gap:var(--space-2);color:var(--color-muted);flex-direction:column}.circle-switcher-track>a.active{color:var(--color-ink);background:0 0;border-color:#0000}@media (hover:hover){.circle-switcher-track>a:hover{color:var(--color-ink);background:0 0;border-color:#0000}}.circle-switcher-track>a strong{max-width:4.2em;font-size:var(--text-label-size)}.circle-switcher-track>a.active strong{color:var(--color-accent-ink);font-weight:var(--weight-semibold)}.circle-switcher-more{gap:var(--space-2);width:auto;min-width:44px;padding:var(--space-2) var(--space-4);color:var(--color-muted);flex-direction:column}@media (hover:hover){.circle-switcher-more:hover{color:var(--color-brand-ink);background:0 0;border-color:#0000}}.circle-switcher-more strong{max-width:100%;font-size:var(--text-label-size)}.circle-switcher .circle-logo,.circle-switcher-more>span{flex-basis:40px;width:40px;height:40px}.circle-switcher .circle-logo{border-radius:var(--radius-12)}.circle-switcher-more>span{border-radius:var(--radius-12);background:var(--color-raised)}.circle-detail-layout{gap:var(--space-9);margin-top:0}.circle-detail-column{gap:var(--space-9)}.circle-cover{min-height:96px;padding:var(--space-16);gap:var(--space-16);border-radius:0 0 var(--radius-panel) var(--radius-panel);background:var(--color-raised)}.circle-cover-main{gap:var(--space-16)}.circle-cover-identity{gap:var(--space-10)}.circle-cover-identity .circle-logo-large{border-radius:var(--radius-10);flex-basis:48px;width:48px;height:48px}.circle-cover-identity p{display:none}.circle-cover-identity h1{font-size:var(--font-size-18);margin-top:0}.circle-cover-count{min-width:72px}.circle-cover-count strong{font-size:var(--font-size-19)}.circle-feed-panel{border-left:0;border-right:0;border-radius:0;overflow:visible}.circle-feed-tabs{z-index:var(--z-sticky);background:var(--color-surface);position:sticky;top:0}.mobile-browse-shell[data-mobile-navigation=detail] .circle-feed-tabs{top:calc(var(--mobile-return-height) + env(safe-area-inset-top))}.circle-tool-grid{gap:var(--space-8)}.circle-tool-grid button{min-height:var(--control-height-touch);padding:var(--space-8) var(--space-12);gap:var(--space-8);background:var(--color-surface)}.circle-tool-grid button.active{background:var(--color-accent-soft)}.circle-tool-grid button>span{width:var(--control-icon-size);height:var(--control-icon-size)}.circle-feed-tabs{height:46px;padding:0 var(--space-16);gap:var(--space-26)}.circle-feed-tabs button.active:after{left:50%;right:auto;bottom:var(--space-3);border-radius:var(--radius-999);background:var(--color-brand);width:22px;height:3px;translate:-50%}.circle-feed-tabs>span{font-size:var(--text-label-size)}.circle-feed-post,.circle-feed-skeleton-list .feed-skeleton{margin:0 var(--space-16);padding:var(--space-24) 0;border:0;border-bottom:1px solid var(--color-line);border-radius:0}.circle-feed-skeleton-list .feed-skeleton-content{flex-direction:column}.circle-feed-skeleton-list .feed-skeleton-thumb{aspect-ratio:16/10;flex-basis:auto;width:min(100%,240px);height:auto}.circle-feed-skeleton-list .feed-skeleton-footer{align-items:stretch;gap:var(--space-8);flex-direction:column}.circle-feed-skeleton-list .feed-skeleton-footer>span{justify-content:space-between}.circle-feed-post .feed-post-footer{align-items:stretch;gap:var(--space-8);flex-direction:column}.circle-feed-post .feed-metrics{justify-content:space-between;gap:0;width:100%;padding-top:0}.circle-detail-sidebar{display:none}}@media (pointer:coarse){.circle-login-button{min-height:var(--control-height-touch)}}@media (max-width:420px){.circle-feed-tabs{gap:var(--space-19)}.circle-feed-tabs>span{margin-left:auto}}.scroll-track{align-items:center;gap:var(--space-4);flex:auto;min-width:0;display:flex}.scroll-track-viewport{flex:auto;min-width:0}.scroll-track[data-overflow] .scroll-track-viewport{--scroll-fade:28px;-webkit-mask-image:linear-gradient(to right, transparent 0, var(--color-white) var(--scroll-fade), var(--color-white) calc(100% - var(--scroll-fade)), transparent 100%);-webkit-mask-image:linear-gradient(to right, transparent 0, var(--color-white) var(--scroll-fade), var(--color-white) calc(100% - var(--scroll-fade)), transparent 100%);mask-image:linear-gradient(to right, transparent 0, var(--color-white) var(--scroll-fade), var(--color-white) calc(100% - var(--scroll-fade)), transparent 100%)}.scroll-track[data-overflow] .scroll-track-viewport[data-at-start]{-webkit-mask-image:linear-gradient(to right, var(--color-white) calc(100% - var(--scroll-fade,28px)), transparent 100%);-webkit-mask-image:linear-gradient(to right, var(--color-white) calc(100% - var(--scroll-fade,28px)), transparent 100%);mask-image:linear-gradient(to right, var(--color-white) calc(100% - var(--scroll-fade,28px)), transparent 100%)}.scroll-track[data-overflow] .scroll-track-viewport[data-at-end]{-webkit-mask-image:linear-gradient(to right, transparent 0, var(--color-white) var(--scroll-fade,28px));-webkit-mask-image:linear-gradient(to right, transparent 0, var(--color-white) var(--scroll-fade,28px));mask-image:linear-gradient(to right, transparent 0, var(--color-white) var(--scroll-fade,28px))}.scroll-track[data-overflow] .scroll-track-viewport[data-at-start][data-at-end]{-webkit-mask-image:none;mask-image:none}.scroll-track-arrow{border:1px solid var(--color-control-border);border-radius:var(--radius-999);background:var(--color-surface);width:28px;height:28px;color:var(--color-muted);cursor:pointer;flex:none;place-items:center;display:none}@media (hover:hover){.scroll-track-arrow:hover:not(:disabled){border-color:var(--color-brand-ink);color:var(--color-brand-ink)}}.scroll-track-arrow:disabled{opacity:.35;cursor:default}@media (hover:hover) and (pointer:fine){.scroll-track[data-overflow] .scroll-track-arrow{display:grid}}
