/*! lines 701-799 — copied verbatim from the demo's app.css lines 701–799 (commit 7df0d35). Phase 1 of demo-port: do not retype values here. */

ip-article-byline{display:block;position:relative;}/* the caret opens the drawer; the name and the avatar go to the author page
   (Ronen 2026-08-18) — three targets, three jobs, one row */
/* button reset only — the icon font, its size and its colour stay with
   `.author .dropdown-trigger` above, which the button matches as well */



ip-article-byline .byline .byline__author .dropdown-trigger{appearance:none;background:none;border:0;padding:0;margin:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;min-width:24px;min-height:24px;}
ip-article-byline .byline .byline__author .name{text-decoration:none;cursor:pointer;}
ip-article-byline .byline .byline__author .name:hover{text-decoration:underline;}
.byline__author .byline__avatar-link{display:inline-flex;border-radius:50%;}
ip-article-byline .byline__row .dropdown-trigger{transition:transform .25s ease;}/* e006 (caret-down-bold) rotated = e031 (caret-up-bold) — animated instead of glyph swap */


ip-article-byline[data-open="author"] .byline__row .dropdown-trigger{transform:rotate(180deg);}
/* hover + pressed both render the `brand-inverse` variant (Ronen 2026-07-26):
   states are not Figma variants, but they reuse the inverse variant's tokens. */
.action-chip:hover,
.action-chip--active{background:var(--bg-component-action-brand-inverse);border-color:var(--border-action-brand-inverse);}
.action-chip:hover .lbl,
.action-chip:hover .ic,
.action-chip--active .lbl,
.action-chip--active .ic{color:var(--content-action-brand-inverse);}/* drawers push open: grid-rows 0fr->1fr animates height without fixed values */


.byline__fold{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease;}
.byline__fold-inner{overflow:hidden;min-height:0;}
ip-article-byline[data-open="author"] .byline__fold--author,
ip-article-byline[data-open="ai"] .byline__fold--ai{grid-template-rows:1fr;}
.byline__drawer{display:flex;position:relative;background:var(--bg-basic-white);border:var(--bw-thin) solid var(--border-normal);border-radius:var(--radius-md);padding:var(--sp-normal);margin-top:var(--sp-snug);flex-direction:column;gap:var(--sp-tight);align-items:flex-start;opacity:0;transition:opacity .3s ease;}
ip-article-byline[data-open="author"] .byline__fold--author .byline__drawer,
ip-article-byline[data-open="ai"] .byline__fold--ai .byline__drawer{opacity:1;}
.byline__close{position:absolute;top:9px;left:9px;background:none;border:0;margin:0;padding:0;cursor:pointer;font-family:var(--typo-font-icon);font-size:var(--typo-icon-xs-font-size);line-height:var(--typo-icon-xs-line-height);color:var(--content-primary);}
.body-text{margin:0;width:100%;color:var(--content-primary);text-align:right;}
.body-text--bold{font-weight:var(--typo-body-sm-bold-font-weight);}
.follow-row{display:flex;gap:var(--sp-tight);align-items:center;}
.follow-row .ic{font-family:var(--typo-font-icon);font-size:var(--typo-icon-md-font-size);line-height:var(--typo-icon-md-line-height);color:var(--content-primary);}
.byline__drawer-title{margin:0;width:100%;color:var(--content-primary);text-align:right;}
.byline__drawer-note{margin:0;width:100%;color:var(--content-primary);text-align:right;}
.byline__drawer-rule{width:100%;border-top:var(--bw-thin) solid var(--border-hairline);}
/* the discs are the browser’s, and the demo draws them: the normalize under this sheet strips
   every list marker, so this one says it wants them */
.byline__list{list-style:disc;margin:0;width:100%;padding-inline-start:24px;color:var(--content-primary);text-align:right;}
.byline__share{display:flex;position:absolute;top:78px;left:44px;z-index:10;width:180px;background:var(--bg-basic-white);border:var(--bw-thin) solid var(--border-normal);border-radius:var(--radius-md);box-shadow:0 0 5px 0 var(--effect-shadow-soft);padding:var(--sp-loose) var(--sp-snug) var(--sp-normal);flex-direction:column;gap:var(--sp-tight);align-items:flex-start;opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .2s ease, transform .2s ease, visibility 0s linear .2s;}
ip-article-byline[data-open="share"] .byline__share{opacity:1;visibility:visible;transform:none;transition:opacity .2s ease, transform .2s ease;}
.share-line{background:none;border:0;margin:0;padding:0;cursor:pointer;display:flex;gap:var(--sp-tight);align-items:center;color:var(--content-primary);}
.share-line .ic{font-family:var(--typo-font-icon);font-size:var(--typo-icon-md-font-size);line-height:var(--typo-icon-md-line-height);}
.byline__separator{width:100%;border-top:var(--bw-thin) dotted var(--border-hairline);}