[data-tool-page] {
  --tool-ink: #17130f;
  --tool-espresso: #0b0a08;
  --tool-paper-light: #f8f4ed;
  --tool-white: #fffdf9;
  --tool-cognac: #d4754e;
  --tool-cognac-dark: #9a4f2c;
  --tool-muted: #756e66;
  --tool-line: #d8d0c5;
  --tool-display: 'Satoshi', 'Switzer', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --tool-sans: 'Switzer', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --tool-ease: cubic-bezier(.19, 1, .22, 1);
  --tool-ease-ui: cubic-bezier(.2, .7, .2, 1);
}

[data-tool-page] [data-tool-opener] {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: min(840px, calc(100svh - 60px));
  overflow: hidden;
  padding: calc(60px + clamp(72px, 7vw, 104px)) 0 clamp(72px, 6vw, 96px);
  background: var(--tool-espresso);
  color: var(--tool-white);
}

[data-tool-page] [data-tool-opener]::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -2;
  background-image:linear-gradient(90deg, rgba(11,10,8,.9) 0%, rgba(11,10,8,.74) 48%, rgba(11,10,8,.58) 100%),
    linear-gradient(180deg, rgba(11,10,8,.2) 0%, transparent 46%, rgba(11,10,8,.5) 100%),
    url('/_lumina/assets/hero/dusk-hero-1600.jpg');background-image:linear-gradient(90deg, rgba(11,10,8,.9) 0%, rgba(11,10,8,.74) 48%, rgba(11,10,8,.58) 100%),
    linear-gradient(180deg, rgba(11,10,8,.2) 0%, transparent 46%, rgba(11,10,8,.5) 100%),
    image-set(url('/_lumina/assets/_derived/hero/dusk-hero-1600-1400.avif') type("image/avif"), url('/_lumina/assets/hero/dusk-hero-1600.jpg') type("image/jpeg"));
  background-position: center 54%;
  background-size: cover;
  transform: scale(1.025);
  animation: tool-dusk-drift 24s ease-in-out infinite alternate;
}

[data-tool-page] [data-tool-opener]::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: radial-gradient(ellipse 74% 82% at 50% 52%, transparent 42%, rgba(11,10,8,.34) 100%), var(--grain);
  background-size: cover, 195px 195px;
  opacity: .46;
  pointer-events: none;
}

[data-tool-page] [data-tool-intro] {
  display: grid;
  grid-template-columns: minmax(0,1.12fr) minmax(430px,.88fr);
  column-gap: clamp(48px,5vw,80px);
  align-items: center;
}

[data-tool-page] [data-tool-intro] h1 {
  max-width: 16ch;
  margin: 0;
  color: var(--tool-white);
  font: 400 clamp(50px,4.9vw,68px)/1 var(--tool-display);
  letter-spacing: -.045em;
  text-wrap: balance;
}

[data-tool-page] [data-tool-intro-side] {
  max-width: 500px;
  margin: 0;
  padding-left: clamp(28px,3vw,42px);
  border-left: 1px solid rgba(255,255,255,.16);
}

[data-tool-page] [data-tool-intro-side] > p {
  margin: 0;
  color: rgba(255,255,255,.68);
  font-size: clamp(17px,1.45vw,20px);
  line-height: 1.52;
}

[data-tool-page] [data-tool-start] {
  display: block;
  margin-top: 32px;
  padding-top: 28px;
  border-top: 1px solid rgba(255,255,255,.18);
}

[data-tool-page] [data-tool-start] > label {
  display: block;
  padding-bottom: 12px;
  color: rgba(255,255,255,.6);
  font-size: 13px;
  line-height: 1.3;
}

[data-tool-page] [data-tool-start-control] {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 10px;
  align-items: center;
  min-width: 0;
  min-height: 60px;
  padding: 6px 7px 6px 18px;
  border: 1px solid rgba(255,255,255,.28);
  background: rgba(255,255,255,.045);
  transition: border-color .16s var(--tool-ease-ui), background-color .16s var(--tool-ease-ui), box-shadow .16s var(--tool-ease-ui);
}

