/* YEB Core — public tool stage shell v0.8.2 */
.yeb-tool-stage{--yeb-stage-green:#004741;--yeb-stage-deep:#002d29;--yeb-stage-paper:#f8f6ef;width:min(1240px,calc(100% - 32px));margin:clamp(28px,5vw,72px) auto;padding:clamp(16px,2.4vw,28px);border-radius:18px;background:var(--yeb-stage-deep);box-shadow:0 28px 70px rgba(0,45,41,.16);scroll-margin-top:92px;position:relative;isolation:isolate}
.yeb-tool-stage::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;opacity:.34;background-image:radial-gradient(rgba(248,246,239,.3) 1px,transparent 1px);background-size:22px 22px;mask-image:linear-gradient(90deg,#000,transparent 58%)}
.yeb-tool-stage-head{padding:clamp(14px,2.4vw,30px) clamp(8px,1.8vw,22px) clamp(22px,3vw,34px);color:var(--yeb-stage-paper)}
.yeb-tool-stage-kicker{display:block;font-size:11px;line-height:1.2;font-weight:750;letter-spacing:.18em;text-transform:uppercase;color:#d2c5a7;margin-bottom:12px}
.yeb-tool-stage-head h2{color:inherit;margin:0;max-width:900px;font-size:clamp(27px,3.4vw,48px);line-height:1.06;letter-spacing:-.035em;text-wrap:balance}
.yeb-tool-stage-head p{color:#c9d7d2;max-width:780px;margin:14px 0 0;font-size:clamp(15px,1.3vw,18px);line-height:1.65}
.yeb-tool-frame-shell{overflow:hidden;border-radius:12px;background:var(--yeb-stage-paper);border:1px solid rgba(248,246,239,.35);box-shadow:0 16px 42px rgba(0,0,0,.15)}
.yeb-tool-frame{display:block;width:100%;border:0;background:var(--yeb-stage-paper)}
.yeb-tool-sticky-cta{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:9998;display:flex;align-items:center;justify-content:space-between;gap:20px;min-width:220px;padding:14px 18px;border-radius:999px;background:#004741;color:#f8f6ef!important;border:1px solid rgba(248,246,239,.28);box-shadow:0 16px 38px rgba(0,45,41,.28);text-decoration:none!important;font-size:14px;font-weight:700;line-height:1.2;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .2s ease,transform .2s ease,box-shadow .2s ease}
.yeb-tool-sticky-cta.is-visible{opacity:1;transform:translateY(0);pointer-events:auto}.yeb-tool-sticky-cta:hover{box-shadow:0 20px 44px rgba(0,45,41,.36)}.yeb-tool-sticky-cta span{font-size:18px}
@media(max-width:700px){.yeb-tool-stage{width:calc(100% - 20px);padding:10px;border-radius:14px;margin:32px auto}.yeb-tool-stage-head{padding:16px 10px 22px}.yeb-tool-stage-head h2{font-size:29px}.yeb-tool-stage-head p{font-size:15px}.yeb-tool-frame-shell{border-radius:9px}.yeb-tool-sticky-cta{left:14px;right:14px;bottom:max(12px,env(safe-area-inset-bottom));min-width:0;width:auto;padding:14px 17px}}
@media(prefers-reduced-motion:reduce){.yeb-tool-sticky-cta{transition:none}}

/* v0.8.5 — generic live metric bridge for auto-height external tools.
   The metric is rendered in the parent WordPress page so it can remain truly
   viewport-fixed while a tall iframe is auto-resized. */
.yeb-tool-live-metric{display:none}
@media(max-width:700px){
  .yeb-tool-live-metric{position:fixed;left:12px;right:12px;bottom:max(10px,env(safe-area-inset-bottom));z-index:9999;align-items:center;justify-content:space-between;gap:12px;width:auto;min-height:64px;padding:9px 13px;border:1px solid rgba(248,246,239,.22);border-radius:16px;background:rgba(0,71,65,.97);color:#f8f6ef;box-shadow:0 16px 38px rgba(0,45,41,.30);backdrop-filter:blur(10px);opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .18s ease,transform .18s ease;text-align:left}
  .yeb-tool-live-metric.is-visible{display:flex;opacity:1;transform:none;pointer-events:auto}
  .yeb-tool-live-metric__copy{display:flex;min-width:0;flex-direction:column;gap:1px}
  .yeb-tool-live-metric__copy small{color:#bcd0ca;font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;line-height:1.25}
  .yeb-tool-live-metric__copy strong{display:block;color:#fff7e7;font-size:26px;font-weight:900;line-height:1.05;letter-spacing:-.045em;font-variant-numeric:tabular-nums;white-space:nowrap}
  .yeb-tool-live-metric__detail{max-width:132px;color:#c9d8d3;font-size:10px;font-weight:650;line-height:1.3;text-align:right}
}
@media(prefers-reduced-motion:reduce){.yeb-tool-live-metric{transition:none}}


/* v0.8.12 — viewport-aligned calculator stage policy.
   CSS provides a safe fallback; tools.js aligns the visual stage against the actual
   browser viewport so it does not depend on whether the Theme/Gutenberg content
   column is centered, RTL-shifted, or otherwise constrained. */
.yeb-tool-stage--layout-wide{max-width:none}
body.yeb-has-wide-tool-stage{overflow-x:clip}
@media(min-width:701px){
  .yeb-tool-stage--layout-wide{width:calc(100% - 16px)}
}
@media(max-width:700px){
  .yeb-tool-stage--layout-wide{width:calc(100% - 10px)}
}