/* Native theses: pump.fun's callout cards under the token chart (and the global feed). Sizes are pump's real pixels times
   --pz, which undoes the desktop page scale (html zoom .75 from 1100px). Colours are palette tokens only. */
.ft-feed{--pz:1;--like:#ff3040;background:var(--bg);border:1px solid var(--line);border-radius:8px;overflow:hidden;min-width:0;color:var(--ink)}
.ft-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px 8px}.ft-heading h2{font:700 calc(17px * var(--pz)) var(--sans);letter-spacing:-.025em;margin:0}.ft-live{font:calc(11px * var(--pz)) var(--sans);color:var(--muted);white-space:nowrap}
.ft-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:calc(10px * var(--pz)) calc(16px * var(--pz));border-bottom:1px solid var(--line)}
.ft-channel{display:inline-flex;align-items:center;flex-wrap:wrap;gap:calc(6px * var(--pz));min-width:0;color:var(--muted);font:500 calc(12px * var(--pz)) var(--sans)}.ft-channel .ft-burn-icon{color:var(--brand)}.ft-dot{opacity:.6}.ft-how{color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-decoration:none;font-weight:600}.ft-how:hover{text-decoration:underline;text-underline-offset:3px}
.ft-controls button,.ft-sort{border:0;color:var(--muted);background:transparent;border-radius:5px;padding:6px 8px;font:550 calc(12px * var(--pz)) var(--sans);cursor:pointer}.ft-controls button[aria-pressed=true]{background:var(--panel-2);color:var(--ink)}.ft-controls button:hover{color:var(--ink)}.ft-sort{border:1px solid var(--line-2);max-width:calc(130px * var(--pz));background:var(--panel);color:var(--ink-2)}
.ft-composer{padding:calc(12px * var(--pz)) calc(16px * var(--pz));border-bottom:1px solid var(--line);background:var(--bg)}
/* slim composer (design A): one rounded line that opens on focus into a box with the counter and Post */
.ft-composer textarea{display:block;box-sizing:border-box;width:100%;height:calc(40px * var(--pz));min-height:0;max-height:220px;resize:none;overflow:hidden;border:1px solid var(--line-2);border-radius:999px;outline:none;padding:calc(9px * var(--pz)) calc(16px * var(--pz));background:var(--panel);color:var(--ink);font:calc(14px * var(--pz))/1.45 var(--sans);transition:border-color .15s,border-radius .15s}.ft-composer textarea::placeholder{color:var(--muted)}.ft-composer textarea:hover{border-color:color-mix(in srgb,var(--brand) 35%,var(--line-2))}.ft-feed .ft-composer textarea:focus-visible{outline:none}
.ft-composer[data-open] textarea{height:auto;min-height:calc(88px * var(--pz));resize:vertical;overflow:auto;border-radius:calc(12px * var(--pz));border-color:color-mix(in srgb,var(--brand) 55%,var(--line-2))}.ft-composer:not([data-open]) :is(.ft-compose-foot,.ft-hold,.ft-coin-row){display:none}
.ft-compose-foot{display:flex;align-items:center;gap:10px;margin-top:calc(8px * var(--pz))}.ft-identity{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:500 calc(12px * var(--pz)) var(--sans);color:var(--muted)}.ft-count{color:var(--muted);font:calc(10px * var(--pz)) var(--mono);white-space:nowrap}.ft-hold{margin:calc(8px * var(--pz)) 0 0;color:var(--muted);font:calc(12px * var(--pz))/1.4 var(--sans)}.ft-coin-row{display:flex;align-items:center}
.ft-submit{border:0;border-radius:calc(7px * var(--pz));background:var(--brand-sheen-sm);box-shadow:var(--brand-bevel,none);color:var(--brand-ink);font:700 calc(12px * var(--pz)) var(--sans);padding:calc(8px * var(--pz)) calc(14px * var(--pz));cursor:pointer;white-space:nowrap}.ft-submit:hover:not(:disabled){filter:brightness(1.08)}.ft-submit:disabled{opacity:.4;cursor:default}
.ft-error{color:var(--error,var(--down));font-size:calc(12px * var(--pz));margin:4px 0 8px}.ft-coin-label{font-size:calc(12px * var(--pz));margin-right:8px}.ft-coin-select{max-width:calc(100% - 50px);padding:6px 8px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:4px;margin-bottom:8px}
.ft-new,.ft-more{display:block;width:100%;padding:10px;border:0;color:var(--brand-text-solid);background:var(--panel-2,var(--bg));font:600 calc(12px * var(--pz)) var(--sans);cursor:pointer}.ft-more{color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.ft-new{border-bottom:1px solid var(--line);position:sticky;top:0;z-index:2}.ft-more{border-top:1px solid var(--line)}.ft-new:hover{background:var(--line)}.ft-more:hover{filter:brightness(1.14)}.ft-empty{padding:30px 16px;text-align:center;color:var(--muted);font:calc(13px * var(--pz)) var(--sans)}.ft-coin-feed .ft-list{max-height:calc(640px * var(--pz));overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}
/* the card, design A "price-tag on the right" (owner, 29 Sep): avatar | who · when | the author's position as a quote
   block / the fable / one action row with the burn inline / replies. Phones move the quote under the header line. */
.ft-post{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"av head quote" "av text quote" "av tok tok" "av act act" "av more more";align-items:start;padding:calc(16px * var(--pz)) calc(16px * var(--pz)) calc(12px * var(--pz));border-bottom:1px solid color-mix(in srgb,var(--line) 75%,transparent);min-width:0;transition:background .12s}.ft-post:last-child{border-bottom:0}.ft-post:hover{background:color-mix(in srgb,var(--panel) 55%,var(--bg))}
.ft-avatar{display:block;flex:none;width:calc(38px * var(--pz));height:calc(38px * var(--pz));border-radius:50%;object-fit:cover;border:1px solid var(--line-2)}.ft-avatar-button{grid-area:av;display:block;align-self:start;margin-right:calc(12px * var(--pz));border:0;border-radius:50%;padding:0;background:none;line-height:0;cursor:pointer}.ft-avatar-button:hover .ft-avatar{border-color:var(--brand)}
.ft-byline{grid-area:head;display:flex;align-items:center;gap:calc(6px * var(--pz));min-width:0;min-height:calc(20px * var(--pz))}.ft-user{display:inline-flex;align-items:center;gap:calc(5px * var(--pz));min-width:0;max-width:100%;font:650 calc(14px * var(--pz))/1.2 var(--sans);white-space:nowrap}.ft-user,.ft-reply-author{border:0;padding:0;background:none;text-align:left;color:var(--ink);cursor:pointer}.ft-user:hover .ft-user-name,.ft-reply-author:hover{color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-decoration:underline;text-underline-offset:3px}
/* the author, as everywhere on Fable: name, the verified-on-X seal (design D), then the @handle in muted mono */
.ft-user-name{min-width:0;overflow:hidden;text-overflow:ellipsis}.ft-user-handle{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted);font:400 calc(12px * var(--pz)) var(--mono);cursor:pointer}.ft-byline .ft-x{--fx-size:calc(11px * var(--pz));margin-left:calc(-1px * var(--pz))}.ft-reply .ft-x{--fx-size:calc(9px * var(--pz));display:inline-flex;margin-left:calc(5px * var(--pz));vertical-align:-1px}.ft-verified{flex:none;width:calc(14px * var(--pz));height:calc(14px * var(--pz))}.ft-seal{fill:var(--brand)}.ft-tick{fill:none;stroke:var(--brand-mark);stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.ft-source{font:calc(10px * var(--pz)) var(--sans);color:var(--muted);white-space:nowrap}.ft-coin-feed .ft-source{display:none}.ft-sep{color:var(--muted);opacity:.7}.ft-age{flex:none;font:calc(12px * var(--pz)) var(--sans);color:var(--muted);white-space:nowrap}
/* the price tag: a tiny POSITION label, the value in bold mono, the unrealized change as a tinted chip */
.ft-quote{grid-area:quote;display:flex;flex-direction:column;align-items:flex-end;gap:calc(4px * var(--pz));min-width:calc(86px * var(--pz));margin-left:calc(14px * var(--pz));padding:calc(7px * var(--pz)) calc(10px * var(--pz));border:1px solid var(--line);border-radius:calc(10px * var(--pz));background:color-mix(in srgb,var(--panel) 70%,var(--bg));color:var(--ink);text-align:right;font-variant-numeric:tabular-nums;cursor:pointer;transition:border-color .12s}.ft-quote:hover{border-color:color-mix(in srgb,var(--brand) 55%,var(--line))}
.ft-quote-label{font:600 calc(9px * var(--pz))/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.ft-quote-value{font:700 calc(14px * var(--pz))/1.1 var(--mono);color:var(--ink);white-space:nowrap}
.ft-quote-chip{padding:calc(2px * var(--pz)) calc(7px * var(--pz));border-radius:999px;font:600 calc(11px * var(--pz))/1.3 var(--mono);white-space:nowrap;color:var(--muted);background:color-mix(in srgb,var(--muted) 14%,transparent)}.ft-quote[data-direction=up] .ft-quote-chip{color:var(--up);background:color-mix(in srgb,var(--up) 15%,transparent)}.ft-quote[data-direction=down] .ft-quote-chip{color:var(--down);background:color-mix(in srgb,var(--down) 15%,transparent)}
.ft-quote:is([data-state=none],[data-state=sold]){background:transparent;border-color:transparent}.ft-quote:is([data-state=none],[data-state=sold]) .ft-quote-value{font:500 calc(12px * var(--pz))/1.2 var(--sans);color:var(--muted)}
.ft-text{grid-area:text;font:calc(15px * var(--pz))/1.5 var(--sans);margin:calc(4px * var(--pz)) 0 calc(8px * var(--pz));color:var(--ink);overflow-wrap:anywhere;white-space:pre-wrap;cursor:pointer}
.ft-token{grid-area:tok;display:flex;align-items:center;gap:9px;padding:8px 10px;margin:0 0 8px;border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--ink);text-decoration:none}.ft-token:hover{border-color:var(--line-2);background:var(--panel-2)}.ft-token>img{width:28px;height:28px;object-fit:cover;border-radius:5px;flex:none}.ft-token-name{display:grid;gap:2px;min-width:0}.ft-token-name b{font:650 calc(12px * var(--pz)) var(--sans);overflow:hidden;text-overflow:ellipsis}.ft-token-name small{font:calc(11px * var(--pz)) var(--sans);color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ft-token-cap{margin-left:auto;white-space:nowrap;font:550 calc(11px * var(--pz)) var(--mono)}
.ft-actions{grid-area:act;display:flex;flex-wrap:wrap;row-gap:4px;align-items:center;gap:calc(18px * var(--pz));min-width:0;min-height:calc(26px * var(--pz))}.ft-actions button{display:inline-flex;align-items:center;justify-content:center;gap:5px;border:0;padding:2px 0;color:var(--muted);background:transparent;font:calc(12px * var(--pz)) var(--sans);cursor:pointer}.ft-actions button:hover,.ft-actions button[aria-pressed=true]{color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ft-actions svg{width:calc(16px * var(--pz));height:calc(16px * var(--pz));fill:none;stroke:currentColor;stroke-width:1.35;stroke-linejoin:round;stroke-linecap:round}/* a liked heart fills red, as on X (owner, 30 Sep); a new like pops it (.ft-pop, fable-theses.js) */.ft-actions .ft-like:hover,.ft-actions .ft-like[aria-pressed=true]{color:var(--like);background:none;-webkit-text-fill-color:currentColor}.ft-actions .ft-like[aria-pressed=true] svg{fill:currentColor}.ft-like.ft-pop svg{animation:ft-like-pop .36s cubic-bezier(.2,.9,.3,1.25)}@keyframes ft-like-pop{0%{transform:scale(1)}40%{transform:scale(1.32)}70%{transform:scale(.94)}100%{transform:scale(1)}}@media(prefers-reduced-motion:reduce){.ft-like.ft-pop svg{animation:none}}.ft-share svg{stroke-width:1.6}
/* the burn result, inline at the row's end: fire orange once burned, muted while queued */
.ft-burn{display:inline-flex;align-items:center;gap:calc(5px * var(--pz));margin-left:auto;min-width:0;white-space:nowrap;color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font:650 calc(12px * var(--pz))/1.5 var(--sans);font-variant-numeric:tabular-nums}.ft-burn[data-status=queued]{color:var(--muted);background:none;-webkit-text-fill-color:currentColor;font-weight:500}
.ft-actions .ft-burn-icon,.ft-burn-icon{width:calc(14px * var(--pz));height:calc(14px * var(--pz));flex:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.ft-burn-flame,.ft-actions .ft-burn-flame{fill:color-mix(in srgb,var(--brand) 26%,transparent)}.ft-burn-clock{fill:none}.ft-burn[data-status=fired] .ft-burn-clock,.ft-burn[data-status=queued] .ft-burn-flame{display:none}.ft-channel .ft-burn-clock{display:none}
.ft-thread{grid-area:more;overflow-anchor:none}
.ft-reply-head{scroll-margin-block:120px 96px}
.ft-reply-box{scroll-margin-block:120px 24px}
.ft-thread{margin:10px 0 0;border-left:1px solid var(--line-2);padding-left:12px}.ft-reply{display:flex;align-items:flex-start;gap:calc(8px * var(--pz));font:calc(12px * var(--pz))/1.5 var(--sans);padding:8px 0}.ft-reply-face{flex:none;display:block;margin-top:1px;border:0;border-radius:50%;padding:0;background:none;line-height:0;cursor:pointer}.ft-reply-avatar{display:block;width:calc(26px * var(--pz));height:calc(26px * var(--pz));border-radius:50%;object-fit:cover;border:1px solid var(--line-2);background:var(--panel-2)}.ft-reply-face:hover .ft-reply-avatar{border-color:var(--brand)}.ft-reply-body{flex:1;min-width:0}.ft-reply-author{font:650 calc(12px * var(--pz)) var(--sans)}.ft-reply-head .ft-reply-seal{width:calc(11px * var(--pz));height:calc(11px * var(--pz));margin-left:4px;vertical-align:-1px}.ft-reply-head .ft-x{--fx-size:calc(9.5px * var(--pz));margin-left:2px}.ft-reply-at{margin-left:4px;color:var(--muted);font:400 calc(11px * var(--pz)) var(--mono)}.ft-reply time{color:var(--muted);margin-left:8px;font-size:calc(10px * var(--pz))}.ft-reply p{margin:4px 0;overflow-wrap:anywhere;white-space:pre-wrap}.ft-reply-form{display:flex;gap:8px;margin-top:8px}.ft-reply-form input{width:0;min-width:0;flex:1;border:1px solid var(--line);background:var(--panel);color:var(--ink);font:calc(12px * var(--pz)) var(--sans);padding:8px;border-radius:4px}.ft-reply-form button{background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:5px 8px;font-size:calc(12px * var(--pz));cursor:pointer}.ft-reply-note{display:block;color:var(--muted);font:calc(10px * var(--pz))/1.4 var(--sans);margin-top:8px}
.ft-write{display:block;text-align:center;padding:10px;color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;border-bottom:1px solid var(--line);font:600 calc(12px * var(--pz)) var(--sans)}.ft-feed [hidden]{display:none!important}.ft-feed :is(a,button,input,select,textarea):focus-visible{outline:2px solid var(--brand);outline-offset:3px}.ft-feed .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}
@media(min-width:1100px){.ft-feed{--pz:1.3333}}
@media(max-width:640px){.ft-heading,.ft-composer,.ft-post{padding:12px}.ft-controls{padding:8px 12px}.ft-post{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"av head" "av quote" "av text" "av tok" "av act" "av more"}.ft-avatar-button{margin-right:9px}.ft-avatar{width:32px;height:32px}.ft-quote{flex-direction:row;align-items:center;justify-self:start;gap:8px;min-width:0;margin:6px 0 2px;padding:4px 9px}.ft-quote:is([data-state=none],[data-state=sold]){padding:0}.ft-text{font-size:15px}.ft-actions{gap:14px}.ft-count{margin-left:auto}.ft-coin-feed .ft-list{max-height:560px}.ft-thread{padding-left:9px}}

/* The chart view's lower tabs (pump.fun's "Holders 3,917 | Callouts | Trades"): plain text tabs, the shown one bright and
   underlined, counts muted, and the three tables run edge to edge. Info keeps its own padded cards. */
.term .legacy-chart-head[hidden]{display:none}.term .chart-card{padding:0;border-radius:6px;overflow:hidden}.term #chart{min-height:470px}.term #chartTheses{margin:0 0 22px}.term .ptab i{display:none}.term .tab-kpis{min-width:0}.term-back{display:inline-flex;gap:8px;align-items:center;margin-top:20px;font:600 12px var(--sans);color:var(--muted)}.term-back:hover{color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
#ptabs{--pz:1;display:flex;gap:calc(4px * var(--pz));margin:0;padding:0 calc(8px * var(--pz));overflow-x:auto;min-width:0;border-bottom:1px solid var(--line);scrollbar-width:none}
#ptabs .ptab{display:inline-flex;align-items:center;gap:calc(6px * var(--pz));flex:none;margin:0;padding:calc(18px * var(--pz)) calc(10px * var(--pz)) calc(16px * var(--pz));border:0;border-bottom:2px solid transparent;border-radius:0;background:none;box-shadow:none;transform:none;color:var(--muted);font:600 calc(14px * var(--pz))/1.2 var(--sans);letter-spacing:0;white-space:nowrap;cursor:pointer}
#ptabs .ptab:hover{color:var(--ink-2);transform:none;box-shadow:none}#ptabs .ptab[aria-selected=true]{color:var(--ink);background:none;box-shadow:none;border-bottom-color:var(--brand);border-image:var(--brand-outline) 1}
#ptabs .ptab-word{display:inline-block;white-space:nowrap}#ptabs .ptab-f{display:inline-block;width:.85em;height:1.45em;object-fit:cover;object-position:50% 50%;vertical-align:-.22em;margin:-.3em .02em -.15em 0;pointer-events:none}
#ptabs .activity-count{display:inline;padding:0;border-radius:0;background:none;color:var(--muted);font:500 calc(13px * var(--pz))/1.2 var(--sans);font-variant-numeric:tabular-nums}#ptabs .activity-count:empty{display:none}
#panel-holders,#panel-swaps,#panel-theses{padding:0;gap:0}#nativeTheses .ft-feed{border:0;border-radius:0}
@media(min-width:1100px){#ptabs{--pz:1.3333}}
/* the lower tab row (owner, 29 Sep): a little taller, the tabs on the left and, after a wide gap, your position card at the
   far right (owner's pick "B · fomo position card"): YOUR POSITION | AVG ENTRY | what your fables burned over "Add fable",
   one row split by thin rules; without a holding just "Add fable". The row carries the bottom border the budget counts. */
.ptabs-row{display:flex;flex-wrap:wrap;align-items:stretch;gap:0 calc(6px * var(--pz,1));min-width:0;border-bottom:1px solid var(--line)}
/* Counts keep their full width; the position dock wraps before the tabs get clipped. */
.ptabs-row #ptabs{flex:0 0 auto;flex-wrap:wrap;max-width:100%;overflow:visible;border-bottom:0}
.ptabs-dock{--pz:1;flex:none;display:flex;align-items:center;justify-content:flex-end;margin-left:auto;padding:0 calc(12px * var(--pz));min-width:0}.ptabs-dock:empty{display:none}
.fp-dock{position:relative;display:flex;align-items:center;min-width:0}.fp-dock [hidden]{display:none!important}
.fp-card{display:flex;align-items:stretch;min-width:0;border:1px solid var(--line);border-radius:calc(10px * var(--pz));background:color-mix(in srgb,var(--panel) 70%,var(--bg))}
.fp-cell{display:flex;flex-direction:column;justify-content:center;gap:calc(4px * var(--pz));min-width:0;padding:calc(5px * var(--pz)) calc(14px * var(--pz))}
.fp-rule{flex:none;width:1px;margin:calc(8px * var(--pz)) 0;background:var(--line)}.fp-dock[data-entry=false] .fp-rule-entry{display:none}
.fp-label{font:600 calc(9px * var(--pz))/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.fp-num{font:700 calc(14px * var(--pz))/1.15 var(--mono);color:var(--ink);white-space:nowrap;font-variant-numeric:tabular-nums}
.fp-line{display:inline-flex;align-items:center;gap:calc(7px * var(--pz))}
/* the value opens your Position window; its change is the Fables cards' POSITION chip */
.fp-value{align-items:flex-start;border:0;border-radius:calc(9px * var(--pz)) 0 0 calc(9px * var(--pz));background:none;color:inherit;text-align:left;cursor:pointer;transition:background .12s}.fp-value:hover{background:color-mix(in srgb,var(--brand) 7%,transparent)}.fp-value:hover .fp-num{color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.fp-chip{padding:calc(2px * var(--pz)) calc(7px * var(--pz));border-radius:999px;font:600 calc(11px * var(--pz))/1.3 var(--mono);white-space:nowrap;color:var(--muted);background:color-mix(in srgb,var(--muted) 14%,transparent)}.fp-value[data-direction=up] .fp-chip{color:var(--up);background:color-mix(in srgb,var(--up) 15%,transparent)}.fp-value[data-direction=down] .fp-chip{color:var(--down);background:color-mix(in srgb,var(--down) 15%,transparent)}
.fp-burned{align-items:flex-start;padding-right:calc(10px * var(--pz))}
.fp-burn-line{display:inline-flex;align-items:center;gap:calc(5px * var(--pz));color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font:650 calc(12px * var(--pz))/1.2 var(--mono);white-space:nowrap;font-variant-numeric:tabular-nums}.fp-burn-line[data-status=none]{color:var(--muted);background:none;-webkit-text-fill-color:currentColor;font-weight:500}.fp-burn-line .ft-burn-clock{display:none}
/* "Write a fable": metal text after a dashed-circle plus (fomo's "Add thesis"); in the tab row it wears a solid metal
   outline, drawn by a masked ::before because the button's own background is the text's metal */
.fp-add{display:inline-flex;align-items:center;gap:calc(5px * var(--pz));margin:0;padding:0 calc(4px * var(--pz)) 0 0;border:0;border-radius:calc(6px * var(--pz));color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;font:700 calc(12px * var(--pz))/1.2 var(--sans);white-space:nowrap;cursor:pointer}.fp-add:hover{color:var(--brand-hi,var(--brand));filter:brightness(1.12)}.fp-add:hover .fp-add-ring{stroke-dasharray:none}
.fp-dock>.fp-add .fp-add-icon{width:calc(16px * var(--pz));height:calc(16px * var(--pz))}.fp-dock>.fp-add{padding:calc(8px * var(--pz)) calc(14px * var(--pz)) calc(8px * var(--pz)) calc(11px * var(--pz));position:relative;border:1px solid transparent;border-radius:999px;font-size:calc(13px * var(--pz))}.fp-dock>.fp-add::before{content:'';position:absolute;inset:-1px;border-radius:inherit;padding:1px;background:var(--brand-outline);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.fp-add-icon{flex:none;width:calc(14px * var(--pz));height:calc(14px * var(--pz));fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}.fp-add-ring{stroke-dasharray:2.6 2.2}.fp-add[aria-expanded=true] .fp-add-ring{stroke-dasharray:none}
/* "Write a fable", alone at the row end or inside the position card, is the Buy button's shiny chocolate press (owner, 30 Sep) */
.fp-dock .fp-add{padding:calc(8px * var(--pz)) calc(14px * var(--pz)) calc(8px * var(--pz)) calc(11px * var(--pz));border:1px solid transparent;border-radius:999px;font-size:calc(13px * var(--pz));background:var(--brand-sheen-btn);background-clip:border-box;-webkit-background-clip:border-box;color:var(--brand-ink);-webkit-text-fill-color:currentColor;text-shadow:var(--brand-ink-shadow);box-shadow:var(--brand-bevel)}
.fp-dock .fp-add .fp-add-icon{width:calc(16px * var(--pz));height:calc(16px * var(--pz))}
.fp-dock .fp-add::before{display:none}.fp-dock .fp-add:hover{background:var(--brand-sheen-btn-hover,var(--brand-sheen-btn));color:var(--brand-ink);filter:none}
/* the composer, moved out of the feed into a popover under the card */
.fp-pop{position:absolute;top:calc(100% + 8px);right:0;z-index:40;width:calc(420px * var(--pz));padding:calc(12px * var(--pz)) calc(14px * var(--pz)) calc(14px * var(--pz));border:1px solid var(--line-2);border-radius:calc(12px * var(--pz));background:var(--panel);box-shadow:0 18px 48px rgba(0,0,0,.55),0 0 0 1px color-mix(in srgb,var(--brand) 12%,transparent);color:var(--ink)}
/* the coin page's shell clips what leaves it (terminal-shell.css, overflow:clip): while "Post a Fable" is open it lets the popover
   hang below it, so a coin with no fables yet (a short tab) still shows the whole box and its Post button (6 Oct, live) */
.terminal-shell.term:has(.fp-pop:not([hidden])){overflow-x:clip;overflow-y:visible}
.fp-pop-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:calc(8px * var(--pz))}.fp-pop-title{font:600 calc(10px * var(--pz))/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.fp-pop-x{border:0;background:none;color:var(--muted);font:400 calc(18px * var(--pz))/1 var(--sans);padding:0 calc(2px * var(--pz));cursor:pointer}.fp-pop-x:hover{color:var(--ink)}
.fp-pop .ft-composer{padding:0;border:0;background:none}.fp-pop .ft-composer textarea:focus-visible{outline:none}.fp-pop .ft-hold{margin-top:calc(8px * var(--pz))}
.fp-dock :is(a,button,textarea):focus-visible{outline:2px solid var(--brand);outline-offset:2px}.fp-dock .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}
@media(min-width:1100px){.ptabs-dock{--pz:1.3333}}
/* "Show Fables" (owner, 1 Oct): a real checkbox right after the Fables tab, in the tabs' own muted type (brighter while
   ticked), its box the site's dark check (the alerts settings' .tsb-ck); the whole label is the target */
.ptabs-faces{--pz:1;flex:none;align-self:center;display:inline-flex;align-items:center;gap:calc(5px * var(--pz));margin:0;padding:calc(8px * var(--pz)) calc(3px * var(--pz));border-radius:calc(8px * var(--pz));color:var(--muted);font:600 calc(13px * var(--pz))/1.2 var(--sans);white-space:nowrap;cursor:pointer;user-select:none;-webkit-user-select:none}
.ptabs-faces:hover,.ptabs-faces:has(input:checked){color:var(--ink-2)}
.ptabs-faces input{appearance:none;-webkit-appearance:none;flex:none;display:grid;place-items:center;width:calc(18px * var(--pz));height:calc(18px * var(--pz));margin:0;border:1px solid var(--line-2);border-radius:calc(5px * var(--pz));background:var(--bg);cursor:pointer}
.ptabs-faces input:checked{background:var(--brand-outline);border-color:transparent}
.ptabs-faces input:checked::after{content:'✓';font:900 calc(12px * var(--pz))/1 var(--sans);color:var(--brand-mark)}
.ptabs-faces input:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media(min-width:1100px){.ptabs-faces{--pz:1.3333}}
/* narrower chart columns: the average entry goes first, then the burned line (Add stays). Viewport queries, not container
   ones: the chart column is 55% of the window from 1100px (html zoom .75, which --pz undoes, so these sizes are screen px),
   the window less the 300px buy console below it; phones stack the page and the card wraps under the tabs, right-aligned */
@media(min-width:1100px) and (max-width:1260px),(max-width:980px){.fp-entry,.fp-rule-entry{display:none!important}}
@media(min-width:760px) and (max-width:860px){.fp-burn-line{display:none}.fp-cell{padding-inline:11px}}
@media(max-width:759px){.ptabs-row{flex-wrap:wrap;gap:0}.ptabs-row #ptabs{flex:1 1 100%}.ptabs-dock{flex:1 1 100%;margin:0;padding:8px 10px;border-top:1px solid var(--line)}.ptabs-faces{flex:1 1 100%;align-self:stretch;padding:10px 14px;border-radius:0;border-top:1px solid var(--line)}.fp-pop{width:min(420px,calc(100vw - 24px))}}
@media(max-width:640px){.mast-in{flex-wrap:wrap;gap:10px!important;padding-top:10px!important;padding-bottom:0!important}.mast .nav{display:flex;order:3;flex:1 1 100%;margin:0;max-width:100%;border-top:1px solid var(--line);gap:1px}.mast .nav{gap:5px;padding:8px 2px}.mast .nav a{font-size:12px;padding:8px 9px;white-space:nowrap}.mast .brand-word{font-size:28px}.mast .mast-actions{margin-left:auto}.term #chart{min-height:400px}#ptabs{padding:0 4px}}
@media(max-width:640px){.mast .mast-in{height:auto;min-height:64px}.mast .nav a[data-on=true]::after{bottom:3px}}

/* the "↑ N new fables" pill (owner, 30 Sep): floats at the top of the feed while new fables wait above the reader */
.ft-newwrap{position:sticky;top:10px;z-index:6;height:0;display:flex;justify-content:center;pointer-events:none}
.ft-newpill{pointer-events:auto;display:inline-flex;align-items:center;gap:6px;margin-top:6px;padding:calc(7px * var(--pz)) calc(14px * var(--pz));border:0;border-radius:999px;background:var(--brand-sheen-sm);box-shadow:var(--brand-bevel),0 6px 18px rgba(0,0,0,.5);color:var(--brand-ink);font:700 calc(12px * var(--pz)) var(--sans);cursor:pointer}
.ft-newpill:hover{background:var(--brand-sheen-sm-hover)}.ft-newpill-arw{font-size:1.1em;line-height:1}
.ft-topmark{height:1px}

/* a fired fable's burn reads "🔥 710 [logo] FABLE burned" in white (fable-rich.css .fr-burn); queued ones keep the clock */
.ft-burn.has-rich{background:none;-webkit-text-fill-color:currentColor;color:#f4efe8}.ft-burn.has-rich>:not(.fr-burn){display:none}

/* a new fable's flash as it drops in (fable-theses.js dropIn): the whole card lights up in ember gold behind its text, with a
   bright left edge and rim, then fades over about 2.5 s (owner, 30 Sep: the first, fainter wash was too hard to notice) */
.ft-post{position:relative;isolation:isolate}
.ft-post.ft-enter::after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,color-mix(in srgb,#ffb347 58%,transparent),color-mix(in srgb,#ff8a2a 30%,transparent) 50%,color-mix(in srgb,var(--brand-hi) 16%,transparent));box-shadow:inset 5px 0 0 #ffd089,inset 0 0 0 1px color-mix(in srgb,#ffd089 70%,transparent),0 0 22px color-mix(in srgb,#ff8a2a 35%,transparent);animation:ftFlash 2.6s cubic-bezier(.25,.6,.3,1) forwards}
@keyframes ftFlash{0%,14%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.ft-post.ft-enter::after{animation-duration:1.4s}}
/* the owner's posting decisions (30 Sep): the minute's countdown on Post and on "Write a fable", why the coin's oldest waiting fable waits, and a reply's one image */
.ft-submit[data-wait],.fp-add[data-wait]{font-variant-numeric:tabular-nums}
.ft-wait{flex:1 0 100%;order:9;display:flex;align-items:center;gap:calc(6px * var(--pz));min-width:0;margin:0;color:var(--muted);font:500 calc(12px * var(--pz))/1.45 var(--sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ft-wait[hidden]{display:none}
.ft-wait b{color:var(--ink-2,var(--ink));font-weight:600}
.ft-wait span{overflow:hidden;text-overflow:ellipsis}
.ft-wait .ft-burn-icon{width:calc(13px * var(--pz));height:calc(13px * var(--pz));fill:none;stroke:currentColor}
.ft-reply-form .ft-reply-attach{width:calc(32px * var(--pz));height:auto;min-height:calc(30px * var(--pz));border-radius:4px}
.ft-thread>.fr-thumb,.ft-reply-box>.fr-thumb{margin:8px 0 0}
.ft-thread>.fr-thumb img,.ft-reply-box>.fr-thumb img{max-height:96px}
.ft-reply .fr-img-compact{--fr-max:calc(160px * var(--pz));margin:6px 0 2px}

/* Reply threads (owner, 1 Oct, "A: X-style"; the mock's rules, outputs/design-options-2026-10-01/reply-threads): every reply
   has its own Reply and heart; a reply to a reply sits one step in under its branch's top reply, says whom it answers, and
   a long branch folds behind "Show N more replies". However deep it goes it stays one indent wide (phones too). */
.ft-feed .rm-act{display:flex;align-items:center;gap:calc(16px * var(--pz));margin:2px 0 0;color:var(--muted);font:600 calc(11px * var(--pz))/1 var(--sans)}
.ft-feed .rm-act button{display:inline-flex;align-items:center;gap:5px;margin:0;border:0;padding:3px 0;background:none;color:inherit;font:inherit;cursor:pointer}
.ft-feed .rm-act svg{width:calc(13px * var(--pz));height:calc(13px * var(--pz));fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.ft-feed .rm-act .rm-reply:hover{color:var(--brand);background:var(--brand-sheen-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.ft-feed .rm-act .rm-like{font-variant-numeric:tabular-nums}
/* a liked reply's heart fills red, as the fables' does (#ff3040), and a new like pops it */
.ft-feed .rm-act .rm-like:hover,.ft-feed .rm-act .rm-like[aria-pressed=true]{color:var(--like)}.ft-feed .rm-act .rm-like[aria-pressed=true] svg{fill:currentColor}
.ft-feed .rm-like.ft-pop svg{animation:ft-like-pop .36s cubic-bezier(.2,.9,.3,1.25)}@media(prefers-reduced-motion:reduce){.ft-feed .rm-like.ft-pop svg{animation:none}}
.ft-feed .rm-to{display:block;color:var(--muted);font:500 calc(10.5px * var(--pz))/1.3 var(--sans);margin:1px 0 0}
.ft-feed .rm-to b{color:var(--brand-hi,var(--brand));font-weight:600}
.ft-feed .rm-more{display:inline-block;margin:4px 0 6px;border:0;padding:0;background:none;color:var(--brand-hi,var(--brand));font:650 calc(11.5px * var(--pz))/1.2 var(--sans);cursor:pointer}.ft-feed .rm-more:hover{text-decoration:underline;text-underline-offset:3px}
.ft-feed .rm-nest{margin-left:calc(13px * var(--pz));padding-left:calc(20px * var(--pz));border-left:2px solid color-mix(in srgb,var(--line-2) 90%,transparent)}
/* the reply box: under the fable, or under the reply it answers ("Replying to @x ×") */
.ft-feed .ft-reply-box{margin:2px 0 6px}.ft-feed .rm-nest .ft-reply-box,.ft-feed .ft-replies>.ft-reply-box{padding:2px 0 4px}
.ft-feed .rm-boxto{display:flex;align-items:center;gap:4px;margin:6px 0 0;color:var(--muted);font:500 calc(11px * var(--pz))/1.3 var(--sans)}
.ft-feed .rm-boxto b{color:var(--brand-hi,var(--brand));font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ft-feed .rm-boxto-x{margin-left:4px;border:0;padding:0 4px;background:none;color:var(--muted);font:400 calc(15px * var(--pz))/1 var(--sans);cursor:pointer}.ft-feed .rm-boxto-x:hover{color:var(--ink)}
@media(max-width:640px){.ft-feed .rm-nest{margin-left:11px;padding-left:12px}.ft-feed .rm-act{gap:18px}.ft-feed .rm-act button{padding:5px 0}}
/* (7 Oct) a fable that fires while its card shows "Next in line" (fable-theses.js .ft-fired-now; the chain's fire, fable-fire-moment.js):
   the candle hop, small, as the chart's: the burn tag lifts ~4px and settles (0.52 s), its flame rises off it and fades (~1.1 s), a faint green-then-orange glow */
.ft-burn.ft-fired-now .fr-burn{animation:ft-hop .52s cubic-bezier(.3,1.35,.45,1)}.ft-burn.ft-fired-now .fr-burn-fire{position:relative;display:inline-block;animation:ft-flame-in .52s ease-out}
.ft-burn.ft-fired-now .fr-burn-fire::after{content:'🔥';position:absolute;left:0;top:0;opacity:0;pointer-events:none;animation:ft-flame-lift 1.1s ease-out}.ft-burn.ft-fired-now .fr-burn b{animation:ft-glow 1.1s ease-out}
@keyframes ft-hop{0%{transform:none}38%{transform:translateY(-4px)}70%{transform:translateY(1px)}100%{transform:none}}@keyframes ft-flame-in{0%{transform:scale(.7)}45%{transform:scale(1.18)}100%{transform:none}}
@keyframes ft-flame-lift{0%{opacity:.8;transform:none}100%{opacity:0;transform:translateY(-12px) scale(.6)}}@keyframes ft-glow{0%{text-shadow:0 0 6px rgba(74,222,128,.55)}45%{text-shadow:0 0 6px rgba(251,146,60,.5)}100%{text-shadow:none}}
@media(prefers-reduced-motion:reduce){.ft-burn.ft-fired-now .fr-burn,.ft-burn.ft-fired-now .fr-burn-fire,.ft-burn.ft-fired-now .fr-burn-fire::after,.ft-burn.ft-fired-now .fr-burn b{animation:none}}