[data-tool-page] [data-tool-start-control]:focus-within {
  border-color: rgba(212,117,78,.84);
  background: rgba(255,255,255,.075);
  box-shadow: 0 0 0 3px rgba(212,117,78,.18);
}

[data-tool-page] [data-tool-start-control] input {
  width: 100%;
  min-width: 0;
  height: 46px;
  padding: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--tool-white);
  caret-color: var(--tool-cognac);
  font: 400 17px/1.25 var(--tool-sans);
  letter-spacing: -.01em;
}

[data-tool-page] [data-tool-start-control] input::placeholder { color: rgba(255,255,255,.48); opacity: 1; }

[data-tool-page] [data-tool-start-control] button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 46px;
  padding: 0 18px;
  border: 0;
  border-radius: 999px;
  background: var(--tool-white);
  color: var(--tool-ink);
  font: 500 15px/1 var(--tool-display);
  cursor: pointer;
}

[data-tool-page] [data-tool-start-control] button svg {
  width: 18px;
  height: 18px;
  transition: transform .34s var(--tool-ease);
}

[data-tool-page] [data-tool-start-control] button:hover svg { transform: translate(3px,-3px); }

[data-tool-page] [data-tool-studio] {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: block;
  overflow: hidden;
  background: var(--tool-paper-light);
}

[data-tool-page] [data-tool-studio-shell] { display: grid; grid-template: 72px minmax(0,1fr) / minmax(0,1fr); height: 100svh; }

[data-tool-page] [data-tool-stage-toolbar] {
  position: relative;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 24px;
  min-height: 72px;
  padding: 0 clamp(22px,3vw,44px);
  border-bottom: 1px solid rgba(255,255,255,.12);
  background: var(--tool-espresso);
  color: var(--tool-white);
}

[data-tool-page] [data-tool-studio-brand] { display: flex; align-items: center; width: 110px; flex: none; }
[data-tool-page] [data-tool-studio-brand] img { display: block; width: 110px; }
[data-tool-page] [data-tool-stage-toolbar] > strong { overflow: hidden; margin-right: auto; color: rgba(255,255,255,.64); font: 400 14px/1.2 var(--tool-sans); text-overflow: ellipsis; white-space: nowrap; }

[data-tool-page] [data-tool-toolbar-actions] { display: flex; align-items: center; gap: 4px; margin-left: auto; }
[data-tool-page] [data-tool-toolbar-actions] button,
[data-tool-page] [data-tool-toolbar-actions] a { min-height: 42px; font-family: var(--tool-sans); }

[data-tool-page] [data-tool-studio-close] {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  flex: none;
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 50%;
  background: transparent;
  color: var(--tool-white);
  cursor: pointer;
}
[data-tool-page] [data-tool-studio-close] svg { width: 18px; height: 18px; }

[data-tool-page] [data-tool-studio-grid] { min-width: 0; min-height: 0; overflow: auto; scrollbar-gutter: stable; }
[data-tool-page] [data-tool-studio]:not(.is-preparing):not(.has-result):not(.has-error) [data-tool-studio-grid] { display: grid; place-items: center; padding: clamp(42px,7vw,96px) 22px; }

[data-tool-page] [data-tool-brief-panel] {
  display: grid;
  grid-template-columns: minmax(0,.8fr) minmax(360px,1.2fr);
  gap: clamp(56px,8vw,128px);
  align-items: start;
  width: min(100%,1040px);
}

[data-tool-page] [data-tool-brief-copy] h2 {
  max-width: 14ch;
  margin: 0;
  font: 400 clamp(42px,4.2vw,58px)/1 var(--tool-display);
  letter-spacing: -.04em;
  text-wrap: balance;
}

