[data-tool-embed] { position: relative; }
[data-tool-embed] [data-embed-stage][hidden] { display: none; }
[data-tool-embed] [data-embed-stage] { grid-column: 1 / -1; min-width: 0; width: 100%; }
.tool-embed__controls { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .6rem .75rem; background: #f4f2ec; border-bottom: 1px solid #d9d5ca; }
.tool-embed__title { margin-right: auto; font-weight: 700; }
.tool-embed__controls button { min-height: 2.5rem; padding: .4rem .8rem; border: 1px solid #c6c0b3; border-radius: .5rem; background: white; color: #27251f; font: inherit; cursor: pointer; }
.tool-embed__frame { display: block; width: 100%; height: min(78vh, 900px); min-height: 520px; border: 0; background: #f4f2ec; }
.tool-embed--expanded { position: fixed !important; inset: 0; z-index: 10000; display: flex; width: auto; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; flex-direction: column; overflow: auto; background: #f4f2ec; }
.tool-embed--expanded > :not([data-embed-stage]) { display: none !important; }
.tool-embed--expanded [data-embed-stage] { display: flex; flex: 1; min-height: 0; flex-direction: column; }
.tool-embed--expanded .tool-embed__frame { flex: 1; width: 100%; height: 100%; min-height: 0; }
@media (max-width: 640px) { .tool-embed__frame { height: 78vh; min-height: 460px; } }
@media (max-width: 640px) {
  .tool-embed--active {
    display: flex;
    width: 100vw;
    min-width: 0;
    margin-inline: calc(50% - 50vw);
    padding: 0;
    flex-direction: column;
    align-items: stretch;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .tool-embed--active > :not([data-embed-stage]) { display: none !important; }
  .tool-embed--active [data-embed-stage] { display: flex; min-width: 0; flex-direction: column; }
  .tool-embed--active .tool-embed__frame { width: 100%; min-width: 0; }
}