/* shared/asset-actions.css (ASSET1) - Save and Share on pages and images.
   Page row: icon and word, always visible. Image control: icons only, 44px targets, a small corner control.
   Hover devices: image icons arrive on hover or focus with the site's breath (opacity and blur on --tbx-exhale, out on the slower leave).
   Touch (no hover): always visible but quiet, no motion. Motion off (body.reduced): they simply show or hide.
   `@media (hover: hover)` is a device capability, never an OS motion gate. 16px type floor; radii 8px or less; no pills. */
.ac-ico{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.ac-ico .fill{fill:currentColor}
.ac-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:44px;min-height:44px;box-sizing:border-box;padding:0 12px;border:0;border-radius:6px;
  background:none;color:inherit;font-family:var(--mono,ui-monospace,monospace);font-size:16px;line-height:1;text-transform:lowercase;cursor:pointer}
.ac-btn:focus-visible{outline:2px solid var(--nav-accent,#a8763c);outline-offset:1px}

/* the page row */
.ac-row{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 6px;max-width:100%}
.ac-row .ac-btn{border:1px solid color-mix(in srgb,currentColor 28%,transparent);color:inherit;padding:0 14px 0 12px}
.ac-row .ac-btn:hover{background:color-mix(in srgb,currentColor 9%,transparent)}
.ac-row .ac-btn[aria-pressed="true"]{border-color:var(--nav-accent,#a8763c);box-shadow:inset 0 0 0 1px var(--nav-accent,#a8763c)}

/* the image control: over the image's bottom-right corner, never covering the image's own tap */
.ac-host.ac-static{position:relative}
.ac-img{position:absolute;z-index:4;display:flex;gap:2px;padding:2px;border-radius:8px;background:color-mix(in srgb,#0a0908 62%,transparent);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(241,235,224,.14);color:#f1ebe0}
.ac-img[hidden]{display:none}
.ac-img .ac-btn{padding:0}
.ac-img .ac-btn:hover{background:rgba(241,235,224,.14)}
.ac-img .ac-btn[aria-pressed="true"]{box-shadow:inset 0 0 0 1.5px #f0c27b}
.ac-img .ac-btn:focus-visible{outline-color:#f0c27b}
@media (hover:hover){
  .ac-img{opacity:0;filter:blur(4px);transition:opacity 1.1s var(--tbx-exhale,cubic-bezier(.4,0,.2,1)),filter 1.1s var(--tbx-exhale,cubic-bezier(.4,0,.2,1))}
  .ac-host:hover>.ac-img,.ac-img:focus-within,.ac-img.ac-hold{opacity:1;filter:blur(0);transition-duration:.9s}
  body.reduced .ac-img{transition:none;filter:none}
}
@media (hover:none){
  .ac-img{opacity:.6;filter:none;transition:none}
}

/* the one share menu and its status line (fixed, so no column or image clips them) */
.ac-menu,.ac-said{position:fixed;z-index:400;box-sizing:border-box;border-radius:8px;background:#f1ebe0;color:#0a0908;box-shadow:0 14px 34px -12px rgba(0,0,0,.85);
  font-family:var(--serif,Georgia,serif);font-size:16px;line-height:1.4}
.ac-menu{width:min(320px,calc(100vw - 16px));padding:6px}
.ac-menu[hidden],.ac-said[hidden]{display:none}
.ac-menu [role="menuitem"]{display:grid;grid-template-columns:20px minmax(0,1fr);gap:10px;width:100%;box-sizing:border-box;padding:10px;border:0;border-radius:6px;background:none;text-align:left;cursor:pointer;color:#4a443b;font:inherit}
.ac-menu [role="menuitem"]:hover,.ac-menu [role="menuitem"]:focus-visible{background:rgba(10,9,8,.07);outline:none;box-shadow:inset 0 0 0 2px #a8763c}
.ac-menu .ac-ico{margin-top:2px;color:#0a0908}
.ac-menu b,.ac-said b{display:block;font-family:var(--display,inherit);font-weight:800;font-size:17px;line-height:1.3;color:#0a0908}
.ac-said{display:flex;align-items:flex-start;gap:10px;width:max-content;max-width:min(320px,calc(100vw - 16px));padding:11px 13px}
.ac-said.manual{width:min(320px,calc(100vw - 16px))}
.ac-said .ac-ico{margin-top:2px;color:#0a0908}
.ac-said.in{animation:acSaid .32s var(--tbx-exhale,cubic-bezier(.4,0,.2,1)) both}
@keyframes acSaid{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
body.reduced .ac-said.in{animation:none}
.ac-fb{display:block;width:100%;box-sizing:border-box;margin-top:8px;padding:8px;border:1px solid #a8763c;border-radius:6px;background:#fff;color:#0a0908;font-family:var(--mono,monospace);font-size:16px;line-height:1.4;resize:vertical;user-select:text;-webkit-user-select:text}
.ac-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media print{.ac-row,.ac-img,.ac-menu,.ac-said{display:none!important}}

/* FIX1: a host can set pointer-events:none on a wrapper (the Seed Bank question block does, so its photo stays clickable).
   Our controls must always take the click, or it falls through to whatever is behind them. */
.ac-row,.ac-row .ac-btn,.ac-img,.ac-img .ac-btn,.ac-menu,.ac-said{pointer-events:auto}
.ac-open{text-decoration:none;white-space:nowrap}