/* Carbon Circle preview only. Existing site navigation and legacy feed are untouched. */
.hh-ui.cc-root { --hh-ui-primary:#065de8;--hh-ui-primary-hover:#054bbd;--hh-ui-primary-soft:#eef5ff;--hh-ui-accent:#065de8;--cc-blue:#065de8;--cc-muted:#65758f;--cc-rail-muted:#5f6b7d;--cc-border:#e9eef5;background:transparent;max-width:1280px;margin:0 auto;font-size:16px; }
.cc-root [hidden] { display:none!important; }
/* Focus still moves for reader/dialog accessibility; containers need no frame. */
.cc-root [role="dialog"][tabindex="-1"]:focus,
.cc-root .cc-reader-scroll:focus,.cc-root .cc-detail-section:focus,
.cc-root .cc-detail-answer-text:focus,.cc-root .cc-detail-answer[tabindex="-1"]:focus { outline:none; }
.cc-root a:focus:not(:focus-visible),.cc-root button:focus:not(:focus-visible),.cc-root summary:focus:not(:focus-visible),.cc-root [role="button"]:focus:not(:focus-visible) { outline:none; }
.hh-ui.cc-root[data-cc-focus-input="pointer"] a:focus,.hh-ui.cc-root[data-cc-focus-input="pointer"] button:focus,.hh-ui.cc-root[data-cc-focus-input="pointer"] summary:focus,.hh-ui.cc-root[data-cc-focus-input="pointer"] [role="button"]:focus { outline:none; }
.cc-root .cc-layout { display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start; }
.cc-root .cc-layout--board { grid-template-columns:180px minmax(0,1fr);max-width:1120px;margin-left:auto;margin-right:auto; }
.cc-root .cc-main { min-width:0; }
.cc-root .cc-board-mobile { display:none; }
.cc-root .cc-tabs-top,.cc-root .cc-sort-tabs { display:flex;align-items:center;min-height:56px;background:#fff;border:1px solid var(--cc-border);border-radius:8px;margin-bottom:4px;padding:0 16px; }
.cc-root .cc-tabs-top { justify-content:space-between;gap:16px; }
.cc-root .cc-tabs-top nav,.cc-root .cc-sort-tabs { gap:24px; }
.cc-root .cc-tabs-top nav { display:flex;align-self:stretch;align-items:stretch; }
.cc-root .cc-tabs-top a,.cc-root .cc-sort-tabs a { position:relative;display:flex;align-items:center;min-height:52px;font-size:16px;font-weight:500;color:var(--cc-muted);text-decoration:none;padding:0 8px;white-space:nowrap; }
.cc-root .cc-tabs-top a[aria-current],.cc-root .cc-sort-tabs a[aria-current] { color:var(--cc-blue); }
.cc-root .cc-tabs-top a[aria-current]:after,.cc-root .cc-sort-tabs a[aria-current]:after { content:'';position:absolute;height:3px;bottom:0;left:0;right:0;background:var(--cc-blue);border-radius:3px; }
.cc-root .cc-publish-entry { gap:4px;flex-shrink:0; }
.cc-root .cc-feed-toolbar { position:sticky;top:72px;z-index:20;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0 8px;min-height:56px;padding:0 12px;margin-bottom:4px;background:#fff;border:1px solid var(--cc-border);border-radius:8px; }
.cc-root .cc-feed-toolbar>.cc-sort-tabs { flex:1 1 auto;min-width:0;gap:16px;padding:0;margin:0;border:0; }
.cc-root .cc-feed-tools { display:flex;align-items:center;gap:8px;margin-left:auto;min-height:54px; }
.cc-root .cc-view-link { display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:4px 8px;color:var(--cc-muted);font-size:14px;text-decoration:none;white-space:nowrap; }
.cc-root .cc-view-caption { margin:8px 0 12px;color:var(--cc-muted);font-size:14px; }
.cc-root .cc-publish-short { display:none; }
.cc-root .cc-post { background:#fff;border:1px solid var(--cc-border);border-radius:8px;padding:16px 24px 8px;margin-bottom:2px;min-width:0; }
.cc-root .cc-post-meta { display:flex;align-items:center;gap:8px;color:var(--cc-muted);font-size:13px;min-height:24px;flex-wrap:wrap; }
.cc-root .cc-board-link { color:var(--cc-blue);font-weight:500;text-decoration:none;min-height:44px;display:inline-flex;align-items:center;gap:4px; }
.cc-root .cc-post-main { display:flex;gap:24px;align-items:flex-start;margin-top:4px; }
.cc-root .cc-post-copy { display:block;flex:1;min-width:0;text-decoration:none; }
.cc-root .cc-post-copy h2 { font-size:18px;line-height:1.5;font-weight:600;color:#111827;margin:0 0 4px;overflow-wrap:anywhere; }
.cc-root .cc-post-copy p { color:#526581;line-height:1.65;white-space:pre-line;max-height:5em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical; }
.cc-root .cc-answer-topic-heading { margin:0;font:inherit; }
.cc-root .cc-answer-topic { display:block;display:-webkit-box;min-height:44px;max-height:3em;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;color:#172039;font-size:18px;font-weight:600;line-height:1.5;text-decoration:none;overflow-wrap:anywhere; }
.cc-root .cc-answer-image-copy { display:block;text-decoration:none; }
.cc-root .cc-answer-post .cc-post-main { margin-top:0; }
.cc-root .cc-answer-post .cc-post-copy p { line-height:1.6;max-height:8em;-webkit-line-clamp:5; }
.cc-root .cc-read-more { display:inline-flex;align-items:center;min-height:44px;color:var(--cc-blue);font-size:14px;text-decoration:none; }
.cc-root .cc-answer-stat { cursor:default; }
.cc-root .cc-answer-stat svg { width:18px;height:18px; }
.cc-root .cc-pagination>p { margin:0 0 12px;font-size:14px; }
.cc-root .cc-pagination>a+a { margin-left:8px; }
.cc-root .cc-feed-end-actions { display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px; }
.cc-root .cc-feed-media { --cc-media-limit:480px;--cc-media-ratio:1.5;position:relative;width:100%;max-width:720px;width:min(100%,720px,var(--cc-media-source-width,720px),calc(var(--cc-media-limit) * var(--cc-media-ratio)));margin:12px auto 0; }
.cc-root .cc-media-stage { position:relative;width:100%;aspect-ratio:var(--cc-media-ratio);min-height:96px;max-height:var(--cc-media-limit);overflow:hidden;border-radius:8px;background:var(--hh-ui-bg-subtle,#f3f5f7);isolation:isolate; }
.cc-root .cc-feed-media--multiple { min-width:min(100%,160px); }
.cc-root .cc-feed-media--multiple .cc-media-stage { min-height:128px;touch-action:pan-y pinch-zoom; }
.cc-root .cc-media-stage img { display:block;width:100%;height:100%;object-fit:contain;cursor:zoom-in; }
@supports not (aspect-ratio:1) { .cc-root .cc-media-stage img { height:auto;max-height:var(--cc-media-limit); } }
.cc-root .cc-media-stage img:focus-visible { outline:3px solid var(--cc-blue);outline-offset:-3px; }
.cc-root .cc-feed-media.is-long .cc-media-stage img:not([hidden]) { object-fit:cover;object-position:center top; }
.cc-root .cc-feed-media.is-loading .cc-media-stage:after { content:'图片加载中…';position:absolute;inset:0;display:grid;place-items:center;color:var(--cc-muted);font-size:13px;pointer-events:none; }
.cc-root .cc-media-arrow.hh-ui-button { position:absolute;z-index:2;top:50%;transform:translateY(-50%);width:44px;min-width:44px;height:44px;padding:0;border:1px solid #d2d8e0;border-radius:50%;background:#fff;color:#172039; }
.cc-root .cc-media-arrow--prev { left:8px; }
.cc-root .cc-media-arrow--next { right:8px; }
.cc-root .cc-media-arrow:disabled { background:#f1f3f6;color:#8793a5;cursor:default;opacity:.75; }
.cc-root .cc-media-position { position:absolute;right:8px;top:8px;padding:4px 8px;border-radius:8px;background:rgba(17,24,39,.8);color:#fff;font-size:13px;pointer-events:none;font-variant-numeric:tabular-nums; }
.cc-root .cc-media-full.hh-ui-button { position:absolute;left:50%;bottom:8px;transform:translateX(-50%);min-height:44px;background:#fff;color:#172039;border:1px solid #d2d8e0;white-space:nowrap;z-index:2; }
.cc-root .cc-media-error { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;margin:0;padding:16px 48px;background:#f3f5f7;color:#526581;font-size:14px;text-align:center; }
/* Bounded post previews; the existing viewer retains the original images. */
.cc-root .cc-post-images { --cc-image-limit:400px;display:block;width:100%;max-width:360px;margin:8px 0 0; }
.cc-root .cc-post-image { position:relative;min-width:0;margin:0; }
.cc-root .cc-post-image-preview { position:relative;display:block;width:fit-content;max-width:100%;max-height:var(--cc-image-limit);min-width:44px;min-height:44px;padding:0;border:0;border-radius:8px;overflow:hidden;background:transparent;cursor:zoom-in; }
.cc-root .cc-post-image-preview img { display:block;width:auto;height:auto;max-width:100%;max-height:var(--cc-image-limit); }
.cc-root .cc-post-image.is-long .cc-post-image-preview { width:min(100%,var(--cc-image-natural-width,360px)); }
.cc-root .cc-post-image.is-long .cc-post-image-preview img { width:100%;height:auto;max-height:none; }
.cc-root .cc-post-image.is-loading .cc-post-image-preview,.cc-root .cc-post-image.is-error .cc-post-image-preview { width:100%;min-height:96px;aspect-ratio:1.5;background:var(--hh-ui-bg-subtle,#f3f5f7); }
.cc-root .cc-post-image.is-loading .cc-post-image-preview:after { content:'图片加载中…';position:absolute;inset:0;display:grid;place-items:center;color:var(--cc-muted);font-size:13px;pointer-events:none; }
.cc-root .cc-post-image.is-error .cc-post-image-preview { cursor:default; }
.cc-root .cc-post-image-preview:focus-visible { outline:2px solid var(--cc-blue);outline-offset:2px; }
.cc-root .cc-post-image-full { position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;min-height:44px;padding:4px 8px;background:rgba(17,24,39,.82);color:#fff;font-size:12px;font-weight:500;line-height:1.5;text-align:center;pointer-events:none; }
.cc-root .cc-post-image-error { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:4px;border-radius:8px;background:#f3f5f7;color:#526581;font-size:12px;line-height:1.5;text-align:center; }
.cc-root .cc-post-image-error .hh-ui-button { min-width:44px;min-height:44px;padding:4px 8px;font-size:13px; }
.cc-root .cc-post-images--multiple { position:relative;min-width:0;max-width:none;--cc-image-tile-size:176px; }
.cc-root .cc-post-images-strip { display:flex;flex-wrap:nowrap;gap:8px;align-items:flex-start;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch; }
.cc-root .cc-post-images-strip::-webkit-scrollbar { display:none; }
.cc-root .cc-post-images-strip>.cc-post-image { flex:0 0 auto; }
.cc-root .cc-post-images-strip:focus-visible { outline:2px solid var(--cc-blue);outline-offset:2px; }
.cc-root .cc-post-images-nav.hh-ui-button { position:absolute;top:50%;z-index:2;display:none;align-items:center;justify-content:center;width:44px;min-width:44px;height:44px;min-height:44px;padding:0;transform:translateY(-50%);border:1px solid var(--hh-ui-border,#d2d8e0);border-radius:50%;background:var(--hh-ui-surface,#fff);color:var(--hh-ui-text,#172039);box-shadow:0 2px 8px rgba(17,24,39,.14); }
.cc-root .cc-post-images-nav--prev { left:4px; }
.cc-root .cc-post-images-nav--next { right:4px; }
.cc-root .cc-post-images-nav[hidden] { display:none; }
@media(min-width:901px){
 .cc-root .cc-post-images-nav.hh-ui-button:not([hidden]){display:flex;}
}
.cc-root .cc-post-images--multiple .cc-post-image .cc-post-image-preview { width:var(--cc-image-preview-width,var(--cc-image-tile-size));height:var(--cc-image-preview-height,var(--cc-image-tile-size));min-width:0;min-height:0;max-width:none;max-height:none;aspect-ratio:auto;background:transparent; }
.cc-root .cc-post-images--multiple .cc-post-image-preview img { display:block;position:static;width:100%;height:100%;max-height:100%;object-fit:contain; }
.cc-root .cc-post-images--multiple .is-long .cc-post-image-preview img { inset:0 auto auto 0;width:100%;height:auto;max-height:none; }
.cc-root .cc-image-card>.cc-post-images { margin-top:0; }
@media(max-width:900px){.cc-root .cc-post-images{--cc-image-limit:350px;max-width:100%}}
/* Existing body-level lightbox, enhanced only for this private feed source. */
#_lb_overlay.cc-feed-lightbox .cc-feed-lightbox-close { position:fixed!important; }
#_lb_overlay.cc-feed-lightbox button { min-width:44px;min-height:44px; }
#_lb_overlay.cc-feed-lightbox button:focus-visible { outline:3px solid #fff;outline-offset:3px; }
#_lb_overlay.cc-feed-lightbox.cc-feed-lightbox-scroll { overflow-y:auto;overscroll-behavior:contain; }
#_lb_overlay.cc-feed-lightbox.cc-feed-lightbox-scroll>.cc-feed-lightbox-long { position:static!important;display:block;transform:none!important;width:min(90vw,900px);height:auto;max-height:none!important;margin:72px auto 24px;cursor:default!important; }
#_lb_overlay.cc-feed-lightbox .cc-feed-lightbox-long-slide { align-items:flex-start!important;overflow-y:auto;overscroll-behavior-y:contain; }
#_lb_overlay.cc-feed-lightbox .cc-feed-lightbox-long-slide>.cc-feed-lightbox-long { width:min(90vw,900px);height:auto;max-height:none!important;flex:none;margin:72px 0 24px;cursor:default!important; }
.cc-root .cc-actions { display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;margin-top:4px; }
.cc-root .cc-author { display:flex;align-items:center;gap:8px;min-width:0;max-width:40%;min-height:44px;color:#526581;text-decoration:none;font-size:14px; }
.cc-root .cc-author img { width:28px;height:28px;object-fit:cover;border-radius:50%;flex-shrink:0; }
.cc-root .cc-author span { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cc-root .cc-actions-right { display:flex;align-items:center;gap:12px; }
.cc-root .cc-action { display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:44px;color:#5b6d88;background:transparent;border:0;padding:4px;font-size:13px;cursor:pointer; }
.cc-root .cc-action.is-liked { color:#e11d48; }
.cc-root .cc-action.is-liked svg { fill:#e11d48; }
.cc-root .cc-action:disabled { opacity:.6;cursor:wait; }
.cc-root .cc-review { color:#854d0e;font-size:12px; }
.cc-root .cc-side-section { background:#fff;border:1px solid var(--cc-border);padding:16px;border-radius:12px;margin-bottom:16px; }
.cc-root .cc-side-section h2 { font-size:16px;font-weight:600;margin:0 0 16px; }
.cc-root .cc-section-heading { display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px; }
.cc-root .cc-section-heading h2 { margin:0; }
.cc-root .cc-text-button { background:none;border:0;padding:4px 8px;min-height:44px;min-width:44px;color:var(--cc-muted);font:inherit;font-size:14px;cursor:pointer; }
.cc-root .cc-board-row { display:flex;align-items:center;gap:8px;padding:8px 0; }
.cc-root .cc-board-entry { flex:1;min-width:0;display:flex;align-items:center;gap:12px;text-decoration:none;color:#172039; }
.cc-root .cc-board-entry strong { display:block;font-size:14px;font-weight:500;line-height:1.5; }
.cc-root .cc-board-entry small { display:block;font-size:12px;color:var(--cc-muted);margin-top:4px; }
.cc-root .cc-follow { min-height:44px;flex-shrink:0;border:0;border-radius:8px;padding:4px 12px;background:#eef5ff;color:var(--cc-blue);font-size:14px;cursor:pointer; }
.cc-root .cc-follow.is-following { background:#f3f4f6;color:#526581; }
.cc-root .cc-follow:disabled { cursor:wait; }
.cc-root .cc-empty { background:#fff;padding:40px 24px;text-align:center;border:1px solid var(--cc-border);border-radius:8px; }
.cc-root .cc-empty p { margin-bottom:16px; }
.cc-root .cc-pagination { text-align:center;padding:24px; }
.cc-root .cc-feed--images { columns:3;column-gap:16px; }
.cc-root .cc-feed--images>.cc-empty { column-span:all; }
.cc-root .cc-feed--images.cc-feed--masonry { display:grid;columns:auto;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1px;column-gap:16px;row-gap:0;align-items:start; }
.cc-root .cc-feed--masonry>.cc-image-card { display:block;margin:0; }
.cc-root .cc-image-card { display:inline-block;width:100%;break-inside:avoid;page-break-inside:avoid;margin-bottom:16px;background:#fff;border:1px solid var(--cc-border);border-radius:12px;overflow:hidden;vertical-align:top; }
.cc-root .cc-image-card>.cc-feed-media { width:100%;margin:0; }
.cc-root .cc-image-card .cc-media-stage { border-radius:0; }
.cc-root .cc-image-body { padding:8px 12px; }
.cc-root .cc-image-description { display:block;color:#172039;text-decoration:none;font-size:16px;max-height:4.8em;overflow:hidden;line-height:1.6;white-space:pre-line; }
.cc-root .cc-image-card .cc-actions { flex-wrap:wrap;gap:0; }
.cc-root .cc-image-card .cc-author { max-width:100%; }
.cc-root .cc-image-card .cc-actions-right { width:100%;justify-content:space-between;gap:4px; }
.cc-root .cc-image-card .cc-share span { display:none; }
.cc-root .cc-board-nav { display:flex;flex-direction:column;gap:4px;position:sticky;top:88px; }
.cc-root .cc-board-nav>a,.cc-root .cc-board-nav>button { display:flex;align-items:center;gap:12px;min-height:44px;text-align:left;padding:8px 12px;border:0;border-radius:8px;background:transparent;color:#172039;font:inherit;font-size:14px;font-weight:600;line-height:1.5;text-decoration:none;cursor:pointer; }
.cc-root .cc-board-nav [aria-current] { background:#eaf2ff;color:var(--cc-blue); }
.cc-root .cc-board-nav { min-width:0;max-height:calc(100vh - 112px);max-height:calc(100dvh - 112px);overflow-y:auto;scrollbar-width:thin;overscroll-behavior:contain; }
.cc-root .cc-nav-groups { min-width:0; }
.cc-root .cc-nav-group { min-width:0;border-top:1px solid var(--cc-border);margin-top:4px;padding-top:4px; }
.cc-root .cc-nav-group>summary { display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px;padding:8px 12px;border-radius:8px;list-style:none;cursor:pointer;color:var(--cc-rail-muted);font-size:13px;font-weight:600;line-height:1.538462; }
.cc-root .cc-nav-group>summary::-webkit-details-marker { display:none; }
.cc-root .cc-nav-group>summary>span { min-width:0;overflow-wrap:anywhere; }
.cc-root .cc-nav-group>summary>svg { flex:none;width:16px;height:16px;transform:rotate(-90deg); }
.cc-root .cc-nav-group[open]>summary>svg { transform:none; }
.cc-root .cc-nav-group>summary:hover { background:#f0f6ff; }
.cc-root .cc-nav-group>summary:focus-visible { outline:2px solid var(--cc-blue);outline-offset:-2px; }
.cc-root .cc-nav-group-content>a { display:flex;align-items:center;min-width:0;min-height:40px;padding:4px 12px 4px 28px;border-radius:8px;text-decoration:none;color:var(--cc-rail-muted);font-size:13px;font-weight:400;line-height:1.538462; }
.cc-root .cc-nav-group-content>a>span { min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cc-root .cc-nav-group-content>a[aria-current] { background:#eaf2ff;color:var(--cc-blue); }
.cc-root .cc-nav-group-content>a:focus-visible { outline:2px solid var(--cc-blue);outline-offset:-2px; }
.cc-root .cc-nav-group-content .cc-nav-empty { margin:0;padding:4px 12px 8px 28px;color:var(--cc-rail-muted);font-size:13px;line-height:1.6; }
.cc-root .cc-nav-group-content .cc-nav-empty>a { display:inline-flex;align-items:center;min-height:44px;padding:0;color:var(--cc-blue);font-size:13px; }
.cc-root .cc-personal-nav .cc-nav-group:first-child { margin-top:0;padding-top:0;border-top:0; }
@media(max-width:900px){.cc-root .cc-personal-nav .cc-nav-group-content>a{min-height:44px}}
.cc-root .cc-board-hero { display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-content:center;align-items:center;min-height:88px;padding:12px 16px;background:#fff;border:1px solid var(--cc-border);border-radius:8px;margin-bottom:16px; }
.cc-root .cc-board-info { display:contents; }
.cc-root .cc-board-hero h1 { grid-column:1;grid-row:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:22px;line-height:28px;font-weight:600;margin:0; }
.cc-root .cc-board-summary { grid-column:1;grid-row:2;display:flex;align-items:center;gap:8px;min-width:0;color:var(--cc-muted); }
.cc-root .cc-board-summary p { flex:1 1 0%;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:13px;line-height:18px;color:inherit; }
.cc-root .cc-board-stats { display:flex;flex:0 1 auto;flex-wrap:wrap;gap:0 4px;min-width:0;max-width:100%;font-size:13px;line-height:18px;color:inherit;font-variant-numeric:tabular-nums; }
.cc-root .cc-board-stats>span { white-space:nowrap; }
.cc-root .cc-board-actions { grid-column:2;grid-row:1;justify-self:end;display:flex;align-items:center;gap:4px; }
.cc-root .cc-board-actions .cc-follow { min-width:72px;min-height:44px;margin:0;white-space:nowrap; }
@media (max-width:640px) { .cc-root .cc-board-hero { padding:12px; }.cc-root .cc-board-hero h1 { font-size:18px;line-height:24px; }.cc-root .cc-board-summary { grid-column:1/-1; } }
.cc-root .cc-sidebar p { color:#526581;font-size:14px;line-height:1.8; }
.cc-root .cc-sidebar { position:sticky;top:var(--cc-sticky-top,88px);max-height:calc(100vh - var(--cc-sticky-top,88px) - 24px);max-height:calc(100dvh - var(--cc-sticky-top,88px) - 24px);overflow:auto;scrollbar-width:thin;overscroll-behavior:contain; }
.cc-root .cc-sidebar>.cc-side-section:last-child { margin-bottom:0; }
.cc-root .cc-rules { counter-reset:rule;list-style:none;padding:0; }
.cc-root .cc-rules li { position:relative;padding:0 0 16px 36px;color:#526581;font-size:14px;line-height:1.7; }
.cc-root .cc-rules li:before { counter-increment:rule;content:counter(rule);position:absolute;left:0;top:0;display:flex;align-items:center;justify-content:center;background:#f1f4f8;width:28px;height:28px;border-radius:50%;color:#172039; }
.cc-root .cc-overlay { position:fixed;top:0;right:0;bottom:0;left:0;z-index:10040;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(25,38,60,.5); }
.cc-root .cc-compose-dialog,.cc-root .cc-directory-dialog { width:100%;max-width:720px;max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);overflow:auto;background:#fff;border-radius:16px;padding:24px;box-shadow:var(--hh-ui-shadow-overlay); }
.cc-root .cc-compose-dialog { overflow:auto; }
.cc-root .cc-compose-header { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px; }
.cc-root .cc-compose-header h2 { margin:0;font-size:18px;font-weight:600; }
.cc-root .cc-compose-input { position:relative; }
.cc-root .cc-compose-input textarea { display:block;width:100%;min-height:220px;max-height:44vh;resize:vertical;padding:16px;border:1px solid var(--hh-ui-control-border);border-radius:12px;background:#fafbfd;font:inherit;font-size:16px;line-height:1.7;color:#172039; }
.cc-root .cc-compose-input textarea::placeholder { font-size:14px;font-weight:400;color:#65758f; }
.cc-root .cc-compose-tools { display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-top:16px; }
.cc-root .cc-add-image,.cc-root .cc-board-trigger { display:flex;align-items:center;gap:8px;border-color:#dce4ef;border-radius:24px;color:#526581; }
.cc-root .cc-add-image svg { color:var(--cc-blue); }
.cc-root .cc-board-trigger { background:#eef5ff;border-color:#bad3ff;color:#172039; }
.cc-root .cc-board-trigger span { white-space:normal; }
.cc-root .cc-board-picker { position:relative; }
.cc-root .cc-board-menu { position:absolute;left:0;top:calc(100% + 4px);z-index:2;width:300px;max-width:calc(100vw - 64px);background:#fff;border:1px solid #dce4ef;border-radius:12px;box-shadow:var(--hh-ui-shadow-overlay);padding:8px; }
.cc-root .cc-board-options { overflow:auto;max-height:264px;max-height:min(264px,30vh); }
.cc-root .cc-board-option { display:flex;align-items:center;gap:12px;min-height:44px;width:100%;border:0;border-radius:8px;background:transparent;padding:8px 12px;text-align:left;font:inherit;font-size:14px;color:#172039;cursor:pointer; }
.cc-root .cc-board-option:hover,.cc-root .cc-board-option[aria-pressed=true] { background:#f0f6ff; }
.cc-root .cc-board-check { margin-left:auto;color:var(--cc-blue);visibility:hidden; }
.cc-root .cc-board-option[aria-pressed=true] .cc-board-check { visibility:visible; }
.cc-root .cc-default-control { display:grid;grid-template-columns:1fr auto;border-top:1px solid #edf0f5;margin-top:8px;padding:12px;gap:4px 12px; }
.cc-root .cc-default-control label { display:flex;align-items:center;min-height:44px;font-size:14px;cursor:pointer; }
.cc-root .cc-default-control input { position:relative;appearance:none;-webkit-appearance:none;width:44px;height:44px;margin:0;cursor:pointer; }
.cc-root .cc-default-control input:before { content:'';position:absolute;left:0;top:10px;width:44px;height:24px;border-radius:24px;background:#b7c1d0; }
.cc-root .cc-default-control input:after { content:'';position:absolute;left:2px;top:12px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .15s; }
.cc-root .cc-default-control input:checked:before { background:var(--cc-blue); }
.cc-root .cc-default-control input:checked:after { transform:translateX(20px); }
.cc-root .cc-default-control p,.cc-root .cc-default-control>span { grid-column:1/-1;font-size:12px;color:var(--cc-muted); }
.cc-root .cc-image-previews { display:flex;gap:8px;flex-wrap:wrap;max-height:24vh;overflow:auto; }
.cc-root .cc-image-previews:not(:empty) { margin-top:16px; }
.cc-root .cc-image-preview { width:88px;height:88px;position:relative; }
.cc-root .cc-image-preview img { width:100%;height:100%;object-fit:cover;border-radius:8px; }
.cc-root .cc-remove-image { position:absolute;right:0;top:0;width:44px;height:44px;border:0;background:rgba(17,24,39,.65);border-radius:0 8px 0 8px;color:#fff;cursor:pointer; }
.cc-root .cc-directory-header { display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px; }
.cc-root .cc-directory-header h2 { font-size:20px;font-weight:600; }
.cc-root .cc-directory-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 24px; }
.cc-root .cc-sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.cc-root .cc-toast { position:fixed;bottom:32px;left:50%;transform:translateX(-50%);z-index:10060;max-width:calc(100vw - 32px);padding:12px 24px;background:#172039;color:#fff;border-radius:8px;font-size:14px;box-shadow:var(--hh-ui-shadow-overlay); }
.cc-root #commentModal button { min-width:44px;min-height:44px; }
.cc-root #commentModalCount { font-weight:600!important; }
@media (max-width:900px) { .cc-root .cc-board-mobile { display:flex;gap:8px;margin-bottom:8px; } }
@media (max-width:1199px) { .cc-root .cc-layout--board { grid-template-columns:144px minmax(0,1fr); }.cc-root .cc-layout--board .cc-sidebar { grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px; }.cc-root .cc-layout--board .cc-feed--images { columns:2; } }
@media (max-width:900px) { .cc-root .cc-layout { grid-template-columns:minmax(0,1fr); }.cc-root .cc-sidebar { grid-row:2; }.cc-root .cc-layout--board { grid-template-columns:minmax(0,1fr); }.cc-root .cc-board-nav { display:none; }.cc-root .cc-sidebar .cc-board-row { padding:8px 0; }.cc-root .cc-feed--images { columns:3; } }
@media (max-width:640px) { .cc-root .cc-tabs-top,.cc-root .cc-sort-tabs { padding:0 12px; }.cc-root .cc-tabs-top nav,.cc-root .cc-sort-tabs { gap:12px; }.cc-root .cc-publish-entry { padding:8px 12px;font-size:14px; }.cc-root .cc-post { padding:12px 12px 4px; }.cc-root .cc-post-main { gap:12px; }.cc-root .cc-post-copy h2 { font-size:16px; }.cc-root .cc-post-copy p { font-size:16px; }.cc-root .cc-thumbnail { flex-basis:96px;width:96px;height:80px; }.cc-root .cc-actions-right { gap:4px; }.cc-root .cc-action { font-size:12px;gap:4px; }.cc-root .cc-author { font-size:12px;max-width:35%; }.cc-root .cc-author img { width:24px;height:24px; }.cc-root .cc-share span { display:none; }.cc-root .cc-feed--images { columns:2;column-gap:12px; }.cc-root .cc-image-card { margin-bottom:12px; }.cc-root .cc-overlay { padding:16px;align-items:flex-start;overflow:auto;padding-top:64px; }.cc-root .cc-compose-dialog,.cc-root .cc-directory-dialog { padding:16px;max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px); }.cc-root .cc-compose-header { gap:8px; }.cc-root .cc-compose-header h2 { font-size:16px; }.cc-root .cc-compose-tools { gap:8px; }.cc-root .cc-compose-input textarea { min-height:180px;max-height:36vh; }.cc-root .cc-directory-grid { grid-template-columns:minmax(0,1fr); }.cc-root .cc-layout--board .cc-sidebar { display:block; }.cc-root .cc-board-options { max-height:176px; }.cc-root .cc-board-menu { width:280px; }.cc-root .cc-default-control input { min-height:28px; }.cc-root .cc-compose-tools .hh-ui-button { font-size:13px;padding:8px 12px; } }

/* Reading stays in the community. Media is controlled by the global player. */
.cc-root .cc-reader-overlay { top:calc(var(--cc-sticky-top,88px) - 16px);padding-top:16px;padding-bottom:24px; }
.cc-root .cc-reader-dialog { display:flex;flex-direction:column;width:100%;max-width:880px;max-height:100%;min-height:264px;overflow:hidden;overflow:clip;background:#fff;border:1px solid var(--cc-border);border-radius:16px;box-shadow:var(--hh-ui-shadow-overlay); }
.cc-root .cc-reader-header { position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:16px;flex:none;padding:8px 24px;border-bottom:1px solid var(--cc-border);background:#fff; }
.cc-root .cc-reader-header h2 { flex:1;min-width:0;font-size:16px;line-height:1.5;font-weight:600;margin:0;overflow-wrap:anywhere; }
.cc-root .cc-reader-header button { min-width:44px;flex:none; }
.cc-root .cc-reader-dialog[data-reader-kind="topic"] .cc-detail-body>.cc-detail-title,
.cc-root .cc-reader-dialog[data-reader-kind="moment"] .cc-detail-body>.cc-detail-title { display:none; }
.cc-root .cc-reader-back { font-size:28px;line-height:1; }
.cc-root .cc-reader-scroll { min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scroll-padding:24px; }
.cc-root .cc-reader-message { text-align:center;color:var(--cc-muted);padding:48px 24px; }
.cc-root .cc-reader-message p { margin-bottom:16px; }
.cc-root .cc-detail-actions { display:flex;align-items:center;flex-wrap:wrap;gap:4px 16px;min-height:44px;margin-top:12px; }
.cc-root .cc-detail-actions .cc-action { font-size:14px;white-space:nowrap; }
.cc-root .cc-detail-actions .cc-action svg { width:20px;height:20px;flex:none; }
.cc-root .cc-detail-body { padding:12px 24px 24px;overflow-wrap:anywhere; }
.cc-root .cc-detail-meta,.cc-root .cc-detail-comment-meta { display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--cc-muted);font-size:13px; }
.cc-root .cc-detail-meta .cc-author,.cc-root .cc-detail-comment-meta .cc-author { max-width:65%;font-size:14px; }
.cc-root .cc-detail-meta { gap:0 8px;margin-bottom:8px; }
.cc-root .cc-detail-meta .cc-author { max-width:100%;font-size:13px;font-weight:500; }
.cc-root .cc-detail-meta .cc-author img { width:32px;height:32px; }
.cc-root .cc-detail-meta .cc-author span { overflow:visible;text-overflow:clip;white-space:normal;overflow-wrap:anywhere; }
.cc-root .cc-detail-time { white-space:nowrap; }
.cc-root .cc-detail-meta .cc-board-link { font-size:13px; }
.cc-root .cc-detail-topic-label { padding:2px 8px;border-radius:4px;background:#f3f5f8;color:#65758f;font-size:12px;line-height:20px;white-space:nowrap; }
.cc-root .cc-detail-title { font-size:24px;font-weight:600;line-height:1.5;color:#172039;margin:12px 0 16px; }
.cc-root .cc-source-question { display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin:0 0 12px;border-bottom:1px solid var(--cc-border); }
.cc-root .cc-source-link { display:inline-flex;align-items:center;min-height:44px;color:var(--cc-muted);font-size:14px;text-decoration:none; }
.cc-root .cc-source-question>.hh-ui-button { flex:none;white-space:nowrap; }
.cc-root .cc-detail-text,.cc-root .cc-detail-answer-text,.cc-root .cc-detail-comment-text { font-size:16px;line-height:1.6;color:#263449;white-space:normal;overflow-wrap:anywhere; }
.cc-root .cc-detail-images { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:16px; }
.cc-root .cc-detail-images img { display:block;width:100%;max-height:560px;height:auto;object-fit:contain;border-radius:8px;background:#f6f8fb;cursor:zoom-in; }
.cc-root .cc-detail-images:has(>img:only-child) { grid-template-columns:minmax(0,1fr); }
.cc-root .cc-detail-section { margin-top:8px;padding-top:8px;border-top:1px solid var(--cc-border); }
.cc-root .cc-detail-section h3 { margin:0 0 12px;font-size:18px;font-weight:600; }
.cc-root .cc-detail-section h3 span { margin-left:4px;color:var(--cc-muted);font-size:14px;font-weight:400; }
.cc-root .cc-detail-discussion-heading { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px; }
.cc-root .cc-detail-discussion-heading h3 { margin:0; }
.cc-root .cc-discussion-sort { display:flex;align-items:center;gap:4px;flex-shrink:0; }
.cc-root .cc-discussion-sort .cc-text-button { position:relative; }
.cc-root .cc-discussion-sort [aria-pressed="true"] { color:var(--cc-blue);font-weight:600; }
.cc-root .cc-discussion-sort [aria-pressed="true"]:after { content:'';position:absolute;bottom:0;left:8px;right:8px;height:2px;border-radius:2px;background:var(--cc-blue); }
.cc-root .cc-comment-sort { width:auto;min-height:44px;max-width:180px;font-size:14px; }
.cc-root .cc-detail-comment-form { display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:12px; }
.cc-root .cc-detail-comment-form textarea { width:100%;min-height:44px;resize:vertical;font:inherit;line-height:1.6; }
.cc-root .cc-detail-comment-form[data-cc-expanded="true"] textarea { min-height:100px; }
.cc-root .cc-comment-label { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
.cc-root .cc-comment-compose-actions { display:flex;align-items:center;justify-content:flex-end;gap:8px;width:100%; }
.cc-root .cc-comment-compose-actions:has(>button:not([hidden])) { min-height:44px; }
.cc-root .cc-comment-actions { display:flex;align-items:center;gap:8px;min-height:44px; }
.cc-root .cc-comment-actions .cc-action { font-size:13px; }
.cc-root .cc-comment-menu { position:relative; }
.cc-root .cc-comment-menu summary { list-style:none;cursor:pointer; }
.cc-root .cc-comment-menu summary::-webkit-details-marker { display:none; }
.cc-root .cc-comment-menu-panel { position:absolute;left:0;top:100%;z-index:4;min-width:88px;padding:4px;background:#fff;border:1px solid var(--cc-border);border-radius:8px;box-shadow:var(--hh-ui-shadow-overlay); }
.cc-root .cc-reply-expander { white-space:nowrap; }
.cc-root .cc-reply-expander[aria-expanded="false"] .cc-replies-hide,.cc-root .cc-reply-expander[aria-expanded="true"] .cc-replies-show { display:none; }
.cc-root .cc-detail-comment-form>.hh-ui-button { align-self:flex-end; }
.cc-root .cc-detail-comment-form label { margin:0; }
.cc-root .cc-detail-comment-error { color:var(--hh-ui-danger);font-size:14px; }
.cc-root .cc-detail-reply-target { display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;width:100%;font-size:14px;color:var(--cc-blue); }
.cc-root .cc-detail-thread { padding:8px 0;border-bottom:1px solid var(--cc-border); }
.cc-root .cc-detail-thread:last-child { border-bottom:0; }
.cc-root .cc-detail-answer { padding:0;border:0; }
.cc-root .cc-detail-answer-text[data-cc-answer-collapsed="true"] { max-height:12.8em;overflow:hidden; }
.cc-root .cc-answer-expand { display:block;padding-left:0;color:var(--cc-blue); }
.cc-root .cc-answer-expand[hidden] { display:none; }
.cc-root .cc-focused-answer { margin-bottom:12px;padding:8px 12px;border-left:2px solid var(--cc-blue);background:#f7faff;border-radius:4px; }
.cc-root .cc-focused-label { margin:0;color:var(--cc-muted);font-size:13px;line-height:1.6; }
.cc-root .cc-detail-answer .cc-detail-comment-meta .cc-author { max-width:75%; }
.cc-root .cc-detail-comment-text,.cc-root .cc-detail-answer-text { margin:4px 0 0;line-height:1.6; }
.cc-root .cc-detail-comment-meta { flex-wrap:nowrap; }
.cc-root .cc-detail-comment-meta .cc-author { min-width:0;max-width:calc(100% - 138px); }
.cc-root .cc-detail-comment:not(.cc-detail-answer) .cc-detail-comment-meta .cc-author { max-width:calc(100% - 88px);min-height:32px;font-weight:600; }
.cc-root .cc-detail-comment-meta .cc-author img { width:32px;height:32px; }
.cc-root .cc-detail-comment-meta>span { flex-shrink:0; }
.cc-root .cc-detail-reply { display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;margin-left:auto;min-height:44px;min-width:44px;background:none;border:0;padding:4px 8px;color:var(--cc-muted);font:inherit;font-size:14px;cursor:pointer; }
.cc-root .cc-detail-thread .cc-detail-images { margin-top:8px; }
.cc-root .cc-detail-comment-parent { margin-top:4px;font-size:13px;color:var(--cc-muted); }
.cc-root .cc-detail-replies { border-left:2px solid var(--cc-border);margin:4px 0 0 8px;padding-left:12px; }
.cc-root .cc-detail-replies .cc-detail-comment+.cc-detail-comment { margin-top:8px; }
.cc-root .cc-detail-empty { font-size:14px;color:var(--cc-muted);padding:16px 0; }
.cc-root .cc-answer-compose { margin:8px 0 16px; }
.cc-root .cc-answer-note { margin:0 0 8px; }
.cc-root .cc-answer-attachments { width:100%; }
.cc-root .cc-answer-file-grid { display:flex;flex-wrap:wrap;gap:8px;margin:8px 0; }
.cc-root .cc-answer-file { display:block;position:relative;width:80px;height:80px; }
.cc-root .cc-answer-file img { width:100%;height:100%;object-fit:cover;border-radius:8px; }
.cc-root .cc-answer-file button { position:absolute;right:-4px;top:-4px;min-width:44px;min-height:44px;padding:0;background:#fff; }
.cc-root .cc-answer-upload { position:relative;overflow:hidden;cursor:pointer; }
.cc-root .cc-answer-upload input { position:absolute;inset:0;opacity:0;cursor:pointer;width:100%; }
.cc-root .cc-answer-actions { flex-wrap:wrap;gap:4px 8px; }
.cc-root .cc-answer-actions>.cc-comment-menu { margin-left:auto; }
.cc-root .cc-answer-discussion { margin:4px 0 8px 8px;padding:8px 0 0 12px;border-left:2px solid var(--cc-border); }
.cc-root .cc-answer-discussion>.cc-detail-comment-form { margin-top:4px;margin-bottom:4px;gap:4px; }
.cc-root .cc-answer-discussion>.cc-detail-comment-form[data-cc-expanded="true"] textarea { min-height:44px; }
.cc-root .cc-answer-discussion .hh-ui-button--primary:disabled { background:#b6c9e7;border-color:#b6c9e7;color:#1d3b62; }
.cc-root .cc-topic-discussion-summary { display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;font-size:16px;font-weight:600; }
.cc-root .cc-topic-discussion-summary>.hh-ui-help { margin-left:auto;font-weight:400; }
.cc-root .cc-topic-discussion[open]>.cc-topic-discussion-summary { margin-bottom:12px; }
.cc-root .cc-topic-discussion-toolbar { justify-content:flex-end; }
.cc-root .cc-ai-mention-label { display:flex;align-items:center;gap:8px;flex-wrap:wrap; }
.cc-root .cc-ai-mention-label select { width:auto;max-width:180px;min-height:44px; }
.cc-root .cc-answer-discussion .cc-detail-discussion-heading,.cc-root .cc-topic-discussion .cc-detail-discussion-heading { align-items:flex-start; }
.cc-root [data-cc-comments-more],.cc-root [data-cc-answers-more] { margin-top:16px; }
.cc-root .cc-profile-header { display:flex;align-items:flex-start;gap:16px;padding:24px 32px;border-bottom:1px solid var(--cc-border); }
.cc-root .cc-profile-avatar { width:64px;height:64px;flex:none;border-radius:50%;object-fit:cover; }
.cc-root .cc-profile-summary { flex:1;min-width:0;overflow-wrap:anywhere; }
.cc-root .cc-profile-summary h1 { margin:0 0 8px;font-size:24px;font-weight:600;line-height:1.5; }
.cc-root .cc-profile-bio { font-size:14px;line-height:1.7;color:var(--cc-muted);white-space:pre-line; }
.cc-root .cc-profile-stats { display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;font-size:13px;color:var(--cc-muted); }
.cc-root .cc-profile-stats strong { color:#263449;font-weight:600; }
.cc-root .cc-profile-feed { padding:16px; }
.cc-root .cc-profile-feed .cc-image-card { display:block; }
.cc-root .cc-profile-feed .cc-feed-media { width:min(100%,720px,var(--cc-media-source-width,720px),calc(var(--cc-media-limit) * var(--cc-media-ratio))); }
/* Post music presentation stays inside the community; shared music surfaces retain their own styles. */
.cc-root .cc-music-player { display:flex;align-items:center;gap:12px;padding:0;margin:4px 0;background:transparent;border:0;min-width:0; }
.cc-root .cc-music-cover { position:relative;display:flex;align-items:center;justify-content:center;flex:0 0 56px;width:56px;height:56px;border:0;border-radius:8px;background:#f6e7ed;color:#fff;overflow:hidden;cursor:pointer; }
.cc-root .cc-music-cover:after { position:absolute;inset:0;content:'';background:rgba(17,24,39,.3); }
.cc-root .cc-music-cover img { position:absolute;inset:0;width:100%;height:100%;object-fit:cover; }
.cc-root .cc-music-cover svg { position:relative;z-index:1;width:24px;height:24px; }
.cc-root .cc-music-body { min-width:0;flex:1;display:grid;grid-template-columns:minmax(44px,1fr) auto;align-items:center;column-gap:8px; }
/* Keep the main cover control large; the duplicate title and wide seek use independent compact targets. */
.cc-root .cc-music-title { grid-column:1/-1;grid-row:1;display:flex;align-items:flex-end;min-height:24px;width:100%;text-align:left;background:none;border:0;padding:0;font:inherit;font-size:16px;font-weight:500;line-height:1.5;color:#202837;cursor:pointer;overflow-wrap:anywhere; }
.cc-root .cc-music-progress { grid-column:1;grid-row:2;display:flex;align-items:center;min-width:44px;min-height:28px; }
.cc-root [data-cc-music-seek] { --cc-music-progress:0%;appearance:none;-webkit-appearance:none;display:block;width:100%;height:28px;margin:0;padding:0;border:0;background:transparent;cursor:pointer; }
.cc-root [data-cc-music-seek]::-webkit-slider-runnable-track { height:4px;border-radius:999px;background:linear-gradient(to right,var(--cc-blue) 0 var(--cc-music-progress),#e3e9f2 var(--cc-music-progress) 100%); }
.cc-root [data-cc-music-seek]::-webkit-slider-thumb { -webkit-appearance:none;width:12px;height:12px;margin-top:-4px;border:0;border-radius:50%;background:var(--cc-blue); }
.cc-root [data-cc-music-seek]::-moz-range-track { height:4px;border-radius:999px;background:#e3e9f2; }
.cc-root [data-cc-music-seek]::-moz-range-progress { height:4px;border-radius:999px;background:var(--cc-blue); }
.cc-root [data-cc-music-seek]::-moz-range-thumb { width:12px;height:12px;border:0;border-radius:50%;background:var(--cc-blue); }
.cc-root [data-cc-music-seek]:disabled { cursor:default; }
.cc-root [data-cc-music-seek]:disabled::-webkit-slider-thumb { background:#94a3b8; }
.cc-root [data-cc-music-seek]:disabled::-moz-range-thumb { background:#94a3b8; }
.cc-root .cc-music-meta { grid-column:2;grid-row:2;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:0;font-size:12px;line-height:1.5;color:#667085; }
.cc-root .cc-music-timing { white-space:nowrap; }
.cc-root .cc-music-player button:focus-visible,.cc-root [data-cc-music-seek]:focus-visible { outline:2px solid var(--cc-blue);outline-offset:2px; }
.cc-root .cc-music-player[data-state="error"] .cc-music-status { color:var(--hh-ui-danger); }
.cc-root .cc-music-player[data-state="loading"] .cc-music-cover svg { opacity:.4; }
.cc-root .cc-music-player[data-state="unavailable"] { opacity:.7; }
.cc-root .cc-music-player button:disabled { cursor:default; }
.cc-root .cc-post.cc-music-share { padding-top:8px;padding-bottom:4px; }
.cc-root .cc-music-share .cc-music-player { gap:8px; }
/* Keep music in its existing masonry column; never create a cross-column shelf. */
.cc-root .cc-image-card.cc-music-share .cc-music-player { display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:4px 8px; }
.cc-root .cc-image-card.cc-music-share .cc-music-cover { grid-column:1;grid-row:1;flex-basis:44px;width:44px;height:44px; }
.cc-root .cc-image-card.cc-music-share .cc-music-body { display:contents; }
.cc-root .cc-image-card.cc-music-share .cc-music-title { grid-column:2;grid-row:1;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-height:3em;padding:0;overflow:hidden; }
.cc-root .cc-image-card.cc-music-share .cc-music-progress { grid-column:1/-1;grid-row:2; }
.cc-root .cc-image-card.cc-music-share .cc-music-meta { grid-column:1/-1;grid-row:3;flex-direction:row;align-items:center;justify-content:space-between;flex-wrap:wrap; }
.cc-root .cc-image-card.cc-music-share .cc-music-status { max-width:100%; }
.cc-root .cc-music-attachments { display:flex;justify-content:flex-end;margin-top:-4px; }
.cc-root .cc-music-attachment-trigger { display:inline-flex;align-items:center;gap:4px;white-space:nowrap; }
@media (max-width:1199px) { .cc-root .cc-layout--board .cc-sidebar { position:static;max-height:none;overflow:visible; } }
@media (min-width:901px) and (max-width:1199px) { .cc-root .cc-layout--board .cc-feed--masonry { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:900px) { .cc-root .cc-sidebar { position:static;max-height:none;overflow:visible; } }
@media (max-width:640px) {
 .cc-root .cc-feed-toolbar { padding:0 8px;gap:0 4px; }
 .cc-root .cc-feed-toolbar>.cc-sort-tabs { flex:0 0 auto;gap:0; }
 .cc-root .cc-feed-toolbar>.cc-sort-tabs a { min-width:44px;padding:0 6px;font-size:14px; }
 .cc-root .cc-feed-tools { gap:4px; }
 .cc-root .cc-feed-toolbar .cc-publish-entry { padding:8px; }
 .cc-root .cc-publish-label { display:none; }
 .cc-root .cc-publish-short { display:inline; }
 .cc-root .cc-feed-media { --cc-media-limit:420px; }
 .cc-root .cc-answer-topic { font-size:16px; }
 .cc-root .cc-reader-overlay { padding:0;overflow:hidden;overflow:clip; }
 .cc-root .cc-reader-dialog { height:100%;max-height:100%;border-radius:16px 16px 0 0;border-bottom:0; }
 .cc-root .cc-reader-header { padding:8px 12px; }
 .cc-root .cc-reader-dialog[data-reader-kind="topic"] .cc-reader-header h2 { font-size:16px; }
 .cc-root .cc-detail-body { padding:12px 16px 24px; }
 .cc-root .cc-detail-title { font-size:22px; }
 .cc-root .cc-detail-meta .cc-author { max-width:100%; }
 .cc-root .cc-detail-thread { padding:12px 0; }
 .cc-root .cc-detail-replies { padding-left:12px;margin-left:8px; }
 .cc-root .cc-profile-header { display:grid;grid-template-columns:48px minmax(0,1fr);padding:16px;gap:12px; }
 .cc-root .cc-profile-avatar { width:48px;height:48px; }
 .cc-root .cc-profile-summary h1 { font-size:22px; }
 .cc-root .cc-profile-header>[data-cc-user-follow] { grid-column:2;justify-self:start;margin-left:0; }
 .cc-root .cc-profile-feed { padding:8px; }
 .cc-root .cc-music-player { gap:8px; }
 .cc-root .cc-image-card .cc-music-player { flex-wrap:wrap; }
 .cc-root .cc-image-card .cc-music-body { flex-basis:100%; }
 .cc-root .cc-image-card .cc-music-status { margin-left:0;width:100%; }
 .cc-root .cc-image-card .cc-actions-right { width:calc(100% + 24px);max-width:none;margin-left:-12px;margin-right:-12px;gap:0; }
 .cc-root .cc-image-card .cc-actions-right>.cc-action { flex:1; }
 .cc-root .cc-feed--images.cc-feed--masonry { grid-template-columns:repeat(2,minmax(0,1fr));column-gap:12px; }
}
body:has(.cc-root #cc-reader:not([hidden])) #hh-music-bar,
body:has(.cc-root #cc-reader:not([hidden])) #hh-music-bar-pill { z-index:10050; }
body:has(#hh-music-bar:not([hidden])) .cc-root .cc-reader-overlay { padding-bottom:88px; }

/* Home and boards share a compact mixed feed; profile/reader media stay unchanged. */
.cc-root .cc-feed-post { padding:8px 16px 4px;margin-bottom:8px; }
.cc-root .cc-feed-meta { display:flex;align-items:center;gap:8px;min-width:0;max-width:100%;min-height:44px;overflow:hidden;color:var(--cc-muted);font-size:13px;white-space:nowrap; }
.cc-root .cc-feed-meta .cc-board-link { flex:0 1 auto;min-width:44px;max-width:40%;overflow:hidden; }
.cc-root .cc-feed-board-name,.cc-root .cc-feed-author span { display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cc-root .cc-feed-separator { flex:none; }
.cc-root .cc-feed-meta time { flex:none;font-size:13px; }
.cc-root .cc-feed-author { flex:1;display:inline-flex;align-items:center;gap:4px;min-width:44px;min-height:44px;overflow:hidden;color:var(--cc-muted);text-decoration:none; }
.cc-root .cc-feed-author img { width:20px;height:20px;flex:none;border-radius:50%;object-fit:cover; }
.cc-root .cc-feed-post .cc-post-copy { min-height:0; }
.cc-root .cc-feed-post .cc-post-copy p { margin:0;line-height:1.6;max-height:4.8em;-webkit-line-clamp:3;overflow-wrap:anywhere; }
.cc-root .cc-feed-attachments { display:flex;flex-wrap:wrap;gap:8px;margin-top:8px; }
.cc-root .cc-feed-attachments>span { display:block;flex:none; }
.cc-root .cc-feed-attachment { display:block;width:96px;height:72px;padding:0;border:1px solid var(--cc-border);border-radius:8px;overflow:hidden;background:var(--hh-ui-bg-subtle,#f3f5f7);cursor:zoom-in; }
.cc-root .cc-feed-attachment img { display:block;width:100%;height:100%;object-fit:cover;color:var(--cc-muted);font-size:13px; }
.cc-root .cc-feed-actions { display:flex;align-items:center;gap:16px;margin-top:4px; }
.cc-root .cc-feed-post .cc-music-player { margin:0; }
.cc-root .cc-feed-post .cc-music-player~.cc-feed-actions { margin-top:0; }
.cc-root .cc-feed-actions .cc-action { gap:4px;font-size:13px;text-decoration:none;white-space:nowrap; }
.cc-root .cc-feed-stat { cursor:default; }
.cc-root .cc-feed-meta a:focus-visible,.cc-root .cc-feed-post .cc-post-copy:focus-visible,.cc-root .cc-feed-actions .cc-action:focus-visible,.cc-root .cc-feed-attachment:focus-visible { outline:2px solid var(--cc-blue);outline-offset:2px; }
.cc-root .cc-feed-meta a:focus-visible { outline-offset:-2px; }
@media (max-width:640px) {
 .cc-root .cc-feed-post { padding:4px 12px; }
 .cc-root .cc-feed-meta { gap:4px; }
 .cc-root .cc-feed-meta .cc-board-link { max-width:35%; }
 .cc-root .cc-feed-attachment { width:72px;height:64px; }
 .cc-root .cc-feed-actions { gap:12px; }
}

/* Existing answer form, opened from the reader as a focused editor. */
.cc-root .cc-answer-editor-overlay { position:fixed;inset:0;z-index:10065;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(15,23,42,.45);overscroll-behavior:contain; }
.cc-root .cc-answer-editor-dialog { width:640px;max-width:100%;max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--cc-border);border-radius:16px;box-shadow:var(--hh-ui-shadow-overlay); }
.cc-root .cc-answer-editor-header { display:flex;align-items:center;gap:16px;flex:none;padding:12px 16px;border-bottom:1px solid var(--cc-border); }
.cc-root .cc-answer-editor-header h2 { flex:1;min-width:0;margin:0;font-size:18px;font-weight:600; }
.cc-root .cc-answer-editor-dialog .cc-detail-comment-form { min-height:0;overflow:auto;overscroll-behavior:contain;margin:0;padding:16px 24px;gap:12px; }
.cc-root .cc-answer-editor-topic { margin:0;font-size:16px;font-weight:500;line-height:1.6;overflow-wrap:anywhere; }
.cc-root .cc-answer-editor-dialog .cc-detail-comment-form textarea { min-height:240px;resize:vertical; }
.cc-root .cc-answer-editor-dialog .cc-comment-compose-actions { position:sticky;bottom:-16px;margin-top:4px;padding:12px 0 4px;background:#fff; }
@media (max-width:640px) {
 .cc-root .cc-answer-editor-overlay { padding:16px; }
 .cc-root .cc-answer-editor-dialog { max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px); }
 .cc-root .cc-answer-editor-dialog .cc-detail-comment-form { padding:16px; }
 .cc-root .cc-answer-editor-dialog .cc-detail-comment-form textarea { min-height:180px; }
}

/* Topic answers load on scroll; keep a keyboard-visible manual fallback. */
.cc-root .cc-answer-auto-more[data-cc-auto-enabled] { position:absolute;width:1px;height:1px;min-width:0;min-height:0;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0; }
.cc-root .cc-answer-auto-more[data-cc-auto-enabled]:focus-visible { position:static;width:auto;height:auto;min-width:44px;min-height:44px;padding:8px 16px;margin:0;overflow:visible;clip:auto;clip-path:none;white-space:normal; }

/* Keep the complete question and existing actions visible while reading. */
.cc-root .cc-reader-controls { display:flex;align-items:center;gap:4px;flex:none;margin-left:auto; }
.cc-root .cc-reader-write { min-height:44px;white-space:nowrap;font-size:14px;padding:8px 12px; }
.cc-root .cc-reader-controls>.hh-ui-button--quiet,.cc-root .cc-reader-more>summary { width:44px;height:44px;min-width:44px;min-height:44px;padding:0; }
.cc-root .cc-reader-more .cc-comment-menu-panel { left:auto;right:0;min-width:128px; }
.cc-root .cc-reader-more .cc-comment-menu-panel button { width:100%;white-space:nowrap; }
@media (max-width:640px) {
 .cc-root .cc-reader-dialog[data-reader-kind="topic"] .cc-reader-header,
 .cc-root .cc-reader-dialog[data-reader-kind="moment"] .cc-reader-header { flex-wrap:wrap;gap:4px 8px; }
 .cc-root .cc-reader-dialog[data-reader-kind="topic"] .cc-reader-header h2,
 .cc-root .cc-reader-dialog[data-reader-kind="moment"] .cc-reader-header h2 { flex:1 0 100%;order:-1; }
}

/* Only the homepage's hot-board rows; directory and board pages stay unchanged. */
.cc-root .cc-feed-actions--moderator { flex-wrap:wrap;gap:0 4px; }
.cc-root .cc-board-pin-label { margin:0;color:var(--cc-blue);font-size:12px;font-weight:600; }
.cc-root .cc-board-row.cc-board-row--compact { gap:8px;padding:4px 0; }
.cc-root .cc-board-row--compact .cc-board-entry { min-height:44px;gap:8px; }
.cc-root .cc-board-row--compact .cc-hot-board-copy { flex:1;min-width:0; }
.cc-root .cc-board-row--compact .cc-hot-board-copy strong,
.cc-root .cc-board-row--compact .cc-hot-board-copy small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cc-root .cc-board-row--compact .cc-hot-board-copy strong { font-size:14px;line-height:20px; }
.cc-root .cc-board-row--compact .cc-hot-board-copy small { margin-top:2px;font-size:13px;line-height:18px; }
.cc-root .cc-board-row--compact .cc-follow { position:relative;isolation:isolate;min-width:56px;width:56px;min-height:44px;height:44px;padding:0 6px;font-size:13px;line-height:20px;white-space:nowrap;background:transparent; }
.cc-root .cc-board-row--compact .cc-follow:before { content:'';position:absolute;inset:8px 0;z-index:-1;border-radius:8px;background:#eef5ff; }
.cc-root .cc-board-row--compact .cc-follow.is-following { color:#526581;background:transparent; }
.cc-root .cc-board-row--compact .cc-follow.is-following:before { background:#f3f4f6; }
.cc-root .cc-board-row--compact .cc-follow:focus-visible { outline:2px solid var(--cc-blue);outline-offset:2px; }

/* Optional community product attachment; public Store navigation only. */
.cc-root .cc-product-field { position:relative;width:200px;max-width:100%; }
.cc-root .cc-product-select-wrap { position:relative; }
.cc-root .cc-product-select-wrap>svg { position:absolute;right:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;pointer-events:none; }
.cc-root .cc-product-field select { display:block;appearance:none;-webkit-appearance:none;width:100%;min-width:0;height:44px;min-height:44px;padding:8px 36px 8px 12px;border:1px solid #bad3ff;border-radius:24px;background:#eef5ff;color:#172039;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.cc-root .cc-product-feedback { position:absolute;top:calc(100% + 4px);right:0;z-index:3;width:240px;max-width:calc(100vw - 64px);padding:8px 12px;background:#fff;border:1px solid var(--cc-border);border-radius:8px;box-shadow:var(--hh-ui-shadow-overlay); }
.cc-root .cc-product-feedback p { margin:0;overflow-wrap:anywhere; }

.cc-root .cc-product-card { display:inline-flex;align-items:center;align-self:flex-start;width:fit-content;max-width:100%;max-width:min(100%,320px);min-width:44px;min-height:44px;margin:2px 0;padding:0;border:0;color:var(--cc-muted);font-size:13px;font-weight:400;line-height:1.5;text-decoration:none;vertical-align:middle; }
.cc-root .cc-product-link { display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:100%;box-sizing:border-box;padding:6px 8px;border-radius:4px;background:var(--hh-ui-bg-subtle,#f3f5f7);white-space:nowrap; }
.cc-root .cc-product-label,.cc-root .cc-product-arrow { flex:none; }
.cc-root .cc-product-name { flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--cc-blue);font-weight:400; }
.cc-root .cc-product-card:focus-visible { outline:2px solid var(--cc-blue);outline-offset:2px;border-radius:4px; }
.cc-root .cc-product-card:hover .cc-product-name { text-decoration:underline; }

/* Board context stays fixed; introductions/rules use the existing modal flow. */
.cc-root .cc-board-summary { flex-wrap:wrap; }
.cc-root .cc-board-intro { display:flex;flex:1 1 100%;align-items:center;gap:8px;min-width:0;min-height:44px;padding:4px 0;border:0;background:transparent;color:inherit;text-align:left;font:inherit;font-size:13px;cursor:pointer; }
.cc-root .cc-board-intro>span { flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.cc-root .cc-board-intro:focus-visible { outline:2px solid var(--cc-blue);outline-offset:2px; }
.cc-root .cc-info-dialog { display:flex;flex-direction:column;width:100%;max-width:480px;max-height:calc(100vh - 48px);max-height:calc(100dvh - 48px);padding:24px;border-radius:16px;background:#fff;box-shadow:var(--hh-ui-shadow-overlay);overflow:hidden; }
.cc-root .cc-info-dialog .cc-directory-header { flex:none; }
.cc-root .cc-info-content { overflow:auto;overscroll-behavior:contain;overflow-wrap:anywhere;min-height:0;font-size:16px;line-height:1.6; }
.cc-root .cc-info-content h3 { margin:0 0 16px;font-size:18px;font-weight:600; }
.cc-root .cc-info-content p { margin:0; }
.cc-root .cc-board-intro-rules { margin-top:24px; }
.cc-root .cc-board-intro-rules .cc-rules { margin-bottom:0; }
.cc-root .cc-fixed-board { margin:0;min-height:44px;display:flex;align-items:center;flex-wrap:wrap;gap:4px;color:var(--cc-muted);font-size:14px; }
.cc-root .cc-fixed-board span { color:var(--cc-blue);overflow-wrap:anywhere; }
@media (max-width:900px) {
 .cc-root .cc-board-mobile { flex-wrap:nowrap; }
 .cc-root .cc-board-mobile>* { flex:1;min-width:0;padding:8px 4px;white-space:normal;overflow-wrap:anywhere; }
 .cc-root .cc-sidebar .cc-create-board-entry { display:none; }
 .cc-root .cc-info-dialog { padding:16px;max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px); }
}

/* Sharing stays beside following, without adding another text button. */
.cc-root .cc-board-hero .cc-board-summary { grid-column:1/-1;grid-row:2; }
.cc-root .cc-board-hero>.cc-board-stats { grid-column:1/-1;grid-row:3;color:var(--cc-muted); }
.cc-root .cc-board-share { flex:none;width:44px;height:44px;padding:0;border-radius:8px; }
.cc-root .cc-board-share:hover { background:#f3f4f6; }
.cc-root .cc-board-share:focus-visible { outline:2px solid var(--cc-blue);outline-offset:-2px; }
.cc-root .cc-image-preview-label { display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:8px;background:#eef5ff;color:var(--cc-muted);font-size:13px; }
.cc-root .cc-answer-file .cc-image-preview-label { padding:40px 4px 4px;border-radius:8px; }
.cc-root .cc-pagination [data-cc-more][data-cc-auto="true"]:not([data-cc-auto-failed]):not(:focus-visible) { opacity:0;pointer-events:none; }

/* Shared three-column frame for homepage and board pages. Older history DOM
   keeps its existing layout until it is replaced by the versioned frame. */
/* A viewport-height body clips the sticky header's containing block on long feeds. */
body:has(> #hh-main > #circle-community){height:auto}
/* Keep existing body-only modal locks effective without making body the sticky scrollport. */
html:has(> body[style*="overflow: hidden"] > #hh-main > #circle-community){overflow:hidden!important}
body:has(> #hh-main > #circle-community)[style*="overflow: hidden"]{overflow:clip!important}
@media(min-width:901px){
 #hh-main:has(> #circle-community){max-width:none}
 .hh-ui.cc-root{max-width:none}
}
.cc-root .cc-layout--stable{grid-template-columns:minmax(128px,15fr) minmax(0,65fr) minmax(192px,20fr);gap:24px;max-width:none;width:100%;margin:0}
.cc-root .cc-layout--stable>.cc-board-nav{grid-column:1;grid-row:1;align-self:start;position:sticky;top:var(--cc-rail-top,104px);max-height:calc(100vh - var(--cc-rail-top,104px) - 24px);max-height:calc(100dvh - var(--cc-rail-top,104px) - 24px);overflow-y:auto;overflow-x:hidden}
.cc-root .cc-layout--stable>.cc-main{grid-column:2;grid-row:1;min-width:0}
.cc-root .cc-layout--stable>.cc-sidebar{grid-column:3;grid-row:1;display:block;align-self:start;position:sticky;top:var(--cc-rail-top,104px);max-height:calc(100vh - var(--cc-rail-top,104px) - 24px);max-height:calc(100dvh - var(--cc-rail-top,104px) - 24px);overflow:auto;min-width:0}
.cc-root .cc-layout--stable>.cc-sidebar .cc-side-section{padding:12px}
.cc-root .cc-layout--stable>.cc-sidebar .cc-section-heading h2{font-size:15px;font-weight:600;line-height:1.4}
.cc-root .cc-layout--stable>.cc-sidebar .cc-section-heading .cc-text-button{font-size:12px;color:var(--cc-rail-muted);line-height:1.5}
.cc-root .cc-layout--stable>.cc-sidebar .cc-board-row--compact{padding:2px 0}
.cc-root .cc-layout--stable>.cc-sidebar .cc-board-row--compact .cc-follow{min-width:48px;width:auto;min-height:44px;height:auto;padding:0 6px;font-size:12px;line-height:1.5}
.cc-root .cc-layout--stable>.cc-sidebar .cc-board-row--compact .cc-follow:before{inset:10px 0}
.cc-root .cc-layout--stable>.cc-sidebar .cc-hot-board-copy strong{font-size:13px;font-weight:500;line-height:1.5}
.cc-root .cc-layout--stable>.cc-sidebar .cc-hot-board-copy small{font-size:12px;color:var(--cc-rail-muted);line-height:1.5}
@media(max-width:900px){
 .cc-root .cc-layout--stable{grid-template-columns:minmax(0,1fr)}
 .cc-root .cc-layout--stable>.cc-board-nav{display:none}
 .cc-root .cc-layout--stable>.cc-main{grid-column:1;grid-row:1}
 .cc-root .cc-layout--stable>.cc-sidebar{display:none}
}

/* Composer controls and the hot list's small inline new-board marker. */
.cc-root .cc-compose-tools .cc-add-image { width:44px;min-width:44px;min-height:44px;padding:0;justify-content:center; }
.cc-root .cc-add-product { display:inline-flex;align-items:center;gap:8px;min-height:44px; }
.cc-root .cc-board-name-line { display:flex;align-items:center;gap:4px;min-width:0; }
.cc-root .cc-board-entry>span { min-width:0; }
.cc-root .cc-board-name-line>strong { flex:0 1 auto;min-width:0; }
.cc-root .cc-directory-grid .cc-board-name-line>strong { overflow-wrap:anywhere; }
.cc-root .cc-board-new { flex:none;font-size:12px;font-weight:500;line-height:1.5;color:var(--cc-blue);pointer-events:none; }
.cc-root .cc-sidebar-extra-boards { margin-top:16px;padding-top:12px;border-top:1px solid var(--cc-border); }

@media (max-width:640px) { .cc-root .cc-compose-tools .cc-board-trigger,.cc-root .cc-compose-tools .cc-add-product { padding-inline:8px; } }

/* H5 uses the fixed inner page scroller and hides the global top navigation. */
@media(max-width:1023px){html.hh-mobile-nav-preview .cc-root .cc-feed-toolbar{top:0}}