.public-feed-body { margin: 0; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; color: var(--color-text); background: var(--color-bg); font-family: system-ui, sans-serif; }
.public-feed-body::before, .public-feed-body::after { display: none; }
.public-header { position: sticky; top: 0; z-index: 30; flex-shrink: 0; background: var(--color-bg-card); border-bottom: 1px solid var(--color-border); }
.public-header-inner { max-width: 1280px; margin: auto; padding: var(--spacing-md); display: flex; align-items: center; gap: var(--spacing-lg); }
.public-brand { display: flex; align-items: center; gap: var(--spacing-sm); font-size: 22px; font-weight: 700; white-space: nowrap; color: var(--color-text); text-decoration: none; }
.public-brand i { color: var(--color-primary); }
.public-nav { display: flex; align-items: center; gap: var(--spacing-lg); }
.public-nav a, .public-feed-tabs a { color: var(--color-text); text-decoration: none; padding: var(--spacing-md) 0; border-bottom: 2px solid transparent; white-space: nowrap; }
.public-feed-body [aria-current="page"] { color: var(--color-primary); }
.public-nav [aria-current], .public-feed-tabs [aria-current] { border-bottom-color: var(--color-primary); }
.public-search { display: flex; gap: var(--spacing-xs); align-items: center; margin-left: auto; min-width: 0; }
.public-search input { min-width: 0; width: 100%; }
.public-search-toggle { display: none; }
.public-login { white-space: nowrap; text-decoration: none; }
.public-workspace { white-space: nowrap; text-decoration: none; }
.public-account { flex-shrink: 0; }
.public-account #user-menu-trigger > i:first-child { color: var(--color-primary); font-size: 24px; }
.public-account-name { display: block; padding: var(--spacing-sm) var(--spacing-md); color: var(--color-text-secondary); overflow-wrap: anywhere; }
.public-entry { position: relative; }
.public-manage { float: right; margin-left: var(--spacing-sm); position: relative; z-index: 2; }
.public-manage summary { list-style: none; cursor: pointer; }
.public-manage summary::-webkit-details-marker { display: none; }
.public-manage > .header-dropdown-panel { position: absolute; right: 0; top: 100%; min-width: 160px; }
.public-manage .header-menu-item { width: 100%; text-decoration: none; border: 0; text-align: left; background: transparent; cursor: pointer; }
.public-note-actions { display: flex; align-items: center; flex-shrink: 0; gap: var(--spacing-xs); }
.public-bookmark-author { display: inline-flex; align-items: center; flex-shrink: 0; gap: var(--spacing-xs); margin-left: auto; }
.public-items-bookmark .bm-row-label-line { align-items: center; }
.public-entry-heading { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spacing-sm); }
.public-entry .public-entry-heading h2 { min-width: 0; margin: 0; }
.public-pinned { display: inline-flex; align-items: center; gap: var(--spacing-xs); flex-shrink: 0; }
.public-pinned i { line-height: 1; }
.public-entry:not(.public-book-card) .public-entry-heading h2 { display: inline; font-size: 14px; }
.public-content-type { display: inline-flex; align-items: center; flex-shrink: 0; }
.public-note-card .public-note { color: var(--color-text); font-size: 16px; line-height: 1.8; max-height: none; overflow: visible; white-space: normal; }
.public-note img { max-width: 100%; max-height: 240px; object-fit: contain; cursor: zoom-in; border-radius: var(--radius-md); }
.sh-note-text { color: var(--color-text); overflow-wrap: anywhere; }
.sh-note-text p { margin: 0 0 var(--spacing-sm); }
.sh-note-text p:last-child { margin-bottom: 0; }
.sh-note-text strong { font-weight: 600; }
.sh-note-text em { font-style: italic; }
.sh-note-text a { color: var(--color-primary); text-decoration: underline; }
.sh-note-text ul,.sh-note-text ol { padding-left: var(--spacing-lg); margin: var(--spacing-sm) 0; }
.sh-note-text ul { list-style: disc; }
.sh-note-text ol { list-style: decimal; }
.sh-note-text blockquote { border-left: 3px solid var(--color-primary); padding-left: var(--spacing-md); margin: var(--spacing-sm) 0; }
.public-note-card .sh-note-text :is(h1,h2,h3,h4,h5,h6) { display: block; font-weight: 600; line-height: 1.5; margin: var(--spacing-md) 0 var(--spacing-sm); }
.public-note-card .sh-note-text h1 { font-size: 20px; }
.public-note-card .sh-note-text h2 { font-size: 18px; }
.public-note-card .sh-note-text :is(h3,h4,h5,h6) { font-size: 16px; }
.sh-note-text img { max-width: 100%; }
.sh-note-text pre { max-width: 100%; overflow-x: auto; padding: var(--spacing-md); background: var(--color-bg-hover); border-radius: var(--radius-md); }
.sh-note-text pre code { white-space: pre; }
.sh-note-text .code-block-header { display: flex; align-items: center; gap: var(--spacing-sm); }
.sh-note-text .code-copy-btn { margin-left: auto; }
.sh-note-text table { display: block; overflow-x: auto; max-width: 100%; }
.sh-note-text :is(th,td) { padding: var(--spacing-sm); border: 1px solid var(--color-border); }
.public-feed .sh-note-comments { margin-top: var(--spacing-md); padding: var(--spacing-md); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); background: var(--color-bg); font-size: 13px; }
.sh-note-comments .share-comments-head { display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-sm); padding-bottom: var(--spacing-sm); border-bottom: 1px solid var(--color-border-light); }
.sh-note-comments .share-comments-title { display: flex; align-items: center; gap: var(--spacing-sm); margin: 0; font-size: 13px; font-weight: 500; color: var(--color-text-secondary); }
.sh-note-comments .share-comments-title i { font-size: 13px; }
.sh-note-comments .share-comments-count { font-size: 12px; font-weight: 400; }
.sh-note-comments .public-comments-collapse { display: inline-flex; align-items: center; gap: var(--spacing-xs); width: auto; padding: var(--spacing-xs); font-size: 12px; color: var(--color-text-secondary); }
.sh-note-comments .public-comments-collapse i { font-size: 10px; }
.sh-note-comments .share-comments-list { display: flex; flex-direction: column; gap: var(--spacing-sm); margin: var(--spacing-md) 0; }
.sh-note-comments .share-comments-list>.share-comments-state { text-align: center; }
.sh-note-comments .share-comments-state,.sh-note-comments .share-comments-identity { color: var(--color-text-secondary); font-size: 12px; overflow-wrap: anywhere; }
.sh-note-comments .public-comment-composer { display: grid; grid-template-columns: minmax(0,1fr); gap: var(--spacing-sm); }
.sh-note-comments .public-comment-composer.is-account { grid-template-columns: 32px minmax(0,1fr); }
.sh-note-comments .public-comment-avatar { display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-full); color: var(--color-primary); background: var(--color-primary-light); }
.sh-note-comments .is-account>textarea,.sh-note-comments .is-account>.share-comments-actions { grid-column: 2; }
.sh-note-comments .public-comment-nickname { display: flex; align-items: center; flex-wrap: wrap; gap: var(--spacing-sm); color: var(--color-text-secondary); font-size: 12px; }
.sh-note-comments .public-comment-nickname input { width: min(220px,100%); min-width: 0; font-size: 13px; }
.sh-note-comments .share-comment-textarea { width: 100%; min-width: 0; min-height: 64px; resize: vertical; font-size: 14px; line-height: 1.6; }
.sh-note-comments .share-comments-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spacing-sm); }
.sh-note-comments .share-comments-actions .share-comments-state { flex: 1; }
.sh-note-comments .share-comments-submit { margin-left: auto; min-height: 32px; flex-shrink: 0; color: var(--color-on-primary); }
.sh-note-comments .share-comments-submit:disabled { opacity: .6; cursor: not-allowed; }
.sh-note-comments .share-comment-item { padding: var(--spacing-sm) 0; border-bottom: 1px solid var(--color-border-light); }
.sh-note-comments .share-comment-meta { display: flex; align-items: center; justify-content: space-between; gap: var(--spacing-sm); margin-bottom: var(--spacing-xs); }
.sh-note-comments .share-comment-author { color: var(--color-text-secondary); font-size: 13px; font-weight: 500; }
.sh-note-comments .share-comment-time { color: var(--color-text-secondary); font-size: 11px; }
.sh-note-comments .share-comment-content { color: var(--color-text); font-size: 14px; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.7; }
.sh-note-comments .share-comment-content.is-deleted { color: var(--color-text-secondary); }
.sh-note-comments .share-comment-tools { display: flex; flex-shrink: 0; gap: var(--spacing-xs); }
.sh-note-comments :is(.share-comment-reply,.share-comment-delete,.share-comment-replies-toggle) { border: 0; background: transparent; color: var(--color-text-secondary); padding: var(--spacing-xs); font-size: 12px; cursor: pointer; border-radius: var(--radius-sm); }
.sh-note-comments :is(.share-comment-reply,.share-comment-delete,.share-comment-replies-toggle):hover { background: var(--color-bg-hover); color: var(--color-primary); }
.sh-note-comments .share-comment-delete:hover { color: var(--color-danger); }
.sh-note-comments .share-comment-replies { margin-left: var(--spacing-md); padding-left: var(--spacing-sm); border-left: 1px solid var(--color-border); }
.sh-note-comments .share-comment-reply-context { color: var(--color-text-secondary); font-size: 12px; grid-column: 1 / -1; }
.sh-note-comments .share-comment-reply-form { margin: var(--spacing-sm) 0; }
.sh-note-comments :is(button,input,textarea):focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.public-feed-body a:focus-visible, .public-feed-body summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.public-layout { flex: 1; width: 100%; max-width: 1280px; margin: 0 auto; padding: var(--spacing-lg) var(--spacing-md); display: grid; grid-template-columns: 180px minmax(0,1fr) 240px; gap: var(--spacing-lg); align-items: start; }
.public-categories { min-width: 0; background: var(--color-bg-card); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); padding: var(--spacing-sm); }
.public-categories a i { width: 18px; text-align: center; flex-shrink: 0; color: var(--color-text-secondary); }
.public-categories a[aria-current] i { color: var(--color-primary); }
.public-categories summary { display: none; cursor: pointer; }
.public-categories nav { display: flex; flex-direction: column; gap: var(--spacing-xs); }
.public-categories a { display: flex; gap: var(--spacing-md); align-items: center; padding: var(--spacing-md); border-radius: var(--radius-md); color: var(--color-text); text-decoration: none; overflow-wrap: anywhere; }
.public-categories a[aria-current] { background: var(--color-primary-light); }
.public-categories a:hover { background: var(--color-bg-hover); }
.public-feed { align-self: stretch; display: flex; flex-direction: column; background: var(--color-bg-card); border-radius: var(--radius-lg); padding: 0 var(--spacing-lg); min-width: 0; }
.public-page-title { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.public-feed-tabs { display: flex; gap: var(--spacing-lg); border-bottom: 1px solid var(--color-border); }
.public-entry { padding: var(--spacing-lg) 0; border-bottom: 1px solid var(--color-border-light); overflow-wrap: anywhere; }
.public-entry h2 { font-size: 19px; font-weight: 600; line-height: 1.5; margin: 0 0 var(--spacing-sm); }
.public-entry h2 a { color: var(--color-text); text-decoration: none; }
.public-entry h2 a:hover { color: var(--color-primary); }
.public-excerpt { color: var(--color-text); font-size: 15px; line-height: 1.8; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: var(--spacing-sm) 0; }
.public-note-author { display: flex; flex-wrap: wrap; align-items: center; gap: var(--spacing-sm); color: var(--color-text-secondary); font-size: 13px; margin-bottom: var(--spacing-md); }
.public-note-author-name { min-width: 0; max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.public-note-author > i { background: var(--color-primary-light); color: var(--color-primary); padding: var(--spacing-sm); border-radius: var(--radius-lg); }
.public-note-author time { margin-left: auto; color: var(--color-text-muted); font-size: 12px; }
.public-read-link { display: inline-flex; align-items: center; gap: var(--spacing-sm); color: var(--color-primary); text-decoration: none; font-size: 13px; margin-top: var(--spacing-md); }
.public-read-link:hover { text-decoration: underline; }
.public-items-book { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: var(--spacing-lg); padding-top: var(--spacing-lg); }
.public-book-card { padding: var(--spacing-md); border: 1px solid var(--color-border-light); border-radius: var(--radius-lg); display: flex; flex-direction: column; }
.public-book-cover { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: var(--spacing-md); min-height: 160px; padding: var(--spacing-md); background: var(--color-primary-light); color: var(--color-primary); border-left: 4px solid var(--color-primary-border); border-radius: var(--radius-md); text-align: center; text-decoration: none; margin-bottom: var(--spacing-md); }
.public-book-cover i { font-size: 28px; }
.public-book-cover span { font-weight: 600; font-size: 16px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.public-book-card h2 { font-size: 16px; }
.public-book-card .public-excerpt { -webkit-line-clamp: 3; font-size: 14px; }
.public-book-card .public-read-link { margin-top: auto; padding-top: var(--spacing-md); }
.public-items-book .public-empty { grid-column: 1 / -1; }
.public-meta { display: flex; align-items: center; flex-wrap: wrap; gap: var(--spacing-sm); font-size: 12px; color: var(--color-text-muted); margin-top: var(--spacing-sm); }
.public-info { display: flex; flex-direction: column; gap: var(--spacing-md); min-width: 0; }
.public-info section { background: var(--color-bg-card); border-radius: var(--radius-lg); padding: var(--spacing-lg); }
.public-info h2 { font-size: 15px; font-weight: 600; margin: 0 0 var(--spacing-md); }
.public-info p { font-size: 14px; line-height: 1.7; margin-top: var(--spacing-md); }
.public-book { display: flex; align-items: baseline; gap: var(--spacing-sm); color: var(--color-text); text-decoration: none; padding: var(--spacing-sm) 0; overflow-wrap: anywhere; }
.public-book > i { flex-shrink: 0; }
.public-book > span { min-width: 0; }
.public-book:hover { color: var(--color-primary); }
.public-pagination { margin-top: auto; display: flex; justify-content: center; align-items: center; gap: var(--spacing-md); padding: var(--spacing-lg); }
.public-empty { padding: var(--spacing-lg); color: var(--color-text-secondary); }
@media (max-width: 1024px) {
 .public-header-inner { gap: var(--spacing-sm); }
 .public-layout { grid-template-columns: minmax(0,1fr) 220px; grid-template-rows: auto 1fr; }
 .public-categories { grid-column: 1 / -1; }
 .public-categories summary { display: none; }
 .public-categories nav { overflow-x: auto; flex-direction: row; flex-wrap: nowrap; background: var(--color-bg-card); }
 .public-categories a { flex-shrink: 0; padding: var(--spacing-sm) var(--spacing-md); white-space: nowrap; }
 .public-nav { gap: var(--spacing-md); }
 .public-brand { font-size: 19px; }
}
@media (max-width: 640px) {
 .public-note-author { gap: var(--spacing-xs); }
 .public-note-author-name { max-width: 72px; }
 .public-note-author .public-pinned { flex-basis: 100%; }
 .public-note-author time { flex-basis: 100%; margin-left: 0; }
 .public-items-book { grid-template-columns: minmax(0,1fr); }
 .public-header-inner { flex-wrap: wrap; gap: var(--spacing-sm); }
 .public-brand { flex: 1; }
 .public-login { order: 1; }
 .public-workspace { display: none; }
 .public-nav { order: 2; width: 100%; justify-content: space-between; overflow-x: auto; }
 .public-search-toggle { display: inline-flex; }
 .public-search { display: none; order: 3; width: 100%; }
 .public-search.is-open { display: flex; }
 .public-layout { display: flex; flex-direction: column; padding: var(--spacing-sm); gap: var(--spacing-sm); }
 .public-categories, .public-feed, .public-info { width: 100%; }
 .public-feed { flex: 1; padding: 0 var(--spacing-md); }
 .public-entry h2 { font-size: 17px; }
 .public-info { display: none; }
 .public-account .header-dropdown { position: absolute; top: 100%; left: auto; right: 0; min-width: 180px; }
 .note-viewer-panel { width: 100%; height: calc(100dvh - 20px); }
 .note-viewer-stage { padding: var(--spacing-sm); }
 .note-viewer-topbar { padding: var(--spacing-md); }
 .note-viewer-content { padding: var(--spacing-md); }
}