.roles{height:100dvh;min-height:calc(600 * var(--u));background:var(--paper);position:relative;overflow:hidden}.roles-canvas,.role-canvas{width:100%;height:100%;display:block;position:absolute;inset:0}.roles-canvas[data-hot]{cursor:pointer}.roles-dark,.role-dark{inset:0 0 0 var(--seam);background:var(--gallery);z-index:1;pointer-events:none;position:absolute}.site[data-seam-moving] :is(.roles-dark,.role-dark){clip-path:polygon(calc(var(--seam) - var(--seam-o)) 0, calc(100% + calc(400 * var(--u))) 0, calc(100% + calc(400 * var(--u))) 100%, calc(var(--seam) + var(--seam-o)) 100%);inset:0}.roles-layer,.role-layer{z-index:2;pointer-events:none;--fg:var(--ink);--fg2:var(--pencil);color:var(--fg);position:absolute;inset:0}.roles .ln,.role .ln{margin-bottom:-.16em;padding-bottom:.16em;display:block;overflow:hidden}.roles .ln>span,.role .ln>span{display:block}.roles-title{left:calc(48 * var(--u));font-size:5.4vw;position:absolute;top:54vh}.roles-sub{left:calc(52 * var(--u));font-size:calc(15 * var(--u));color:var(--pencil);max-width:44ch;line-height:1.4;position:absolute;top:calc(54vh + 6vw)}:is(.roles,.role) .names{left:calc(52 * var(--u));top:calc(54vh + 6vw + calc(62 * var(--u)));pointer-events:auto;list-style:none;position:absolute}:is(.roles,.role) .names a{gap:calc(12 * var(--u));padding:calc(4 * var(--u)) 0;color:inherit;align-items:baseline;text-decoration:none;display:flex}:is(.roles,.role) .names b{font-size:calc(15 * var(--u));min-width:calc(170 * var(--u));font-weight:600;transition:box-shadow .4s cubic-bezier(.16,.84,.3,1)}:is(.roles,.role) .names .when{font-size:calc(13 * var(--u));color:var(--graphite);opacity:0;transition:opacity .4s cubic-bezier(.16,.84,.3,1)}:is(.roles,.role) .names li[data-on] .when,:is(.roles,.role) .names li[data-now] .when{opacity:1}:is(.roles,.role) .names li[data-now] b,:is(.roles,.role) .names li[data-on] b,:is(.roles,.role) .names li[data-now]:not([data-on]) b{box-shadow:0 calc(2 * var(--u)) 0 var(--move)}:is(.roles,.role) .names a:focus-visible{outline-offset:calc(2 * var(--u))}.role{background:var(--paper);position:relative}.role-top{height:calc(var(--screens,5) * 100vh + 100vh);height:calc(var(--screens,5) * 100dvh + 100dvh);position:relative}.role-pin{height:100dvh;min-height:calc(600 * var(--u));position:sticky;top:0;overflow:hidden}.role-head{left:calc(52 * var(--u));position:absolute;top:13vh}.role-head h1{white-space:nowrap;font-size:6.6vw}.role-head p{margin-top:calc(10 * var(--u));font-size:calc(15 * var(--u));color:var(--pencil)}.role .count{left:calc(52 * var(--u));top:calc(13vh + 6.6vw + calc(40 * var(--u)));font-size:calc(12 * var(--u));color:var(--graphite);position:absolute}:is(.roles,.role) .facts{left:calc(52 * var(--u));top:calc(13vh + 6.6vw + calc(70 * var(--u)));width:calc(330 * var(--u));list-style:none;position:absolute}:is(.roles,.role) .fact{width:calc(330 * var(--u));position:absolute;top:0;left:0}:is(.roles,.role) .fact hr{height:calc(2 * var(--u));background:var(--ink);margin-bottom:calc(22 * var(--u));width:calc(260 * var(--u));transform-origin:0;border:0}:is(.roles,.role) .fact p{font-size:calc(17 * var(--u));line-height:1.45}:is(.roles,.role) .fact b{margin-top:calc(22 * var(--u));font-size:calc(24 * var(--u));letter-spacing:-.015em;font-weight:700;display:block}:is(.roles,.role) .fact .q{margin-top:calc(6 * var(--u));font-size:calc(12 * var(--u));color:var(--graphite);display:block}.role[data-still] .role-top,.role[data-still] .role-pin{height:auto;min-height:100dvh;position:relative}.role[data-still] .role-canvas{height:100dvh}.role[data-still] .role-layer{padding:calc(13vh + 6.6vw + calc(70 * var(--u))) 0 calc(6vh + calc(110 * var(--u))) calc(52 * var(--u));position:relative;inset:auto}.role[data-still] .facts{width:calc(360 * var(--u));gap:calc(26 * var(--u));display:grid;position:relative;top:0;left:0}.role[data-still] .fact{position:relative}.role[data-still] .fact hr{margin-bottom:calc(12 * var(--u))}.role[data-still] .fact b{margin-top:calc(10 * var(--u));font-size:calc(20 * var(--u))}:is(.roles,.role) .scrub{left:calc(52 * var(--u));pointer-events:auto;position:absolute;bottom:6vh}:is(.roles,.role) .scrub .mv{font-size:calc(14 * var(--u))}:is(.roles,.role) .ticks{gap:calc(5 * var(--u));margin:calc(10 * var(--u)) 0 calc(8 * var(--u));align-items:flex-end;list-style:none;display:flex}:is(.roles,.role) .ticks button{width:calc(1 * var(--u));height:calc(9 * var(--u));color:var(--ink);cursor:pointer;background:#aaa59c;border:0;padding:0;display:block;position:relative}:is(.roles,.role) .ticks button:after{content:"";inset:calc(-8 * var(--u)) calc(-2 * var(--u));position:absolute}:is(.roles,.role) .ticks button.p{background:var(--ink)}:is(.roles,.role) .ticks button.c{width:calc(2 * var(--u));height:calc(16 * var(--u));background:var(--ink)}:is(.roles,.role) .ticks button:focus-visible{outline-offset:calc(4 * var(--u))}:is(.roles,.role) .scrub .g{font-size:calc(12 * var(--u));color:var(--graphite)}.role-end{padding:18vh calc(52 * var(--u)) 16vh;gap:calc(40 * var(--u));display:grid;position:relative}.role-next{color:inherit;text-decoration:none}.role-next .mono{font-size:calc(13 * var(--u));color:var(--graphite);display:block}.role-next .display{margin-top:calc(10 * var(--u));text-wrap:balance;font-size:8vw;display:block}.role-next .sub{margin-top:calc(12 * var(--u));font-size:calc(15 * var(--u));color:var(--pencil);display:block}.role-next:hover .display{text-underline-offset:.1em;text-decoration:underline;text-decoration-thickness:.06em}.role-back{font-size:calc(15 * var(--u));color:inherit}@media (max-width:600px),(min-width:601px) and (max-width:1199px) and (orientation:portrait){.roles-dark,.role-dark{inset:var(--seam) 0 0 0}.roles-title{left:calc(18 * var(--u));top:calc(86 * var(--u));font-size:17vw}.roles-sub{left:calc(20 * var(--u));top:calc(calc(86 * var(--u)) + 20vw);font-size:calc(14 * var(--u));max-width:calc(100% - calc(40 * var(--u)))}:is(.roles,.role) .names{left:calc(20 * var(--u));right:calc(20 * var(--u));top:auto;bottom:calc(28 * var(--u))}:is(.roles,.role) .names a{padding:calc(7 * var(--u)) 0}:is(.roles,.role) .names b{min-width:0}:is(.roles,.role) .names .when{opacity:1}:is(.roles,.role) .names li:not([data-now]) .when{display:none}.role-head{left:calc(20 * var(--u));top:calc(76 * var(--u))}.role-head h1{font-size:11vw}.role:is([data-role=education],[data-role=monash-university]) .role-head h1{font-size:8.6vw}.role-head p{font-size:calc(13 * var(--u));margin-top:calc(6 * var(--u))}.role .count{left:calc(20 * var(--u));top:calc(calc(76 * var(--u)) + 11vw + calc(40 * var(--u)))}:is(.roles,.role) .facts{left:calc(20 * var(--u));top:calc(calc(76 * var(--u)) + 11vw + calc(64 * var(--u)));width:calc(100% - calc(50 * var(--u)))}:is(.roles,.role) .fact{width:100%}:is(.roles,.role) .fact hr{width:calc(180 * var(--u));margin-bottom:calc(14 * var(--u))}:is(.roles,.role) .fact p{font-size:calc(15 * var(--u))}:is(.roles,.role) .fact b{font-size:calc(21 * var(--u));margin-top:calc(14 * var(--u))}.role[data-still] .role-layer{padding:calc(calc(76 * var(--u)) + 11vw + calc(64 * var(--u))) calc(20 * var(--u)) calc(calc(28 * var(--u)) + calc(110 * var(--u)))}.role[data-still] .facts{gap:calc(16 * var(--u));width:auto}:is(.roles,.role) .scrub{left:calc(20 * var(--u));right:calc(20 * var(--u));bottom:calc(28 * var(--u))}:is(.roles,.role) .ticks{gap:calc(4 * var(--u));flex-wrap:wrap}.role-end{padding:14vh calc(20 * var(--u)) 12vh}.role-next .display{font-size:12vw}}