/* Virtual Arc action surfaces. Visual reference: Ali Imam's Liquid Glass Button
   https://21st.dev/@designali-in/components/liquid-glass-button
   Independently implemented for shared React and static-page navigation. */
:root {
  --action-face: linear-gradient(165deg, #dce9ff 0%, #adc9ff 38%, #89aff1 75%, #bbd5ff 100%);
  --action-edge: #c4d9ff;
  --action-shadow: inset 0 1px 1px #fff, inset 1px 0 1px #edf5ffb3, inset 0 -2px 3px #34599480, 0 3px 6px #0002, 0 10px 20px -12px #0006;
  --action-ease: cubic-bezier(.16, 1, .3, 1);
}
/* Repeated classes deliberately outrank the older page-specific skins. */
.studio-button.studio-button, .studio .contact-book-button,
.studio #contact .contact-form-sheet .btn-primary,
.work-button.work-button, .journal-button.journal-button,
.wrap .cta a, .studio .arc-send, .studio .arc-handoff a,
.studio-nav .desktop-links > .nav-agent-link,
.studio-nav .studio-mobile-menu > .nav-agent-link {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid var(--action-edge);
  border-radius: 100px;
  background: var(--action-face);
  color: #142441;
  box-shadow: var(--action-shadow);
  font-weight: 600;
  text-decoration: none;
  transition: box-shadow 280ms var(--action-ease), filter 280ms var(--action-ease), translate 280ms var(--action-ease), scale 180ms var(--action-ease);
}
:is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link)::before,
.wrap .cta a::before, .studio .arc-handoff a::before {
  content: '';
  pointer-events: none;
  position: absolute;
  z-index: -1;
  inset: -60% -30%;
  width: auto;
  height: auto;
  border-radius: 0;
  background: linear-gradient(115deg, transparent 36%, #ffffff00 40%, #ffffff80 49%, #ffffff00 58%, transparent 64%);
  translate: -65% 0;
  transition: translate 650ms var(--action-ease);
}
@media (hover: hover) {
  :is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link):not(:disabled):hover,
  .wrap .cta a:hover, .studio .arc-handoff a:hover {
    filter: brightness(1.07);
    translate: 0 -2px;
  }
  :is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link):not(:disabled):hover::before,
  .wrap .cta a:hover::before, .studio .arc-handoff a:hover::before { translate: 65% 0; }
}
:is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link):not(:disabled):active,
.wrap .cta a:active, .studio .arc-handoff a:active { translate: 0 1px; scale: .98; }
.studio #contact .contact-form-sheet .btn-primary { min-height: 54px; padding-inline: 24px; }
.studio .arc-send { border-radius: 50%; }
.studio .arc-send:disabled, .studio #contact .contact-form-sheet .btn-primary:disabled {
  background: #29394e; border-color: #46566d; color: #a7b5cb; box-shadow: inset 0 1px 1px #ffffff0d;
  opacity: .65; cursor: not-allowed; translate: none; scale: 1; filter: none;
}
/* Graphite glass keeps secondary actions recognizable without competing. */
.studio-nav .nav-book, .work-button.work-button-outline,
.studio-nav .studio-menu-button, .studio .film-control,
.studio .arc-console-header button, .journal-filter.journal-filter {
  border: 1px solid #596170;
  border-radius: 100px;
  background: linear-gradient(155deg, #303740, #191e27 65%, #293343);
  color: #e6edf8;
  box-shadow: inset 0 1px 1px #ffffff38, inset 0 -1px 2px #0009, 0 3px 7px #0003;
  transition: border-color 220ms, background-color 220ms, box-shadow 220ms, scale 180ms var(--action-ease);
}
.studio-nav .nav-book:hover, .work-button.work-button-outline:hover,
.studio-nav .studio-menu-button:hover, .studio .arc-console-header button:not(:disabled):hover {
  border-color: #a2bce2; color: #fff;
  background: linear-gradient(155deg, #3a4555, #263244 65%, #35465e);
}
.studio-nav .studio-menu-button { border-radius: 50%; }
.studio .arc-console-header button { padding-inline: 14px; gap: 8px; }
.studio .arc-console-header button:disabled { opacity: .4; }
.journal-filter.journal-filter { margin: 3px; min-height: 44px; background: #1a1e25; box-shadow: none; }
.journal-filter.journal-filter[aria-pressed=true] { background: var(--action-face); color: #142441; border-color: var(--action-edge); box-shadow: var(--action-shadow); }
/* Prompt starters are actions, while retaining the assistant's reading rhythm. */
.studio .arc-starts { gap: 9px; }
.studio .arc-starts button { padding: 13px 15px; border: 1px solid #485a73; border-radius: 12px; background: linear-gradient(150deg, #26384e, #192538); box-shadow: inset 0 1px 1px #b3d1ff1a; }
.studio .arc-starts button:hover { border-color: #94b6e8; color: #fff; background: #2b3e59; }
.studio-nav .desktop-links > .nav-agent-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 9px 17px; white-space: nowrap; }
.studio-nav .desktop-links > .nav-agent-link::after { content: ''; width: 7px; height: 7px; border-top: 1.5px solid; border-right: 1.5px solid; }
.studio-nav .desktop-links > .nav-agent-link:hover { color: #142441; border-color: #e3edff; }
.studio-nav .studio-mobile-menu > .nav-agent-link { padding: 13px 20px; margin-block: 14px; gap: 12px; }
.studio-nav .studio-mobile-menu > .nav-agent-link svg { margin-left: auto; }
:is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link, .journal-filter):focus-visible,
.wrap .cta a:focus-visible, .studio .arc-handoff a:focus-visible { outline: 2px solid #bed4ff; outline-offset: 4px; }
.studio #contact .contact-form-sheet .btn-primary:focus-visible { outline-color: #244c92; }
@media (min-width: 1100px) and (max-width: 1200px) {
  .studio-nav .desktop-links { gap: 14px; }
  .studio-nav .studio-nav-inner { gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  :is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link),
  .wrap .cta a, .studio .arc-handoff a { transition: none; translate: none; scale: 1; }
  :is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link)::before,
  .wrap .cta a::before, .studio .arc-handoff a::before { display: none; }
}
@media (forced-colors: active) {
  :is(.studio-button, .contact-book-button, .btn-primary, .work-button, .journal-button, .arc-send, .nav-agent-link) { border: 1px solid ButtonText; box-shadow: none; }
}
/* Small utilities share the edge and press treatment at their own scale. */
.studio .arc-footer-motion, .work-motion.work-motion, .journal-motion.journal-motion,
.motion-toggle.motion-toggle, .journal-reset.journal-reset, .work-results-status button {
  min-height: 44px; padding: 8px 13px; border: 1px solid #48505e;
  border-radius: 100px; color: #c9d3e3; background: #191e27;
  box-shadow: inset 0 1px 1px #ffffff12; text-decoration: none;
}
:is(.arc-footer-motion, .work-motion, .journal-motion, .motion-toggle, .journal-reset):hover { border-color: #9db7db; color: #edf3ff; }
.studio .capability-tab, .studio .product-tabs button { transition: background-color 220ms, border-color 220ms; }
.studio .capability-tab:hover, .studio .product-tabs button:hover { background-color: #adc9ff0c; }
/* Older static page skins declare these three properties important. */
.wrap .cta a { background: var(--action-face) !important; color: #142441 !important; border-radius: 100px !important; }