/* Framewright demo kit: the bar that labels every demo as a demo and switches between its views,
   plus the small notices it shows. Each demo brings its own design; nothing here sets the demo's look. */
.fw-strip{--fw-ink:#0B0B0D;--fw-white:#F4F4F1;--fw-muted:#B4B4B9;--fw-ember:#FF5A1F;
  position:sticky;top:0;z-index:90;display:flex;align-items:center;gap:14px;min-height:46px;
  padding:calc(6px + env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) 6px max(16px,env(safe-area-inset-left,0px));
  background:var(--fw-ink);color:var(--fw-white);font:500 13px/1.25 "Funnel Sans","Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
.fw-brand{display:inline-flex;align-items:center;gap:9px;flex:none;color:var(--fw-white);text-decoration:none;font:600 16px/1 "Funnel Display","Helvetica Neue",Arial,sans-serif;letter-spacing:-.03em}
.fw-sq{display:inline-block;width:.32em;height:.32em;background:var(--fw-ember);margin-left:.07em;vertical-align:baseline}
.fw-pill{display:inline-flex;align-items:center;height:21px;padding:0 8px;border-radius:999px;border:1px solid rgba(244,244,241,.4);font:600 10.5px/1 "Funnel Sans","Helvetica Neue",Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.fw-note{margin:0;min-width:0;color:var(--fw-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fw-seg{margin-left:auto;display:flex;flex:none;gap:2px;padding:3px;border-radius:999px;background:rgba(244,244,241,.1)}
.fw-seg button{appearance:none;-webkit-appearance:none;border:0;margin:0;background:transparent;color:#D2D2D6;font:inherit;font-weight:500;height:30px;padding:0 13px;border-radius:999px;cursor:pointer;transition:background .25s,color .25s;white-space:nowrap}
.fw-seg button:hover{color:var(--fw-white)}
.fw-seg button[aria-pressed="true"]{background:var(--fw-white);color:var(--fw-ink)}
.fw-seg .s{display:none}
.fw-cta{flex:none;display:inline-flex;align-items:center;height:32px;padding:0 14px;border-radius:999px;background:var(--fw-ember);color:var(--fw-ink);text-decoration:none;font-weight:600;transition:background .25s}
.fw-cta:hover{background:var(--fw-white)}
.fw-strip :focus-visible{outline:2px solid var(--fw-ember);outline-offset:2px}
@media (max-width:1060px){.fw-note{display:none}}
@media (max-width:640px){.fw-seg .l{display:none}.fw-seg .s{display:inline}.fw-cta{display:none}.fw-seg button{padding:0 11px}.fw-strip{gap:10px}}
@media (max-width:340px){.fw-pill{display:none}}

/* Notices: short messages that say what a real build would do at that moment */
.fw-toasts{position:fixed;z-index:95;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:grid;gap:8px;width:min(460px,calc(100vw - 32px));pointer-events:none}
.fw-toast{pointer-events:auto;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:12px;padding:14px 12px 14px 16px;border-radius:16px;background:#0B0B0D;color:#F4F4F1;font:400 14px/1.45 "Funnel Sans","Helvetica Neue",Arial,sans-serif;box-shadow:0 22px 50px -14px rgba(0,0,0,.5);animation:fwt .45s cubic-bezier(.16,1,.3,1) both}
.fw-toast .fw-sq{width:8px;height:8px;margin:6px 0 0}
.fw-toast b{display:block;font-weight:600}
.fw-toast span{display:block;color:#CFCFD3}
.fw-toast .fw-act{margin-top:8px;appearance:none;border:0;padding:0;background:none;color:#FF8A5C;font:inherit;font-weight:600;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.fw-x{appearance:none;border:0;background:transparent;color:#CFCFD3;width:30px;height:30px;margin:-4px -2px 0 0;border-radius:50%;cursor:pointer;font:400 20px/1 system-ui,sans-serif}
.fw-x:hover{background:rgba(255,255,255,.1);color:#fff}
.fw-toast :focus-visible{outline:2px solid #FF5A1F;outline-offset:2px}
.fw-toast.out{opacity:0;transform:translateY(8px);transition:opacity .3s,transform .3s}
@keyframes fwt{from{opacity:0;transform:translateY(14px)}}

.fw-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.fw-skip{position:fixed;left:12px;top:-60px;z-index:100;padding:10px 16px;border-radius:10px;background:#0B0B0D;color:#F4F4F1;font:600 14px/1 "Funnel Sans",Arial,sans-serif;text-decoration:none}
.fw-skip:focus{top:calc(10px + env(safe-area-inset-top,0px))}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){.fw-toast{animation:none}}