/* Shared, theme-native page actions. Keep editorial headings the focal point. */
.page-title-row { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.page-title-row > :is(h1,h2,h3) { min-width:0; flex:1; }
.page-tools { flex:none; position:relative; margin-top:6px; font:13px/1.4 var(--sans); }
.page-tools-split { display:flex; align-items:stretch; background:var(--surface); border-radius:9px; }
.page-tools button { font:inherit; color:var(--fg-2); border:0; cursor:pointer; }
.page-tools-split > button { display:flex; gap:8px; align-items:center; min-height:38px; padding:8px 12px; background:transparent; border-radius:9px; white-space:nowrap; }
.page-tools-split .page-tools-toggle { padding:8px; border-radius:0 9px 9px 0; background:var(--surface-hover); }
.page-tools-toggle[aria-expanded=true] svg { transform:rotate(180deg); }
.page-tools-menu { position:fixed; inset:auto; margin:0; box-sizing:border-box; max-width:calc(100vw - 24px); max-height:calc(100dvh - 24px); overflow:auto; padding:6px; border:0; border-radius:14px; background:var(--card); color:var(--fg); box-shadow:0 12px 40px #0003,0 2px 8px #0001; }
.page-tools-menu::backdrop { background:transparent; }
.page-tools-menu > button { display:flex; align-items:center; gap:12px; width:100%; padding:12px; text-align:left; border-radius:9px; background:transparent; }
.page-tools-menu svg { flex:none; }
.page-tools-menu strong { display:block; font-size:13px; font-weight:550; color:var(--fg); }
.page-tools-menu small { display:block; font-size:11px; line-height:1.45; margin-top:3px; color:var(--fg-2); }
.page-tools button:focus-visible, #page-markdown button:focus-visible { outline:2px solid var(--fg-2); outline-offset:2px; }
.page-tools button:disabled { cursor:wait; opacity:.65; }
.page-operation-title { font:400 24px/1.2 var(--serif); margin:14px 0 0; }
.operation-context { flex-wrap:wrap; }
.operation-context > .page-title-row { flex-basis:100%; align-items:center; }
/* Social headings live inside a text wrapper. Share the full header grid,
   keeping copy beside the title and provenance beside the description. */
.social-rowhead:has(.page-title-row) { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 16px; }
.social-rowhead > div:has(> .page-title-row) { display:contents; }
.social-rowhead .page-title-row { grid-column:1/-1; align-items:center; gap:8px 16px; }
.social-rowhead .page-title-row > h3 { margin:0; }
.social-rowhead .page-tools { margin:0; }
.social-rowhead:has(.page-title-row) > .social-sample { grid-column:2; grid-row:2; }
#page-markdown { box-sizing:border-box; width:min(820px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:22px; background:var(--card); color:var(--fg); border:0; border-radius:16px; box-shadow:0 20px 80px #0004; }
#page-markdown::backdrop { background:var(--backdrop-soft,#0006); }
#page-markdown header, #page-markdown footer { display:flex; align-items:center; justify-content:space-between; gap:16px; }
#page-markdown h2 { font:500 18px/1.4 var(--sans); margin:0; }
#page-markdown p, #page-markdown footer span { font:12px/1.5 var(--sans); color:var(--fg-2); }
#page-markdown button { display:inline-flex; align-items:center; justify-content:center; min-height:40px; border:0; border-radius:8px; background:var(--surface); color:var(--fg); padding:8px 12px; font:13px var(--sans); cursor:pointer; }
#page-markdown textarea { box-sizing:border-box; display:block; width:100%; height:min(54dvh,560px); margin:16px 0; padding:16px; resize:vertical; border:0; border-radius:8px; background:var(--bg); color:var(--fg); font:12px/1.7 var(--mono); }
@media (hover:hover) { .page-tools button:hover, #page-markdown button:hover { background:var(--surface-hover); color:var(--fg); } }
@media (max-width:700px) {
  .page-title-row { flex-wrap:wrap; gap:0; }
  .page-title-row > :is(h1,h2,h3) { flex-basis:100%; }
  .page-tools { margin:0 0 18px; }
  .page-tools-split > button { min-height:40px; }
  .social-rowhead .page-title-row > h3 { flex-basis:auto; }
  .social-rowhead:has(.page-title-row) p { grid-column:1/-1; grid-row:2; }
  .social-rowhead:has(.page-title-row) > .social-sample { grid-column:1/-1; grid-row:3; }
  #page-markdown { padding:16px; }
  #page-markdown footer { flex-wrap:wrap; gap:8px; }
}
