/* The feed (#feed). Uses the shared theme tokens from index.html, so light and dark follow the site. */
.fd{--fd-r:16px;--fd-soft:color-mix(in srgb,var(--chalk) 4%,transparent);--fd-like:#C8384B;--fd-rp:#2F7D5A;padding-bottom:40px}
:root[data-theme="dark"] .fd{--fd-like:#F2788A;--fd-rp:#8FD0AE}
.fd-layout{display:grid;grid-template-columns:minmax(0,640px) 320px;gap:32px;justify-content:center;align-items:start}
.fd-col{min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:0;align-content:start}
.fd-head{display:grid;gap:6px;padding:4px 2px 18px}
.fd-head h1,.fd-taghead h1{font-size:clamp(2rem,5vw,2.8rem)}
.fd-head p{max-width:52ch}
.fd-taghead{display:grid;gap:4px;padding:6px 2px 16px}
.fd-ell{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* avatars */
.fd-av{--fh:150;width:44px;height:44px;border-radius:50%;flex:none;display:grid;place-items:center;text-decoration:none;font-weight:700;font-size:.92rem;letter-spacing:.02em;
  background:hsl(var(--fh) 30% 90%);color:hsl(var(--fh) 35% 26%);border:1px solid hsl(var(--fh) 22% 82%)}
:root[data-theme="dark"] .fd-av{background:hsl(var(--fh) 18% 22%);color:hsl(var(--fh) 40% 82%);border-color:hsl(var(--fh) 14% 30%)}
.fd-av svg{width:22px;height:22px;opacity:.7}
.fd-av.sm{width:22px;height:22px;font-size:.58rem}
.fd-av.lg{width:52px;height:52px;font-size:1.05rem}
.fd-av.xl{width:84px;height:84px;font-size:1.7rem}
.fd-av-gone{background:var(--pit3);border-color:var(--line)}

/* composer */
.fd-comp{display:flex;gap:12px;padding:16px;background:var(--pit);border:1px solid var(--line);border-radius:var(--fd-r);margin-bottom:14px}
.fd-comp-main{flex:1;min-width:0;display:grid;gap:10px}
.fd-comp textarea{border:0;background:transparent;padding:9px 0 4px;min-height:0;resize:none;font-size:1.12rem;line-height:1.45;border-radius:0;overflow:hidden}
.fd-comp textarea:focus{outline:none}
.fd-comp textarea::placeholder{color:var(--dim)}
.fd-comp:focus-within{border-color:color-mix(in srgb,var(--brass) 45%,var(--line))}
.fd-comp-bar{display:flex;align-items:center;gap:10px;border-top:1px solid var(--line);padding-top:10px}
.fd-tools{display:flex;gap:2px;margin-right:auto}
.fd-tool{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--brass);background:none;border:0;cursor:pointer}
.fd-tool svg{width:20px;height:20px}
.fd-tool:hover,.fd-tool.on{background:color-mix(in srgb,var(--brass) 12%,transparent)}
.fd-count{display:flex;align-items:center;gap:6px;font-size:.78rem;color:var(--dim);font-variant-numeric:tabular-nums}
.fd-count svg{width:24px;height:24px;transform:rotate(-90deg)}
.fd-count circle{fill:none;stroke-width:2.4}
.fd-count .trk{stroke:var(--line)}
.fd-count .val{stroke:var(--brass);transition:stroke-dashoffset .15s}
.fd-count svg.warn .val{stroke:var(--amber)}
.fd-count svg.over .val{stroke:var(--live)}
.fd-count span.over{color:var(--live);font-weight:700}
.fd-postbtn{min-width:76px}
.fd-comp-photos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.fd-comp-photos:empty,.fd-comp-att:empty{display:none}
.fd-thumb{position:relative;aspect-ratio:1;border-radius:12px;overflow:hidden;background:var(--pit3)}
.fd-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.fd-thumb button{position:absolute;top:6px;right:6px;width:28px;height:28px;border-radius:50%;border:0;background:rgba(15,20,18,.72);color:#fff;display:grid;place-items:center;cursor:pointer}
.fd-thumb button svg{width:14px;height:14px}
.fd-thumb-busy{position:absolute;inset:0;background:color-mix(in srgb,var(--pit) 55%,transparent);display:grid;place-items:center}
.fd-thumb-busy::after{content:"";width:22px;height:22px;border-radius:50%;border:2.5px solid var(--line);border-top-color:var(--brass);animation:fdspin .8s linear infinite}
@keyframes fdspin{to{transform:rotate(360deg)}}
.fd-comp-att{display:flex;gap:8px;flex-wrap:wrap}
.fd-attchip{display:inline-flex;align-items:center;gap:6px;padding:4px 6px 4px 10px;border-radius:999px;background:color-mix(in srgb,var(--brass) 10%,transparent);color:var(--brass);font-size:.82rem;font-weight:600;max-width:100%}
.fd-attchip svg{width:15px;height:15px;flex:none}
.fd-attchip button{width:24px;height:24px;border:0;border-radius:50%;background:none;color:inherit;display:grid;place-items:center;cursor:pointer}
.fd-attchip button svg{width:12px;height:12px}
.fd-comp-pick{padding:12px;border-radius:12px;background:var(--pit2);border:1px solid var(--line)}
.fd-pick-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fd-comp-quote .fd-quote{pointer-events:none}
.fd-err{font-size:.84rem;color:var(--live);background:color-mix(in srgb,var(--live) 9%,transparent);padding:8px 12px;border-radius:10px}
.fd-err[hidden]{display:none}
.fd-comp-reply{border-radius:0;border-width:0 0 1px;margin:0;background:var(--pit)}
.fd-comp-quote{border:0;padding:0;background:none;margin:0}
.fd-replying{font-size:.86rem;color:var(--dim)}
.fd-replying a{color:var(--brass);text-decoration:none}

/* tabs and tags */
.fd-sticky{position:sticky;top:var(--fd-top,61px);z-index:20;background:var(--hdr);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);border-bottom:0;border-radius:var(--fd-r) var(--fd-r) 0 0}
.fd-tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.fd-tabs button{background:none;border:0;padding:14px 4px 12px;cursor:pointer;font-weight:600;font-size:.92rem;color:var(--dim);position:relative;min-height:48px}
.fd-tabs button:hover{background:var(--fd-soft);color:var(--chalk)}
.fd-tabs button.on{color:var(--chalk)}
.fd-tabs button.on::after{content:"";position:absolute;left:50%;bottom:-1px;transform:translateX(-50%);width:44px;height:3px;border-radius:3px;background:var(--brass)}
.fd-tagrow{display:flex;gap:8px;overflow-x:auto;padding:10px 14px;scrollbar-width:none;border-bottom:1px solid var(--line)}
.fd-tagrow::-webkit-scrollbar{display:none}
.fd-tagrow .chip{text-decoration:none;flex:none}

/* timeline */
.fd-list{display:grid;background:var(--pit);border:1px solid var(--line);border-top:0;min-width:0}
.fd-sticky+.fd-newpill+.fd-list,.fd-sticky+.fd-newpill[hidden]+.fd-list{border-radius:0 0 var(--fd-r) var(--fd-r)}
.fd-col>.fd-list:first-of-type{border-top:1px solid var(--line)}
.fd-post{padding:14px 16px 6px;border-bottom:1px solid var(--line);min-width:0;cursor:pointer;transition:background .12s}
.fd-post:last-child{border-bottom:0}
.fd-post:hover{background:var(--fd-soft)}
.fd-row{display:flex;gap:12px;min-width:0}
.fd-main{flex:1;min-width:0;display:grid;gap:8px;align-content:start}
.fd-h{display:flex;align-items:center;gap:5px;min-width:0;line-height:1.3;margin-top:1px}
.fd-name{font-weight:700;text-decoration:none;color:var(--chalk);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:0 1 auto;min-width:0}
.fd-name:hover{text-decoration:underline}
.fd-handle-t{color:var(--dim);font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.fd-h .fd-handle-t{flex:0 2 auto}
.fd-dot{color:var(--dim)}
.fd-time{color:var(--dim);font-size:.9rem;text-decoration:none;white-space:nowrap;flex:none}
.fd-time:hover{text-decoration:underline}
.fd-iconbtn{width:34px;height:34px;border-radius:50%;border:0;background:none;color:var(--dim);display:grid;place-items:center;cursor:pointer;flex:none}
.fd-iconbtn svg{width:18px;height:18px}
.fd-iconbtn:hover{background:color-mix(in srgb,var(--brass) 12%,transparent);color:var(--brass)}
.fd-menu{margin:-8px -8px -8px auto}
.fd-text{white-space:pre-wrap;overflow-wrap:anywhere;font-size:1rem;line-height:1.5;color:var(--chalk)}
.fd-hash,.fd-at,.fd-link{color:var(--brass);text-decoration:none;font-weight:600}
.fd-hash:hover,.fd-at:hover,.fd-link:hover{text-decoration:underline}
.fd-ctx{display:flex;align-items:center;gap:8px;font-size:.82rem;font-weight:600;color:var(--dim);padding:0 0 6px 32px}
.fd-ctx svg{width:15px;height:15px}
.fd-ctx a{color:inherit;text-decoration:none}
.fd-ctx a:hover{text-decoration:underline}
.fd-ctx-undo{margin-left:auto;background:none;border:0;color:var(--brass);font-weight:600;cursor:pointer;font-size:.8rem;padding:4px 8px;border-radius:999px}
.fd-ctx-undo:hover{background:color-mix(in srgb,var(--brass) 10%,transparent)}
.fd-gone{display:flex;gap:12px;align-items:center;cursor:default;padding-bottom:14px}
.fd-gone .fd-av{width:44px;height:44px}

/* photos */
.fd-photos{display:grid;gap:3px;border-radius:14px;overflow:hidden;border:1px solid var(--line);grid-template-columns:1fr 1fr;aspect-ratio:16/10;background:var(--pit3)}
.fd-photos.n1{grid-template-columns:1fr;aspect-ratio:auto}
.fd-photos.n3{grid-template-rows:1fr 1fr}
.fd-photos.n3 .fd-ph:first-child{grid-row:span 2}
.fd-photos.n4{grid-template-rows:1fr 1fr}
.fd-ph{display:block;padding:0;border:0;background:none;cursor:zoom-in;min-height:0;min-width:0;overflow:hidden}
.fd-ph img{width:100%;height:100%;object-fit:cover;display:block}
.fd-photos.n1 .fd-ph img{height:auto;max-height:560px;object-fit:cover}
.fd-lb{position:relative;display:grid;place-items:center}
.fd-lb img{max-width:100%;max-height:82vh;border-radius:10px;display:block}
.fd-lb-x{position:absolute;top:8px;right:8px;background:rgba(15,20,18,.7);color:#fff}

/* attachments */
.fd-listing{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;background:var(--pit);min-width:0}
.fd-listing:hover{border-color:var(--smoke)}
.fd-listing img,.fd-listing-ph{width:112px;height:84px;object-fit:cover;flex:none;background:var(--pit3);display:grid;place-items:center;color:var(--dim)}
.fd-listing-ph svg{width:30px;height:30px}
.fd-listing-t{display:grid;gap:2px;min-width:0;padding:8px 12px 8px 0}
.fd-listing-t b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-listing-k{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--brass);font-weight:700}
.fd-listing-p{font-size:.88rem;color:var(--smoke);font-variant-numeric:tabular-nums}
.fd-car{display:inline-flex;align-items:center;gap:6px;justify-self:start;padding:4px 10px;border-radius:999px;border:1px solid var(--line);font-size:.8rem;font-weight:600;color:var(--smoke);text-decoration:none;max-width:100%}
.fd-car span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-car svg{width:15px;height:15px;flex:none;color:var(--brass)}
.fd-car:hover{border-color:var(--smoke);color:var(--chalk)}
.fd-quote{border:1px solid var(--line);border-radius:14px;padding:10px 12px;display:grid;gap:6px;min-width:0;cursor:pointer}
.fd-quote:hover{background:var(--fd-soft)}
.fd-quote-h{display:flex;align-items:center;gap:6px;min-width:0;font-size:.9rem}
.fd-quote-h b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fd-quote-h time{color:var(--dim);white-space:nowrap}
.fd-quote .fd-text{font-size:.94rem}
.fd-quote-gone{color:var(--dim);font-size:.88rem;cursor:default;background:var(--pit2)}

/* actions */
.fd-acts{display:flex;justify-content:space-between;max-width:420px;margin:0 -8px}
.fd-act{display:inline-flex;align-items:center;gap:4px;background:none;border:0;color:var(--dim);cursor:pointer;padding:6px 8px;border-radius:999px;min-height:40px;min-width:40px;font-size:.84rem;font-variant-numeric:tabular-nums;transition:color .12s}
.fd-act svg{width:19px;height:19px;padding:0;flex:none;transition:transform .15s}
.fd-act span{font-family:var(--body);font-weight:500}
.fd-act span:empty{display:none}
.fd-act:hover{color:var(--brass);background:color-mix(in srgb,var(--brass) 9%,transparent)}
.fd-act.a-like:hover,.fd-act.a-like.on{color:var(--fd-like)}
.fd-act.a-like:hover{background:color-mix(in srgb,var(--fd-like) 9%,transparent)}
.fd-act.a-like.on svg{fill:currentColor;animation:fdpop .3s ease}
.fd-act.a-repost:hover,.fd-act.a-repost.on{color:var(--fd-rp)}
.fd-act.a-repost:hover{background:color-mix(in srgb,var(--fd-rp) 9%,transparent)}
@keyframes fdpop{50%{transform:scale(1.25)}}
.fd-acts.big{max-width:none;margin:0;padding:4px 0;border-top:1px solid var(--line)}
.fd-acts.big .fd-act svg{width:22px;height:22px}

/* thread */
.fd-threadbar{position:sticky;top:var(--fd-top,61px);z-index:20;background:var(--hdr);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--line);border-bottom:0;border-radius:var(--fd-r) var(--fd-r) 0 0;padding:6px 8px}
.fd-back{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;font-size:1.05rem;padding:8px 10px;border-radius:999px;min-height:44px}
.fd-back svg{width:20px;height:20px}
.fd-back:hover{background:var(--fd-soft)}
.fd-col>.fd-back{justify-self:start;margin:0 0 6px -10px}
#fdthread{display:grid;border:1px solid var(--line);border-top:0;border-radius:0 0 var(--fd-r) var(--fd-r);overflow:hidden;background:var(--pit)}
#fdthread .fd-list{border:0;border-radius:0}
.fd-anc:empty{display:none}
.fd-post.line{border-bottom:0;padding-bottom:0}
.fd-post.line .fd-row>.fd-av,.fd-post.line>.fd-av{position:relative}
.fd-post.line .fd-row{position:relative}
.fd-post.line .fd-row::before{content:"";position:absolute;left:21px;top:50px;bottom:0;width:2px;background:var(--line)}
.fd-post.line .fd-main{padding-bottom:6px}
.fd-upmore{display:block;padding:12px 16px;color:var(--brass);text-decoration:none;font-weight:600;font-size:.9rem;border-bottom:1px solid var(--line)}
.fd-focus{cursor:default;padding:14px 16px 0;display:grid;gap:12px}
.fd-focus:hover{background:none}
.fd-focus-h{align-items:center}
.fd-focus-who{display:grid;min-width:0;flex:1}
.fd-focus-who .fd-name{font-size:1.02rem}
.fd-focus .fd-menu{margin:0 -6px 0 0}
.fd-focus .fd-text{font-size:1.2rem;line-height:1.5}
.fd-meta{color:var(--dim);font-size:.9rem}
.fd-stats{display:flex;gap:18px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:12px;font-size:.92rem;color:var(--dim)}
.fd-stats b{color:var(--chalk)}
.fd-focus.fd-gone{display:flex;padding-bottom:16px}

/* profile */
.fd-prof{display:grid;grid-template-columns:auto 1fr auto;gap:18px;align-items:start;padding:8px 2px 20px}
.fd-prof-t{display:grid;gap:3px;min-width:0}
.fd-prof-t h1{font-size:clamp(1.7rem,4.4vw,2.4rem);overflow-wrap:anywhere}
.fd-prof-n{display:flex;gap:16px;flex-wrap:wrap;margin-top:8px;font-size:.92rem;color:var(--dim)}
.fd-prof-n b{color:var(--chalk)}
.fd-follow{min-width:104px}
.fd-col>.fd-prof+.fd-newpill+.fd-list,.fd-col>.fd-prof+.fd-newpill[hidden]+.fd-list{border-top:1px solid var(--line);border-radius:var(--fd-r)}

/* empty, loading, more */
.fd-empty{display:grid;gap:8px;justify-items:center;text-align:center;padding:44px 24px;cursor:default}
.fd-empty b{font-family:var(--display);font-weight:400;font-size:1.45rem;letter-spacing:-.02em}
.fd-empty p{max-width:42ch}
.fd-empty .btn{margin-top:8px}
.fd-empty-sm{padding:28px 20px}
.fd-empty-ic{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--brass) 10%,transparent);color:var(--brass);margin-bottom:4px}
.fd-empty-ic svg{width:28px;height:28px}
.fd-skel{cursor:default;padding-bottom:16px}
.fd-skel .fd-av{background:var(--pit3);border-color:var(--pit3)}
.fd-skel i{display:block;height:12px;border-radius:6px;background:var(--pit3);animation:fdpulse 1.2s ease-in-out infinite alternate}
@keyframes fdpulse{to{opacity:.45}}
.fd-loadmore{margin-top:14px}
.fd-newpill{justify-self:center;position:sticky;top:calc(var(--fd-top,61px) + 112px);z-index:21;margin:-4px 0 -40px;height:36px;padding:0 16px;border-radius:999px;border:0;background:var(--brass);color:var(--on-brass);font-weight:700;font-size:.86rem;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.18)}
.fd-newpill[hidden]{display:none}

