/* Post detail keeps the app's green accents and compact, continuous layout. */
.main-content:has(#page-post.active){padding-top:0;padding-bottom:0;background:#fff}
#page-post{max-width:760px;margin:0 auto}
#post-content{display:flex;flex-direction:column;min-height:0}
.post-detail-header{position:sticky;top:84px;z-index:15;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:54px;background:#fffffff5;border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.post-detail-header h1{font-size:16px;line-height:1.5;letter-spacing:0;font-weight:500}
.post-detail-header>button{display:grid;place-items:center;width:36px;height:40px;padding:0;font-size:23px;color:#708579}
.post-detail-story{padding:5.7px 0 6px}
.post-detail-author .author-row{min-height:40px;gap:11px}
.post-detail-author .author-avatar{width:40px;height:40px;border-radius:50%;font-size:16px}
.post-detail-author .author-info{display:flex;align-items:center;flex-wrap:wrap;gap:3px;min-width:0}
.post-detail-author .author-info strong{font-size:14px;font-weight:600;color:#466b56;overflow-wrap:anywhere}
.post-detail-author .author-info>small,.post-detail-author .feed-more{display:none}
.post-detail-author .follow-button{border-radius:18px;font-size:11px;min-height:32px;padding:5px 12px;flex-shrink:0}
.post-published{font-size:10px;line-height:1.8;color:#99a39b;margin:0 0 4.8px 51px}
.post-full-text{font-size:15px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere;color:#293d33}
.post-detail-topics{display:flex;flex-wrap:wrap;gap:7px 13px;margin-top:9px}
.post-detail-topics>button{padding:0;font-size:12px;color:#678694;line-height:1.7}
.post-media-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;max-width:520px;margin-top:13px}
.post-media-grid>button{padding:0;aspect-ratio:1;overflow:hidden;border-radius:5px;background:#edf3eb}
.post-media-grid img{width:100%;height:100%;object-fit:cover}
.post-media-grid video{width:100%;aspect-ratio:1;object-fit:cover;border-radius:5px}
.post-media-grid.two-columns{grid-template-columns:repeat(2,minmax(0,1fr));max-width:420px}
.post-media-grid.single{display:block;max-width:520px}
.post-media-grid.single>button{width:100%;aspect-ratio:auto;max-height:560px}
.post-media-grid.single img{height:auto;max-height:560px;object-fit:contain}
.post-media-grid.single video{aspect-ratio:auto;max-height:500px;object-fit:contain}
.post-discussion{border-top:7px solid #f4f6f3;padding-bottom:6px;scroll-margin-top:64px}
.post-discussion-heading{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);min-height:48px;gap:15px}
.post-discussion-heading h2{position:relative;align-self:stretch;display:flex;align-items:center;gap:7px;font-size:14px;letter-spacing:0}
.post-discussion-heading h2:after{position:absolute;content:'';height:3px;background:var(--green);left:0;right:0;bottom:-1px;border-radius:3px}
.post-discussion-heading h2>span{font-size:12px;font-weight:500}
.post-like-button{display:flex;align-items:center;gap:5px;padding:10px 0 10px 12px;color:#93a093;font-size:12px}
.post-like-button>.icon{width:18px;height:18px}
.post-like-button.liked{color:#b77d65}
.post-like-button.liked>.icon{fill:#b77d651c}
#comments-content .comment-thread{padding:5.7px 0;border-bottom:1px solid #eef2eb}
#comments-content .comment-thread:last-child{border-bottom:0}
#comments-content .comment-row{display:flex;gap:11px;padding:0;border:0}
.comment-avatar{display:grid;place-items:center;width:35px;height:35px;flex:0 0 35px;border-radius:50%;background:#e6ede1;color:#7b9170;font-size:15px;padding:0}
.comment-main{min-width:0;flex:1}
.comment-byline{display:flex;align-items:center;gap:7px;min-height:22px;flex-wrap:wrap}
.comment-byline .comment-author{font-size:12px;font-weight:500;color:#778b76}
.comment-owner-label{display:inline-block;font-size:9px;padding:1px 5px;line-height:1.6;color:#a67f46;background:#f6eddc;border-radius:3px}
#comments-content .comment-line{font-size:14px;line-height:1.85;white-space:pre-wrap;overflow-wrap:anywhere;margin:3px 0 0;cursor:pointer;color:#293b32}
.comment-line:focus-visible{outline:2px solid #8ab79b;outline-offset:3px;border-radius:3px}
.comment-mention{display:inline;color:#4e8190;font:inherit;line-height:inherit;vertical-align:baseline;overflow-wrap:anywhere}
.comment-image-label{font-size:12px;color:#93a38c}
.comment-reply-to{display:block;font-size:11px;color:#8b9b86;line-height:1.7;margin-top:2px}
.comment-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:1.8px}
.comment-meta time{font-size:10px;color:#a0aa9a;line-height:1.7}
.comment-reply-button{display:flex;align-items:center;gap:5px;padding:5px 0 5px 8px;font-size:10px;min-height:28px;color:#8f9f88}
.comment-reply-button .icon{width:15px;height:15px}
.comment-replies{margin:3.9px 0 0 46px}
#comments-content .comment-reply{margin-top:4.5px;gap:9px}
.comment-reply .comment-avatar{width:27px;height:27px;flex-basis:27px;font-size:12px}
.comment-expand{font-size:11px;color:#638699;padding:8px 0 0 36px;line-height:1.7}
#comments-content .comment-images{max-width:260px;gap:5px;margin-top:8px}
#comments-content .comment-images>button{border-radius:5px}
#comments-content .empty-state{padding:42px 14px;font-size:12px}
#page-post .post-composer{position:sticky;bottom:0;z-index:16;flex-shrink:0;display:flex;flex-direction:column;gap:8px;margin:0;padding:3.6px 0 max(8px,env(safe-area-inset-bottom));border:0;border-top:1px solid var(--line);border-radius:0;background:#fffffff7;backdrop-filter:blur(12px);box-shadow:0 -6px 14px #233b2b05}
.comment-compose-row{display:flex;align-items:flex-end;gap:9px}
#page-post .post-composer .comment-input{flex:1;width:100%;min-height:42px;max-height:130px;resize:vertical;padding:10px 12px;font-size:14px;line-height:1.5;border:1px solid #e3e9df;border-radius:9px;background:#f7f9f5}
.comment-compose-row>.button{padding:10px 15px;min-height:42px;font-size:12px;border-radius:9px}
#page-post .comment-toolbar{gap:10px}
#page-post .comment-tool{min-height:30px;padding:3px 7px;font-size:11px}
#page-post .comment-tool>span{font-size:21px}
#page-post .comment-tool small{font-size:10px}
.comment-reply-context{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 9px;background:#f0f5eb;border-radius:6px;border-left:2px solid #9cbb8c}
.comment-reply-context[hidden]{display:none}
.comment-reply-context>div{min-width:0}
.comment-reply-context strong{display:block;font-size:11px;color:#61835a;font-weight:500}
.comment-reply-context span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:10px;color:#8ea086;margin-top:3px}
.comment-reply-context>button{font-size:22px;color:#8f9d87;width:28px;flex-shrink:0}
#page-post .comment-emoji-picker{max-height:145px;overflow-y:auto;grid-template-columns:repeat(9,minmax(0,1fr));gap:3px;padding:6px}
#page-post .comment-emoji-picker>button{font-size:21px;min-height:33px;padding:0}
#page-post .comment-attachments{max-width:190px;gap:7px}
#page-post .comment-remove{width:23px;height:23px;font-size:15px}
.comment-mention-picker{border:1px solid var(--line);border-radius:9px;background:#fff;padding:10px}
.comment-mention-picker[hidden]{display:none}
.mention-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:7px}
.mention-heading label{font-size:12px;color:#5b7856}
.mention-heading button{font-size:20px;color:#99a591;line-height:1}
#comment-mention-search{width:100%;border:1px solid #e3eadf;border-radius:6px;background:#f8faf6;padding:8px 10px;font-size:12px;color:#56704e}
#comment-mention-results{max-height:140px;overflow-y:auto;overscroll-behavior:contain;margin-top:4px}
#comment-mention-results>button{display:flex;align-items:center;gap:9px;width:100%;text-align:left;font-size:12px;color:#5f7658;padding:7px 5px;border-radius:5px}
#comment-mention-results>button:hover{background:#f0f6eb}
#comment-mention-results>button>small{margin-left:auto;color:#94a28a}
.mention-avatar{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#eaf0e3;color:#91a183;font-size:12px}
.mention-empty{padding:15px 5px;font-size:11px;color:#97a28c}
@media(max-width:680px){
 .app-shell:has(#page-post.active)>.topbar,.app-shell:has(#page-post.active)>.mobile-nav{display:none}
 .main-content:has(#page-post.active){padding:0 18px;background:#fff}
 .post-detail-header{top:0;min-height:49px}
 .post-detail-header h1{font-size:15px}
 .post-detail-story{padding:4.5px 0 5.4px}
 .post-full-text{font-size:15px;line-height:1.8}
 .post-discussion{scroll-margin-top:49px}
 #page-post .post-composer .comment-input{font-size:16px}
 .comment-replies{margin-left:43px}
 #comments-content .comment-row{gap:9px}
 .comment-avatar{width:34px;height:34px;flex-basis:34px}
 .comment-reply .comment-avatar{width:25px;height:25px;flex-basis:25px}
 #comments-content .comment-reply{gap:8px}
 .comment-expand{padding-left:33px}
}