/* jupyter stories: the invest.jupyter.com.au / demo.html design system. Text-led, no media. */
.st-body{--bg:#ffffff;--card:#f6f6f7;--ink:#0a0a0a;--ink-soft:rgba(10,10,10,.62);--ink-mid:rgba(10,10,10,.42);--ink-faint:rgba(10,10,10,.28);--rule:rgba(10,10,10,.08);--rule-strong:rgba(10,10,10,.14);--rad:22px;--wide:1120px;background:var(--bg);color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif}
.st-body main{background:var(--bg)}
.st-body strong{font-weight:600}
.eb,.st-kicker{font-size:12px;text-transform:uppercase;letter-spacing:.22em;color:var(--ink-mid);font-weight:400;margin:0 0 20px}
/* hero */
.st-hero{min-height:88svh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:130px 24px 90px}
.st-hero-in{max-width:900px}
.st-orb{width:44px;height:44px;border-radius:50%;margin:0 auto 18px;display:flex;align-items:center;justify-content:center;border:1px solid var(--rule-strong)}
.st-orb i{width:8px;height:8px;border-radius:50%;background:var(--ink)}
.st-title{margin:0 0 26px;font-size:clamp(42px,11vw,92px);font-weight:200;letter-spacing:-.045em;line-height:1.0}
.st-dek{margin:0 auto;max-width:48ch;font-size:clamp(16px,4.4vw,22px);font-weight:300;line-height:1.6;color:var(--ink-soft)}
.st-by{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 22px;margin-top:38px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mid)}
.st-by b{color:var(--ink);font-weight:500}
/* divider + section heads */
.st-ch{padding:0 24px}
.st-ch-in{max-width:var(--wide);margin:0 auto;border-top:1px solid var(--rule);padding:clamp(80px,10vw,120px) 0 clamp(28px,3vw,40px)}
.st-num{display:inline-block;font-size:12px;letter-spacing:.22em;color:var(--ink-mid);margin-right:10px}
.st-num::after{content:" ·"}
.st-ch-in>div{display:inline}
.st-ch .eb{display:inline-block}
.st-ch h2{display:block;margin:0 0 22px;font-size:clamp(28px,7vw,52px);font-weight:300;letter-spacing:-.035em;line-height:1.08;max-width:20ch}
.st-ch p{margin:0;max-width:52ch;font-size:clamp(16px,4vw,19px);font-weight:300;line-height:1.6;color:var(--ink-soft)}
/* editorial */
.st-ed{max-width:var(--wide);margin:0 auto;padding:clamp(20px,3vw,32px) 24px clamp(40px,5vw,64px)}
.st-ed>*{max-width:62ch}
.st-ed p{font-size:clamp(16px,1.35vw,19px);font-weight:300;line-height:1.7;color:var(--ink-soft);margin:0 0 1.15em}
.st-ed p.lead{font-size:clamp(20px,2vw,26px);line-height:1.5;color:var(--ink);letter-spacing:-.015em}
.st-ed h3{font-size:clamp(24px,5vw,36px);font-weight:300;letter-spacing:-.035em;margin:1.4em 0 .6em;color:var(--ink)}
.st-ed ul{margin:0 0 1.4em;padding:0;list-style:none;border-top:1px solid var(--rule)}
.st-ed li{font-size:clamp(15px,1.25vw,17px);font-weight:300;line-height:1.6;color:var(--ink-soft);padding:14px 0;border-bottom:1px solid var(--rule)}
.st-ed strong{color:var(--ink);font-weight:500}
.st-ed a{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
/* card grids (scenes, strips) */
.st-scene,.st-strip,.st-strip[style]{background:transparent!important;max-width:var(--wide);margin:0 auto;padding:clamp(16px,2vw,24px) 24px clamp(48px,6vw,80px)}
.st-cards,.st-strip-in{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--rule-strong);border-radius:var(--rad);overflow:hidden;background:var(--card)}
.st-strip-in{grid-template-columns:repeat(3,minmax(0,1fr))}
.st-card,.st-tile,.st-tile[style]{background:transparent!important;color:var(--ink)!important;padding:clamp(26px,4vw,36px) clamp(22px,4vw,30px);border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.st-card .eb,.st-tile em{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mid);margin:0 0 16px;display:block;font-style:normal}
.st-card h3,.st-tile b{display:block;margin:0 0 10px;font-size:17px;font-weight:500;letter-spacing:-.01em;line-height:1.3}
.st-card p,.st-tile span,.st-tile span[style]{margin:0;font-size:14.5px;font-weight:300;line-height:1.6;color:var(--ink-soft)!important}
.st-tile{display:flex;flex-direction:column}.st-tile em{order:-1}
/* split without media = a statement block */
.st-split{max-width:var(--wide);margin:0 auto;padding:clamp(24px,3vw,40px) 24px clamp(40px,5vw,64px)}
.st-split>div{max-width:62ch}
.st-split h3{margin:0 0 16px;font-size:clamp(24px,5vw,36px);font-weight:300;letter-spacing:-.035em;line-height:1.1}
.st-split p{margin:0 0 1em;font-size:clamp(16px,1.35vw,19px);font-weight:300;line-height:1.7;color:var(--ink-soft)}
/* quote */
.st-q,.st-q.dk{max-width:var(--wide);margin:0 auto;padding:clamp(70px,9vw,120px) 24px;text-align:center;background:transparent}
.st-q blockquote,.st-q.dk blockquote{margin:0 auto;max-width:22ch;font-size:clamp(28px,6vw,52px);font-weight:200;letter-spacing:-.04em;line-height:1.1;color:var(--ink)}
.st-q cite,.st-q.dk cite{display:block;margin-top:24px;font-style:normal;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-mid)!important}
.st-cap{display:none}
/* end */
.st-end,.st-end.grey{text-align:center;padding:clamp(80px,10vw,130px) 24px;background:transparent;border-top:1px solid var(--rule);max-width:var(--wide);margin:0 auto}
.st-end h2{margin:0 0 22px;font-size:clamp(28px,7vw,52px);font-weight:300;letter-spacing:-.035em;line-height:1.08}
.st-end p{max-width:48ch;margin:0 auto;font-size:18px;font-weight:300;color:var(--ink-soft);line-height:1.6}
.st-end .btns{justify-content:center;gap:12px;margin-top:38px}
.st-end .btn{height:auto;padding:16px 32px;font-size:15px;font-weight:500;border-radius:11px}
.st-end .btn-y{background:#000;color:#fff}
.st-end .btn-o{background:transparent;color:#000;border:1px solid rgba(0,0,0,.15)}
.st-more{display:grid;grid-template-columns:1fr 1fr;max-width:var(--wide);margin:56px auto 0;text-align:left;border:1px solid var(--rule-strong);border-radius:var(--rad);overflow:hidden;background:var(--card)}
.st-more a{display:block;padding:clamp(26px,4vw,36px) clamp(22px,4vw,30px);transition:background .3s}
.st-more a+a{border-left:1px solid var(--rule)}
.st-more a:hover{background:#fff}
.st-more small{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mid)}
.st-more b{display:block;font-size:17px;font-weight:500;letter-spacing:-.01em;margin-top:12px}
.st-body .ft{background:var(--ink)}
/* reveal */
.fx{opacity:0;transform:translateY(24px);transition:opacity .9s cubic-bezier(.2,.8,.2,1),transform .9s cubic-bezier(.2,.8,.2,1)}
.fx.in{opacity:1;transform:none}.fx-d1{transition-delay:.1s}.fx-d2{transition-delay:.2s}
@media (max-width:820px){.st-cards,.st-strip-in,.st-more{grid-template-columns:1fr}.st-card,.st-tile,.st-tile[style]{border-right:0}.st-more a+a{border-left:0;border-top:1px solid var(--rule)}}
@media (prefers-reduced-motion:reduce){.fx{opacity:1;transform:none;transition:none}}
.st-card:last-child:nth-child(odd){grid-column:1/-1;border-right:0}
.st-tile:nth-child(3n){border-right:0}
.st-split{padding-left:24px}.st-split>div{padding:0}
/* ---------- code-drawn Helios motion (vector, no raster) ---------- */
.mkwrap{max-width:var(--wide);margin:0 auto;padding:clamp(12px,2vw,20px) 24px clamp(44px,5vw,70px)}
figure.mk{margin:0;background:var(--card);border:1px solid var(--rule-strong);border-radius:var(--rad);padding:clamp(14px,2.4vw,28px)}
.mk figcaption{margin:14px 4px 0;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mid)}
.mk-stage{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:14px;contain:layout paint}
.mk-app{position:absolute;inset:0;background:#fff;border-radius:14px;border:1px solid var(--rule);display:flex;flex-direction:column;font-size:13px;color:var(--ink)}
.mk-bar{display:flex;justify-content:space-between;align-items:center;height:44px;padding:0 18px;border-bottom:1px solid var(--rule);font-size:13px}
.mk-bar b{font-weight:500}.mk-bar span{color:var(--ink-mid);font-size:12px}
.mk-pad{position:relative;flex:1;padding:18px 20px;overflow:hidden}
.mk-ico{display:inline-flex;width:16px;height:16px}.mk-ico svg{width:100%;height:100%}
.mk-line{margin:0 0 12px;font-size:clamp(13px,1.35vw,17px);font-weight:300;line-height:1.55;color:var(--ink-soft);opacity:0;transform:translateY(8px);transition:opacity .6s,transform .6s}
.mk-line.on{opacity:1;transform:none}
.mk-k{background:rgba(10,10,10,.06);border-radius:5px;padding:1px 5px;color:var(--ink);font-weight:500;transition:background .3s,color .3s}
.mk-k.hit{background:var(--ink);color:#fff}
.mk-clip{display:flex;align-items:center;gap:12px;margin-top:6px;padding:12px 14px;border:1px solid var(--rule-strong);border-radius:12px;opacity:0;transform:translateY(10px);transition:opacity .5s,transform .5s}
.mk-clip.on{opacity:1;transform:none}
.mk-clip>.mk-ico{width:30px;height:30px;border-radius:50%;background:var(--ink);color:#fff;padding:8px}
.mk-clip b,.mk-res p,.mk-person b,.mk-cap b,.mk-toast b{display:block;font-weight:500;font-size:13px}
.mk-clip span,.mk-res span,.mk-person span,.mk-cap span,.mk-toast span{display:block;font-size:12px;color:var(--ink-mid)}
.mk-scrub{flex:1;height:3px;border-radius:3px;background:rgba(10,10,10,.1);overflow:hidden;min-width:60px}
.mk-scrub i{display:block;height:100%;width:100%;background:var(--ink);transform:scaleX(0);transform-origin:left}
.mk-clip.on .mk-scrub i,.mk-player.on .mk-scrub i{animation:mkScrub 3s linear forwards}
@keyframes mkScrub{to{transform:scaleX(1)}}
/* people */
.mk-people{display:grid;grid-template-columns:1.4fr 1fr;gap:18px}
.mk-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.mk-col small{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-mid);margin-bottom:8px}
.mk-chip{display:flex;align-items:center;gap:7px;padding:6px 8px;margin-bottom:7px;border-radius:9px;background:var(--card);border:1px solid var(--rule);opacity:0;transition:transform .9s cubic-bezier(.5,0,.2,1),opacity .9s}
.mk-chip.on{opacity:1}
.mk-chip i,.mk-person i,.mk-row i,.mk-cap i{display:inline-flex;align-items:center;justify-content:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--ink);color:#fff;font-style:normal;font-size:11px;font-weight:500}
.mk-chip span{font-size:11.5px;color:var(--ink-soft)}
.mk-folk{display:flex;flex-direction:column;gap:10px;justify-content:center}
.mk-person{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;border:1px solid var(--rule-strong);opacity:0;transform:translateX(12px);transition:opacity .5s,transform .5s,box-shadow .5s}
.mk-person.on{opacity:1;transform:none}.mk-person.lit{box-shadow:0 10px 30px -14px rgba(0,0,0,.35)}
.mk-person i{width:34px;height:34px;font-size:13px}
/* search */
.mk-q{display:flex;align-items:center;gap:10px;height:44px;padding:0 14px;border:1px solid var(--rule-strong);border-radius:12px;font-size:15px;font-weight:300;margin-bottom:14px}
.mk-caret{display:inline-block;width:1.5px;height:18px;background:var(--ink);animation:mkBlink 1s steps(1) infinite}
@keyframes mkBlink{50%{opacity:0}}
.mk-results{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.mk-res{border-radius:12px;border:1px solid var(--rule);overflow:hidden;background:#fff;opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.mk-res.on{opacity:1;transform:none}
.mk-res p,.mk-res span{padding:0 10px}.mk-res p{margin:8px 0 2px;font-weight:300}.mk-res span{padding-bottom:10px}
.mk-res b{font-weight:600}
.mk-th{aspect-ratio:16/9;background:#ebebe8}.mk-th svg{display:block;width:100%;height:100%}
.mk-player{position:absolute;inset:18px 20px;border-radius:12px;overflow:hidden;background:#fff;border:1px solid var(--rule-strong);opacity:0;transform:scale(.97);transition:opacity .45s,transform .45s;display:flex;flex-direction:column}
.mk-player.on{opacity:1;transform:none}
.mk-player .mk-th{flex:1;aspect-ratio:auto}
.mk-pl-bar{display:flex;align-items:center;gap:12px;padding:10px 14px;font-size:12px;color:var(--ink-mid)}
/* watch */
.mk-watch{display:grid;grid-template-columns:1.5fr 1fr;gap:16px}
.mk-frame{position:relative;border-radius:12px;overflow:hidden;background:#ebebe8}
.mk-frame svg{display:block;width:100%;height:100%}
.mk-box{position:absolute;left:52%;top:30%;width:16%;height:26%;border:2px solid var(--ink);border-radius:6px;transform:scale(0);transform-origin:0 0;transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.mk-box.draw{transform:none}
.mk-side{display:flex;flex-direction:column;gap:12px;justify-content:center}
.mk-cap{display:flex;align-items:center;gap:12px;padding:12px;border-radius:12px;border:1px solid var(--rule-strong);opacity:0;transition:opacity .5s}
.mk-cap.on{opacity:1}.mk-cap i{width:40px;height:40px;border-radius:10px;background:#6f7379;font-size:14px}
.mk-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 16px;border-radius:9px;background:var(--ink);color:#fff;font-size:12.5px;font-weight:500;align-self:flex-start;transition:transform .2s}
.mk-btn svg{width:14px;height:14px}
.mk-btn.press{transform:scale(.94)}.mk-btn.done{background:#fff;color:var(--ink);border:1px solid var(--rule-strong)}
.mk-sm{height:30px;padding:0 12px;font-size:12px}
.mk-ok{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:500;opacity:0;transition:opacity .4s}.mk-ok.on{opacity:1}
.mk-toast{position:absolute;right:16px;top:14px;display:flex;gap:10px;align-items:center;max-width:300px;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.96);box-shadow:0 18px 40px -14px rgba(0,0,0,.35);border:1px solid var(--rule);transform:translateY(-140%);opacity:0;transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .4s}
.mk-toast.on{transform:none;opacity:1}
.mk-toast>.mk-ico{width:28px;height:28px;border-radius:8px;background:var(--ink);color:#fff;padding:6px;flex:none}
/* home */
.mk-home{display:grid;grid-template-columns:1fr 1.2fr;gap:20px;align-items:center}
.mk-ring{position:relative;width:min(200px,100%);aspect-ratio:1;margin:0 auto}
.mk-ring svg{width:100%;height:100%}
.mk-ring>div{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}
.mk-ring b{font-size:clamp(16px,1.8vw,22px);font-weight:300;letter-spacing:-.02em}.mk-ring span{font-size:12px;color:var(--ink-mid);margin-top:4px}
.mk-rows{display:flex;flex-direction:column;gap:10px}
.mk-row{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:12px;border:1px solid var(--rule-strong);opacity:.25;transition:opacity .5s}
.mk-row.on{opacity:1}.mk-row span{flex:1;font-size:13px}.mk-row em{font-style:normal;font-size:12px;color:var(--ink-mid)}
.mk-row .mk-ico{width:22px;height:22px}
/* actions */
.mk-act{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--rule);opacity:0;transform:translateY(8px);transition:opacity .5s,transform .5s}
.mk-act.on{opacity:1;transform:none}
.mk-act p{margin:0;font-size:clamp(13px,1.3vw,15px);font-weight:300;line-height:1.5;color:var(--ink-soft)}
.mk-act .mk-btn{flex:none;align-self:center}
/* cursor */
.mk-cur{position:absolute;left:0;top:0;width:24px;height:24px;z-index:9;pointer-events:none;transform:translate(60%,70%);transition:transform .95s cubic-bezier(.45,.05,.2,1);filter:drop-shadow(0 3px 6px rgba(0,0,0,.3))}
.mk-rip{position:absolute;z-index:8;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:rgba(10,10,10,.15);transform:scale(0);opacity:0;pointer-events:none}
.mk-rip.go{animation:mkRip .6s cubic-bezier(.2,.8,.2,1)}
@keyframes mkRip{0%{transform:scale(0);opacity:1}100%{transform:scale(1.6);opacity:0}}
/* reduced motion: the finished frame, no cursor */
.mk-stage.still .mk-line,.mk-stage.still .mk-clip,.mk-stage.still .mk-chip,.mk-stage.still .mk-person,.mk-stage.still .mk-res,.mk-stage.still .mk-cap,.mk-stage.still .mk-ok,.mk-stage.still .mk-row,.mk-stage.still .mk-act{opacity:1;transform:none}
.mk-stage.still .mk-cur,.mk-stage.still .mk-rip{display:none}
.mk-stage.still .mk-box{transform:none}
@media (max-width:820px){
 .mk-stage{aspect-ratio:auto;height:440px}
 .mk-people,.mk-watch,.mk-home{grid-template-columns:1fr}
 .mk-cols{display:none}
 .mk-results{grid-template-columns:1fr 1fr}.mk-res:nth-child(3){display:none}
 .mk-frame{height:170px}
 .mk-ring{width:150px}
 .mk-line{font-size:14px}
 .mk-toast{left:12px;right:12px;max-width:none}
}

/* text-led clips use a wider, shorter frame */
figure.mk[data-scene=brief] .mk-stage,figure.mk[data-scene=actions] .mk-stage,figure.mk[data-scene=home] .mk-stage,figure.mk[data-scene=people] .mk-stage{aspect-ratio:21/9}
/* full-width black bands where the mood fits (owner 27 Sep) */
.st-dark{--bg:#000;--card:#0f0f10;--ink:#fff;--ink-soft:rgba(255,255,255,.66);--ink-mid:rgba(255,255,255,.45);--ink-faint:rgba(255,255,255,.25);--rule:rgba(255,255,255,.1);--rule-strong:rgba(255,255,255,.18);background:#000;color:#fff;padding:1px 0}
.st-dark .st-ch-in{border-top-color:transparent}
.st-dark .mk-app,.st-dark .mk-res,.st-dark .mk-player,.st-dark .mk-toast{background:#141416;color:#fff}
.st-dark .mk-chip,.st-dark .mk-frame,.st-dark .mk-th{background:#1c1c1f}
.st-dark .mk-th svg,.st-dark .mk-frame svg{filter:invert(.9) hue-rotate(180deg)}
.st-dark .mk-k{background:rgba(255,255,255,.1)}.st-dark .mk-k.hit{background:#fff;color:#000}
.st-dark .mk-btn{background:#fff;color:#000}.st-dark .mk-btn.done{background:transparent;color:#fff}
.st-dark .mk-chip i,.st-dark .mk-person i,.st-dark .mk-row i{background:#fff;color:#000}
.st-dark .mk-clip>.mk-ico,.st-dark .mk-toast>.mk-ico{background:#fff;color:#000}
.st-dark .mk-box{border-color:#fff}
.st-dark .mk-caret,.st-dark .mk-scrub i{background:#fff}
.st-dark .mk-cur path{fill:#fff;stroke:#000}
.st-dark .mk-rip{background:rgba(255,255,255,.2)}
.st-dark .st-q blockquote{color:#fff}
@media (max-width:820px){figure.mk[data-scene] .mk-stage{aspect-ratio:auto;height:440px;width:100%}figure.mk[data-scene=brief] .mk-stage,figure.mk[data-scene=actions] .mk-stage{height:380px}}

/* owner 27 Sep: drawn mocks withdrawn until real-app clips replace them */
figure.mk{display:none!important}