/* sidebar */
.fd-side{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;position:sticky;top:calc(var(--fd-top,61px) + 16px)}
.fd-card{background:var(--pit2);border-radius:var(--fd-r);padding:16px 18px;display:grid;gap:12px;min-width:0}
.fd-card h3{font-family:var(--body);font-weight:800;font-size:1.06rem;letter-spacing:-.01em}
.fd-card .btn{justify-self:start}
.fd-trend{display:grid;margin:0 -18px}
.fd-trend a{display:grid;gap:1px;padding:9px 18px;text-decoration:none;min-width:0}
.fd-trend a b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-trend a:hover{background:var(--fd-soft)}
.fd-trend .fd-handle-t{font-size:.8rem}
.fd-rules{margin:0;padding-left:18px;display:grid;gap:6px;font-size:.86rem;color:var(--smoke)}

/* menus, modals, toast */
.fd-pop{position:fixed;z-index:90;min-width:190px;background:var(--pit);border:1px solid var(--line);border-radius:14px;padding:6px;box-shadow:0 12px 32px rgba(0,0,0,.16);display:grid}
:root[data-theme="dark"] .fd-pop{box-shadow:0 12px 32px rgba(0,0,0,.5)}
.fd-pop button{text-align:left;background:none;border:0;padding:11px 14px;border-radius:10px;font-weight:600;font-size:.92rem;cursor:pointer;min-height:44px}
.fd-pop button:hover,.fd-pop button:focus-visible{background:var(--pit2)}
.fd-pop button.bad{color:var(--live)}
.fd-btn-bad{background:var(--live);border-color:var(--live);color:#fff}
:root[data-theme="dark"] .fd-btn-bad{color:#2A0F0B}
.fd-gatebox{display:grid;gap:14px}
.fd-gate .fd-comp-main{gap:6px;align-content:start;padding-top:4px}
.fd-gate .btn{justify-self:start;margin-top:6px}
.fd-gate b{font-size:1.02rem}
.fd-quotemodal{display:grid;gap:12px}
.fd-toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);z-index:95;background:var(--chalk);color:var(--asphalt);padding:11px 18px;border-radius:999px;font-weight:600;font-size:.9rem;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;max-width:calc(100vw - 32px);text-align:center}
.fd-toast.on{opacity:1;transform:translate(-50%,0)}

