/* Intake loading v2 — three perspectives converging inside the intake page. */
.l2-stage{position:fixed;inset:0;background:#e5ebf1;display:flex;flex-direction:column;overflow:hidden}
.l2-bar{height:48px;flex:none;background:#050301;color:#fff;display:flex;align-items:center;gap:16px;padding:0 20px;font-size:13px}
.l2-bar__t{font-weight:700;font-size:14px}
.l2-bar__n{color:rgba(255,255,255,.5);font-size:12px}
.l2-bar__sp{flex:1}
.l2-bar label{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.6);font-size:12px}
.l2-bar input[type=range]{width:110px;accent-color:#82bc62}
.l2-bar button{background:rgba(255,255,255,.12);border:none;color:#fff;font:inherit;font-size:12px;font-weight:600;padding:6px 13px;border-radius:900px;cursor:pointer}
.l2-body{flex:1;min-height:0;overflow:auto;display:flex;justify-content:center;align-items:flex-start;padding:22px}
.l2-row{display:flex;gap:26px;align-items:flex-start;width:max-content}
.l2-art{display:flex;flex-direction:column;gap:9px}
.l2-art__head{display:flex;align-items:baseline;gap:10px;padding:0 2px}
.l2-art__n{font-size:11px;font-weight:700;letter-spacing:.1em;color:#636c79}
.l2-art__t{font-size:16px;font-weight:700;letter-spacing:-.01em}
.l2-art__f{margin-left:auto;background:#fff;border:1px solid #ced6de;border-radius:900px;font:inherit;font-size:11px;font-weight:600;padding:4px 12px;cursor:pointer}
.l2-art__d{font-size:12px;color:#636c79;line-height:1.5;text-wrap:pretty;padding:0 2px}
.l2-art__vp{overflow:hidden;border-radius:14px;box-shadow:0 12px 34px rgba(5,3,1,.13),0 0 0 1px rgba(5,3,1,.07)}
.l2-art__in{transform-origin:top left}
.l2-focus{position:fixed;inset:0;background:#e5ebf1;z-index:60;display:flex;flex-direction:column}
.l2-focus__bar{height:46px;flex:none;background:#050301;color:#fff;display:flex;align-items:center;gap:14px;padding:0 18px;font-size:13px;overflow:hidden}
.l2-focus__bar button{background:rgba(255,255,255,.12);border:none;color:#fff;font:inherit;font-size:12px;font-weight:600;padding:6px 14px;border-radius:900px;cursor:pointer;flex:none}
.l2-focus__cap{color:rgba(255,255,255,.55);font-size:12px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.l2-focus__body{flex:1;min-height:0;overflow:auto;display:flex;justify-content:center;align-items:flex-start;padding:20px}
.l2-fit{transform-origin:top center;flex:none;border-radius:14px;overflow:hidden;box-shadow:0 14px 40px rgba(5,3,1,.16)}

/* ---------- train of thought in the chat ---------- */
.l2-step{display:flex;flex-direction:column;gap:0;animation:l2in .45s ease both}
@keyframes l2in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.l2-stephd{display:flex;align-items:center;gap:8px;background:none;border:none;font:inherit;padding:4px 0;cursor:pointer;text-align:left;width:100%;color:#050301}
.l2-pills{display:flex;flex:none}
.l2-pill{width:22px;height:22px;border-radius:900px;border:1px solid #e5ebf1;background:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;color:#ced6de;margin-left:-6px}
.l2-pill:first-child{margin-left:0}
.l2-pill.on{border-width:2px;color:#050301;z-index:2}
.l2-lbl{display:inline-flex;align-items:center;gap:5px;flex:none;min-width:0}
.l2-stephd b{font-size:12px;font-weight:600;color:#636c79;min-width:0}
.l2-stephd.live b{color:#050301;font-weight:700}
.l2-stephd i.chv{font-size:14px;color:#dde3ea;flex:none;margin-left:auto}
.l2-stepbd{padding:1px 0 7px 24px;display:flex;flex-direction:column;gap:3px}
.l2-line{font-size:11.5px;color:#9aa4af;line-height:1.4}
.l2-line.on{color:#373534}
.l2-think{font-size:12.5px;color:#636c79;line-height:1.55;text-wrap:pretty}
.l2-dots{display:inline-flex;gap:3px;align-items:center}
.l2-dots i{width:4px;height:4px;border-radius:900px;background:#a5cf8e;display:block;animation:l2b 1.1s infinite}
.l2-dots i:nth-child(2){animation-delay:.15s}
.l2-dots i:nth-child(3){animation-delay:.3s}
@keyframes l2b{0%,60%,100%{opacity:.28}30%{opacity:1}}

/* ---------- main panel: shared bits ---------- */
.l2-main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden;background:#f6fafd}
.l2-hd{flex:none;padding:22px 26px 0}
.l2-hd__t{font-size:22px;font-weight:700;letter-spacing:-.024em;line-height:1.2}
.l2-hd__s{font-size:13px;color:#636c79;margin-top:6px}
.l2-stagearea{flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:22px 26px 26px}
.l2-bar2{height:4px;border-radius:900px;background:#e5ebf1;overflow:hidden;width:100%;flex:none}
.l2-bar2 i{display:block;height:100%;background:#3a8518;border-radius:900px;transition:width .4s linear}
.l2-cap{font-size:13px;color:#373534;text-align:center;line-height:1.5;max-width:52ch}
.l2-cap b{font-weight:700}

/* venn */
.l2-venn{position:relative;width:460px;height:380px}
.l2-vc{position:absolute;width:238px;height:238px;border-radius:900px;transition:opacity .6s,box-shadow .6s;animation:l2float 10s ease-in-out infinite}
.l2-vc:nth-of-type(1){animation-delay:0s}
.l2-vc:nth-of-type(2){animation-delay:-3.3s}
.l2-vc:nth-of-type(3){animation-delay:-6.6s}
.l2-vc.on{box-shadow:0 0 0 1.5px currentColor inset,0 0 44px -6px currentColor}
@keyframes l2float{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(2px,-3px) scale(1.015)}}
.l2-vlab{position:absolute;display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;background:#fff;border:1px solid #e5ebf1;border-radius:900px;padding:5px 11px;white-space:nowrap;transition:transform .5s,box-shadow .5s}
.l2-vlab.on{transform:translateY(-3px);box-shadow:0 8px 18px rgba(5,3,1,.14)}
.l2-ripple{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.l2-ripple i{position:absolute;width:64px;height:64px;border-radius:900px;border:1px solid rgba(58,133,24,.22);background:radial-gradient(circle,rgba(58,133,24,.08),transparent 72%);opacity:0;animation:l2ripple 5.5s cubic-bezier(.2,.6,.35,1) infinite}
.l2-ripple i:nth-child(2){animation-delay:1.8s}
.l2-ripple i:nth-child(3){animation-delay:3.6s}
@keyframes l2ripple{0%{transform:scale(.5);opacity:0}12%{opacity:.3}100%{transform:scale(8);opacity:0}}
.l2-vmid{position:absolute;left:50%;top:53%;transform:translate(-50%,-50%);text-align:center;width:150px}
.l2-vmid b{display:block;font-size:24px;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.l2-vmid span{display:block;font-size:10px;font-weight:700;letter-spacing:.11em;color:#4d6b39;margin-top:5px}

/* rail placeholder while the study is being designed */
.l2-rail{width:288px;flex:none;background:#fff;border-left:1px solid #e5ebf1;padding:16px;display:flex;flex-direction:column;gap:14px}
.l2-rk{font-size:9.5px;font-weight:700;letter-spacing:.12em;color:#9aa4af}
.l2-rsk{height:11px;border-radius:900px;background:linear-gradient(90deg,#eef2f6 25%,#e3e9ee 37%,#eef2f6 63%);background-size:400% 100%;animation:l2shimmer 1.6s ease-in-out infinite}
.l2-rwait{font-size:12px;color:#9aa4af;display:flex;align-items:center;gap:8px}

/* the page waits behind a veil; attention goes left */
.l2-sk{height:10px;border-radius:900px;background:linear-gradient(90deg,#eef2f6 25%,#e3e9ee 37%,#eef2f6 63%);background-size:400% 100%;animation:l2shimmer 1.6s ease-in-out infinite;display:block}
@keyframes l2shimmer{0%{background-position:100% 0}100%{background-position:0 0}}
.l2-veil{position:absolute;inset:0;background:rgba(246,250,253,.86);backdrop-filter:blur(2px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:24px}
.l2-point{display:flex;flex-direction:column;align-items:center;gap:9px;text-align:center;max-width:44ch;animation:l2in .5s ease both}
.l2-arrow{width:52px;height:52px;border-radius:900px;background:#3a8518;color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;box-shadow:0 8px 22px rgba(58,133,24,.32);animation:l2nudge 1.8s ease-in-out infinite}
@keyframes l2nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(-7px)}}
.l2-point b{font-size:17px;font-weight:700;letter-spacing:-.018em}
.l2-point span{font-size:13px;color:#636c79;line-height:1.55;text-wrap:pretty}
.l2-point em{font-style:normal;font-size:11.5px;font-weight:600;color:#3a8518;background:#f3f9ef;border:1px solid #dfeed5;border-radius:900px;padding:4px 11px;margin-top:2px}
.l2-over{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:7px;text-align:center;width:400px;z-index:3}
.l2-over b{background:rgba(246,250,253,.72);border-radius:900px;padding:2px 12px}


/* ---- decision context asked in the chat (replaces the rail segtabs) ---- */
.l2-ask{display:flex;flex-direction:column;gap:8px;margin-top:10px;animation:l2in .35s ease both}
.l2-ask .i3-msg b{font-weight:600;display:block}
.l2-hint{display:block;margin-top:5px;font-size:11.5px;color:#9aa4af;line-height:1.4}
.l2-qopts{display:flex;flex-wrap:wrap;gap:6px}
.l2-qo{font:inherit;font-size:12px;padding:6px 11px;border-radius:900px;border:1px solid #ced6de;background:#fff;color:#636c79;cursor:pointer;transition:border-color .12s,color .12s,background .12s}
.l2-qo:hover{border-color:#3a8518;color:#050301}
/* dashed = inferred: the pattern is solid, the instance is a guess */
.l2-qo.inf{border-style:dashed}
.l2-qo.on{border-color:#3a8518;border-style:solid;background:#daebd1;color:#3d6b24;font-weight:600}
.l2-qgo{align-self:flex-start;font:inherit;font-size:12px;font-weight:600;padding:6px 13px;border-radius:900px;border:none;background:#3a8518;color:#fff;cursor:pointer}
.l2-qgo:disabled{background:#ced6de;cursor:default}
.l2-said{display:flex;flex-direction:column;gap:2px;margin-top:8px;animation:l2in .35s ease both}
/* the receipt: what the answer actually changed */
.l2-did{display:flex;gap:7px;align-items:baseline;font-size:11.5px;color:#3d6b24;background:#daebd1;border-radius:8px;padding:6px 9px;margin-top:6px;line-height:1.4}
.l2-did::before{content:"";width:5px;height:5px;border-radius:900px;background:#3a8518;flex:none;position:relative;top:-1px}

/* ---- the rail reports instead of asking ---- */
.l2-rv{display:block;font-size:12.5px;font-weight:600;color:#050301;line-height:1.3}
.l2-rnote{display:block;margin-top:3px;font-size:11px;color:#9aa4af;line-height:1.35}


/* who is speaking: one soft chip. Defined here as well as in sf.css so the
   standalone loading artboards, which do not load sf.css, still style it. */
.at-who{width:19px;height:19px;border-radius:900px;background:#f1f4f7;color:#8f9aa7;display:flex;align-items:center;justify-content:center;font-size:11.5px;flex:none}
.l2-stephd.live .at-who{background:#eef2f6;color:#636c79}
