:root{--blue: hsl(246, 80%, 60%);--very-dark-blue: hsl(226, 43%, 10%);--dark-blue: hsl(235, 46%, 20%);--hover-blue: hsl(236, 41%, 34%);--desaturated-blue: hsl(235, 45%, 61%);--pale-blue: hsl(236, 100%, 87%);--work-colour: hsl(15, 100%, 70%);--play-colour: hsl(195, 74%, 62%);--study-colour: hsl(348, 100%, 68%);--exercise-colour: hsl(145, 58%, 55%);--social-colour: hsl(264, 64%, 52%);--self-care-colour: hsl(43, 84%, 65%);--font-family: "Rubik", sans-serif;--border-radius: .9375rem}html{height:100%}body{height:95%;padding-inline:1.5em;background-color:var(--very-dark-blue);font-size:100%;font-family:var(--font-family);line-height:1;color:#fff}img{max-width:100%;height:auto}h1,h2,p{margin:0;padding:0}main{display:grid;place-content:center;padding-block:5.0625em}@media (min-width: 66em){main{grid-template-columns:repeat(2,auto);gap:1.875em;height:100%;padding-block:0}}button{background-color:transparent;border:none;font-size:1.125rem;color:var(--desaturated-blue);cursor:pointer}button:focus,button:hover{color:#fff}button.active{color:#fff}.heading__details{position:relative;display:flex;align-items:center;gap:1em;padding:1.65em;border-radius:var(--border-radius);background-color:var(--blue);z-index:2}@media (min-width: 66em){.heading__details{display:block;max-width:16em;padding:2.3em 2em 5em}}.heading__image{width:4em;border:3px solid white;border-radius:50%}@media (min-width: 66em){.heading__image{width:4.875em}}.heading__header{font-size:.9375rem;color:var(--pale-blue)}@media (min-width: 66em){.heading__header{margin-block-start:2em}}.heading__name{display:block;margin-block-start:.25em;font-size:1.5rem;font-weight:300;line-height:1;color:#fff}@media (min-width: 37.5em){.heading__name{font-size:2.5rem}}.heading__timesection{margin-block-start:-1em;padding:1.5em;padding-block-start:3em;background-color:var(--dark-blue);font-size:1.125em;border-radius:var(--border-radius)}@media (min-width: 66em){.heading__timesection{padding-block-start:2em}}.heading__times{display:flex;justify-content:space-between;margin:0;padding:0;list-style-type:none}@media (min-width: 37.5em){.heading__times{justify-content:flex-start}}@media (min-width: 66em){.heading__times{flex-direction:column;line-height:3}}.heading__time{display:inline}@media (min-width: 37.5em){.heading__time{padding-inline-end:2em}}@media (min-width: 37.5em){.stats-section{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(3,1fr);gap:1em}}@media (min-width: 58em){.stats-section{grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:2em}}.stats{--stats-gap: 4em;position:relative;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);grid-template-areas:"title dots" "number previous";gap:.375em;align-items:center;margin-block-start:4em;padding:1.75em 1.5em;background-color:var(--dark-blue);border-radius:var(--border-radius);cursor:pointer}@media (min-width: 66em){.stats{--stats-gap: 5em;grid-template-rows:auto .15fr 1fr auto;grid-template-areas:"title dots" ". . " "number number" "previous previous";column-gap:.5em;margin-block-start:3em}}.stats:focus,.stats:hover{background-color:var(--hover-blue)}.stats:before{position:absolute;content:"";inset:0;inset-block-start:-2.5em;height:var(--stats-gap);border-radius:var(--border-radius);background-repeat:no-repeat;background-position:95% 40%;z-index:-1}@media (min-width: 66em){.stats:before{inset-block-start:-3em;background-position:90% 40%}}.stats__title{grid-area:title;font-size:1.125rem;font-weight:500}.stats button{justify-self:end;font-size:1rem}.stats button:hover svg path,.stats button:focus svg path{fill:#fff}.stats__dots{grid-area:dots;justify-self:end}.stats__number{grid-area:number;font-size:2rem;font-weight:300}@media (min-width: 66em){.stats__number{font-size:3.5em}}.stats__previous{grid-area:previous;justify-self:end;font-size:.9375rem;color:var(--pale-blue);text-align:right}@media (min-width: 66em){.stats__previous{justify-self:start}}.work:before{background-color:var(--work-colour);background-image:url(/assets/icon-work.48189dc5.svg)}.play:before{background-color:var(--play-colour);background-image:url(/assets/icon-play.ab43b1ec.svg)}.study:before{background-color:var(--study-colour);background-image:url(/assets/icon-study.6c7815aa.svg)}.exercise:before{background-color:var(--exercise-colour);background-image:url(/assets/icon-exercise.4a274210.svg)}.social:before{background-color:var(--social-colour);background-image:url(/assets/icon-social.ad1533da.svg)}.self-care:before{background-color:var(--self-care-colour);background-image:url(/assets/icon-self-care.4de9f24f.svg)}