@media (max-width:1040px){.fd-layout{grid-template-columns:minmax(0,640px)}.fd-side{display:none}}
@media (max-width:860px){.fd-toast{bottom:calc(84px + env(safe-area-inset-bottom,0px))}}
@media (max-width:640px){
  .fd.wrap{padding-left:0;padding-right:0}
  .fd{padding-top:12px}
  .fd-head,.fd-taghead,.fd-prof{padding-left:16px;padding-right:16px}
  .fd-col>.fd-back{margin-left:6px}
  .fd-comp{border-radius:0;border-left:0;border-right:0;margin-bottom:0;padding:14px 16px}
  .fd-comp-reply{border-top:0}
  .fd-sticky,.fd-threadbar{border-radius:0;border-left:0;border-right:0}
  .fd-threadbar{border-top:0;margin-top:-12px}
  .fd-list,#fdthread{border-left:0;border-right:0;border-radius:0!important}
  .fd-col>.fd-prof+.fd-newpill+.fd-list,.fd-col>.fd-prof+.fd-newpill[hidden]+.fd-list{border-radius:0}
  .fd-post{padding:12px 16px 4px}
  .fd-av{width:40px;height:40px;font-size:.85rem}
  .fd-post.line .fd-row::before{left:19px;top:46px}
  .fd-prof{grid-template-columns:auto 1fr;gap:14px}
  .fd-prof .fd-follow{grid-column:1/-1;justify-self:stretch}
  .fd-av.xl{width:64px;height:64px;font-size:1.3rem}
  .fd-listing img,.fd-listing-ph{width:92px;height:72px}
  .fd-pick-row{grid-template-columns:1fr}
  .fd-photos.n1 .fd-ph img{max-height:440px}
  .fd-loadmore{width:calc(100% - 32px);margin:14px 16px 0}
  .fd-comp textarea{font-size:1.05rem}
  .fd-empty{padding:40px 20px}
}