[data-tool-page] [data-tool-brief-copy] p { max-width: 39ch; margin: 28px 0 0; color: var(--tool-muted); font-size: 17px; line-height: 1.55; }
[data-tool-page] [data-tool-brief-form] { display: flex; flex-direction: column; min-height: 0; padding-top: 6px; }

@keyframes tool-dusk-drift { to { transform: scale(1.065) translate3d(-.35%,.4%,0); } }


[data-tool-page] .newsletter-article-shell { width: min(1320px, calc(100% - 44px)); }

@media (max-width: 900px) {
  [data-tool-page] [data-tool-opener] { padding: calc(56px + 88px) 0 88px; }
  [data-tool-page] [data-tool-intro] { grid-template-columns: 1fr; gap: 48px; align-items: start; }
  [data-tool-page] [data-tool-intro] h1 { max-width: 100%; }
  [data-tool-page] [data-tool-intro-side] { max-width: 580px; padding: 28px 0 0; border-top: 1px solid rgba(255,255,255,.16); border-left: 0; }
  [data-tool-page] [data-tool-brief-panel] { grid-template-columns: 1fr; gap: 48px; width: min(100%,620px); }
  [data-tool-page] [data-tool-brief-copy] h2 { max-width: 12ch; }
}

@media (max-width: 760px) {
  [data-tool-page] [data-tool-studio-shell] { grid-template-rows: 64px minmax(0,1fr); }
  [data-tool-page] [data-tool-stage-toolbar] { min-height: 64px; gap: 12px; padding-inline: 16px; }
  [data-tool-page] [data-tool-stage-toolbar] > strong { display: none; }
  [data-tool-page] [data-tool-studio-brand],
  [data-tool-page] [data-tool-studio-brand] img { width: 92px; }
  [data-tool-page] [data-tool-studio-close] { width: 38px; height: 38px; }
  [data-tool-page] [data-tool-toolbar-actions] { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
  [data-tool-page] [data-tool-toolbar-actions]::-webkit-scrollbar { display: none; }
}

@media (max-width: 560px) {
  [data-tool-page] [data-tool-opener] { min-height: calc(100svh - 56px); padding: calc(56px + 56px) 0 56px; }
  [data-tool-page] [data-tool-intro] { gap: 34px; }
  [data-tool-page] [data-tool-intro] h1 { font-size: clamp(34px,8.8vw,38px); line-height: 1; }
  [data-tool-page] [data-tool-intro-side] { margin: 0; padding-top: 22px; }
  [data-tool-page] [data-tool-intro-side] > p { font-size: 17px; }
  [data-tool-page] [data-tool-start] { margin-top: 28px; padding-top: 22px; }
  [data-tool-page] [data-tool-start-control] { grid-template-columns: 1fr; gap: 8px; padding: 9px; }
  [data-tool-page] [data-tool-start-control] input { padding-inline: 5px; font-size: 16px; }
  [data-tool-page] [data-tool-start-control] button { width: 100%; min-height: 46px; padding: 0 15px; border-radius: 999px; }
  [data-tool-page] [data-tool-start-control] button span { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  [data-tool-page] [data-tool-studio]:not(.is-preparing):not(.has-result):not(.has-error) [data-tool-studio-grid] { place-items: start center; padding: 28px 22px 70px; }
  [data-tool-page] [data-tool-brief-panel] { gap: 24px; }
  [data-tool-page] [data-tool-brief-copy] h2 { max-width: 14ch; font-size: clamp(32px,8.7vw,38px); }
  [data-tool-page] [data-tool-brief-copy] p { margin-top: 14px; font-size: 15px; }
  [data-tool-page] .newsletter-article-shell { width: calc(100% - 44px); }
}

@media (prefers-reduced-motion: reduce) {
  [data-tool-page] [data-tool-opener]::before { animation: none; transform: none; }
  [data-tool-page] [data-tool-start-control] button svg { transition: none; }
}