Enable

Version 29.10 by Veronika Kocher on Thursday, 03 Sep 2026 13:04

  .arsn-phase {
    max-width: 1400px;
    margin: 0 auto;
    color: #322f2b;
  }

  .arsn-phase * {
    box-sizing: border-box;
  }

  .arsn-eyebrow {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .075em;
    text-transform: uppercase;
  }

  .arsn-card {
    border-radius: 11px;
    box-shadow: 0 1px 3px rgba(0,0,0,.035);
  }

  .arsn-hero-image {
    height: 138px;
    overflow: hidden;
    border-radius: 11px 11px 0 0;
    background: #f1eee9;
  }

  .arsn-hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .arsn-progress {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 14px;
    margin: 0 0 26px 0;
    padding: 4px 0 0 0;
  }

  .arsn-progress:before {
    content: "";
    position: absolute;
    top: 21px;
    left: 9%;
    right: 9%;
    height: 2px;
    background: #e9cfc2;
    z-index: 0;
  }

  .arsn-step {
    position: relative;
    z-index: 1;
    text-align: center;
  }

  .arsn-step-dot {
    width: 14px;
    height: 14px;
    margin: 0 auto 7px auto;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 0 0 1px #d5cfc7;
    background: #d8d2ca;
  }

  .arsn-step.active .arsn-step-dot {
    background: #e94b13;
    box-shadow: 0 0 0 1px #e94b13;
  }

  .arsn-step.done .arsn-step-dot {
    background: #8c837a;
    box-shadow: 0 0 0 1px #8c837a;
  }

  .arsn-step-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    color: #746d65;
  }

  .arsn-step.active .arsn-step-label {
    color: #7d4a37;
  }

  .arsn-step-desc {
    margin-top: 3px;
    font-size: 13px;
    color: #6a655e;
  }

  .arsn-focus-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(230px,1fr));
    gap: 12px;
  }

  .arsn-focus-group {
    padding: 13px 14px;
    background: rgba(255,255,255,.52);
    border: 1px solid #cfe8ef;
    border-radius: 8px;
  }

  .arsn-focus-group strong {
    display: block;
    margin-bottom: 6px;
    color: #2f5661;
  }

  .arsn-focus-group ul {
    margin: 0 0 0 17px;
    padding: 0;
    color: #365862;
  }

  .arsn-focus-group li {
    margin: 4px 0;
  }

  .arsn-outcome-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
    gap: 10px;
  }

  .arsn-outcome {
    position: relative;
    padding: 12px 13px 12px 36px;
    background: #fcfbf8;
    border: 1px solid #e3ded6;
    border-radius: 8px;
    color: #4f4a44;
  }

  .arsn-outcome:before {
    content: "✓";
    position: absolute;
    left: 13px;
    top: 10px;
    color: #e94b13;
    font-weight: 800;
  }

  .arsn-area-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(310px,1fr));
    gap: 18px;
    align-items: stretch;
  }

  .arsn-area {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #e3ded6;
    border-radius: 11px;
    background: #fcfbf8;
    box-shadow: 0 1px 3px rgba(0,0,0,.035);
  }

  .arsn-area-head {
    padding: 18px 19px 12px 19px;
  }

  .arsn-area-body {
    padding: 3px 19px 19px 19px;
  }

  .arsn-area-label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 5px 8px;
    margin-bottom: 9px;
    border-radius: 5px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .065em;
  }

  .arsn-area-number {
    opacity: .72;
  }

  .arsn-area-action {
    margin-left: 2px;
    font-weight: 600;
    opacity: .74;
    letter-spacing: .02em;
    text-transform: none;
  }

  .arsn-area h4 {
    font-size: 19px;
    line-height: 1.3;
    margin: 0 0 7px 0;
    color: #2f2b27;
  }

  .arsn-area p {
    margin: 0;
    line-height: 1.5;
    color: #625d56;
  }

  .arsn-topic {
    display: block;
    margin: 6px 0;
    padding: 10px 11px;
    border: 1px solid #e9e4dc;
    border-radius: 6px;
    background: #fffdf9;
    color: #252321;
    text-decoration: none;
    font-weight: 600;
    transition: transform .08s ease, box-shadow .08s ease, background .08s ease;
  }

  .arsn-topic:hover,
  .arsn-topic:focus {
    background: #fff7f1;
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 2px 5px rgba(0,0,0,.06);
  }

  .arsn-resource-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px,1fr));
    gap: 12px;
  }

  .arsn-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
    gap: 8px;
  }

  .arsn-related-link {
    display: block;
    padding: 9px 10px;
    border: 1px solid #e9e4dc;
    border-left: 3px solid #e94b13;
    border-radius: 6px;
    background: #fffdf9;
    color: #252321;
    text-decoration: none;
    font-weight: 600;
  }

  .arsn-related-link:hover,
  .arsn-related-link:focus {
    background: #fff7f1;
    text-decoration: none;
  }

  .arsn-tip {
    padding: 12px 15px;
    border: 1px solid #c7e5ed;
    border-left: 4px solid #21b6d7;
    background: #eaf6f9;
    border-radius: 7px;
    color: #365e68;
    font-size: 13px;
  }

  .arsn-tip strong {
    color: #2d5661;
  }

  @media (max-width: 800px) {
    .arsn-focus-grid {
      grid-template-columns: 1fr;
    }
  }

  @media (max-width: 700px) {
    .arsn-progress:before {
      display: none;
    }
    .arsn-progress {
      grid-template-columns: 1fr;
      gap: 8px;
    }
    .arsn-step {
      text-align: left;
      display: grid;
      grid-template-columns: 24px 1fr;
      column-gap: 8px;
      align-items: center;
    }
    .arsn-step-dot {
      margin: 0;
    }
    .arsn-step-desc {
      grid-column: 2;
    }
  }
Enable — planning and setting up an artistic or research project
PROJECT PHASE 1 · ENABLE

I develop my project idea — I plan, fund & set up my project

Before active project work begins, clarify how the project will be organised, funded and supported, what materials and research outputs are expected, and how rights, responsibilities, infrastructure and data management will be handled from the start.

1 · ENABLE
Plan & set up
2 · WORK & MANAGE
Run & document
3 · PUBLISH & SHARE
Publish, preserve & hand over
RIGHT NOW

What should I be focusing on now?

You do not need every detail fixed before you start. You do need enough shared decisions to make the project workable, responsible and easy to continue.

Project
  • What is the scope, and who is responsible for which decisions?
  • Which funding opportunities and funder requirements apply?
  • What data, materials and outputs will be created, collected or reused?
  • Do I need a Data Management Plan?
Rights & responsibilities
  • Which copyright, permissions or licences need to be clarified?
  • Will personal, sensitive, confidential or ethically complex materials be involved?
  • Which decisions should be documented from the beginning?
  • Who will be responsible for shared accounts, access and handover?
Working setup
  • How should files and folders be organised and named?
  • Where will materials be stored and backed up?
  • Who should have access?
  • Which infrastructure, services and tools are appropriate?
BY THE END OF THIS PHASE

You should have a workable project setup

a clear project scope and named responsibilities
a basic plan for data, materials and expected outputs
key rights, ethics and protection issues identified
agreed storage, backup, access and collaboration arrangements
EXPLORE THIS PHASE

Four areas to get your project ready

Start with the area that matches what you need to decide or set up now.

01 START HERE · Orient

Orient yourself and choose the right level of setup

Use these pages if you are just starting out, unsure which topics apply, or need a practical minimum setup for a smaller project.

02 PLAN & ORGANISE · Decide

Define what the project needs and how it will be organised

Clarify scope, responsibilities, funding conditions, expected materials and outputs, and the basic data-management approach before active work begins.

03 PROTECT & CLARIFY · Check

Clarify rights, permissions, protection needs and responsibilities

Identify legal, ethical or data-protection issues early enough to obtain permissions, make agreements and avoid unnecessary restrictions later.

04 SET UP INFRASTRUCTURE & COLLABORATION · Prepare

Create a working environment the project can actually use

Decide where project materials live, how they are backed up and protected, which tools are appropriate and how access and collaboration will work.

NEXT PHASE

Continue in Work & Manage

The setup decisions made here should guide the project, but they are not fixed forever. During active project work, organise, document, secure and review how the project is actually working.

Continue to Work & Manage
USEFUL MATERIALS

Practical resources

Info Sheets
COMING SOON
Short reference guides for common questions and decisions.
Tutorials
COMING SOON
Step-by-step instructions for specific tasks and workflows.
Checklists & Templates
COMING SOON
Reusable aids for planning, documenting and reviewing your project setup.
Tip · A useful rule of thumb: Plan early, document decisions, and review them as the project changes. A simple setup that is actually used is usually more effective than a complex plan that is never updated.
/* =========================================================
   MASTER TYPOGRAPHY
   ========================================================= */
#xwikicontent h1,
#xwikicontent h2,
#xwikicontent h3,
#xwikicontent h4,
#xwikicontent h5,
#xwikicontent h6,
#xwikicontent .box-title,
#xwikicontent [role="heading"],
#xwikicontent h1 a,
#xwikicontent h2 a,
#xwikicontent h3 a,
#xwikicontent h4 a,
#xwikicontent h5 a,
#xwikicontent h6 a,
#xwikicontent .box-title a,
#xwikicontent [role="heading"] a{
  text-align:left!important;
  text-justify:auto!important;
  word-spacing:normal!important;
}

/* =========================================================
   COMING SOON / IN VORBEREITUNG
   ========================================================= */
.sn-coming-soon-badge{
  display:inline-block;
  vertical-align:middle;
  margin-left:10px;
  padding:4px 8px;
  border-radius:14px;
  border:1px solid #efd9cc;
  background:#fff4ee;
  color:#8a4d36;
  font-size:11px;
  font-weight:700;
  letter-spacing:.055em;
  line-height:1.2;
  white-space:nowrap;
}

/* =========================================================
   NATIVE / DETAIL CALLOUT GEOMETRY
   Preserve existing backgrounds.
   ========================================================= */
#xwikicontent .arsn-info,
#xwikicontent .dmp-info,
#xwikicontent .ido-info,
#xwikicontent .pp-info,
#xwikicontent .infomessage{
  box-sizing:border-box!important;
  border-left:4px solid #21b6d7!important;
  border-radius:8px;
  text-align:left!important;
  word-spacing:normal!important;
}

#xwikicontent .arsn-warn,
#xwikicontent .dmp-warn,
#xwikicontent .ido-warn,
#xwikicontent .pp-warn,
#xwikicontent .warn,
#xwikicontent .warning,
#xwikicontent .warningmessage,
#xwikicontent .errormessage{
  box-sizing:border-box!important;
  border-left:4px solid #e94b13!important;
  border-radius:8px;
  text-align:left!important;
  word-spacing:normal!important;
}

[data-sn-master-equal-height],
[data-sn-master-first-row]{
  box-sizing:border-box;
}
(function(){
  "use strict";

  var PAGE_KIND="overview";
  var PLACEHOLDER=false;
  var PLACEHOLDER_LABEL="COMING SOON";

  var MOBILE_MAX=767;
  var ROW_TOLERANCE=6;
  var RESIZE_DEBOUNCE=220;

  var root=
    document.getElementById("xwikicontent")||
    document.querySelector(".xwiki-rendering-content")||
    document.querySelector("main")||
    document.body;

  if(!root)return;

  var managedHeight=new Set();
  var managedMargin=new Set();
  var originalHeight=new WeakMap();
  var originalMargin=new WeakMap();

  var resizeTimer=0;
  var running=false;

  var THEMES=[
    {
      name:"BLUE",
      accent:"#21b6d7",
      bg:"#eaf7fb",
      text:"#315d68",
      labels:[
        "HIER STARTEN",
        "ENTSCHEIDEN",
        "ÜBERPRÜFEN & ANPASSEN",
        "START HERE",
        "DECIDE",
        "REVIEW & ADAPT"
      ]
    },
    {
      name:"RED",
      accent:"#e94b13",
      bg:"#fff1ec",
      text:"#8a4d36",
      labels:[
        "PLANEN & ORGANISIEREN",
        "ORGANISIEREN & DOKUMENTIEREN",
        "PUBLIZIEREN & PRÄSENTIEREN",
        "PLAN & ORGANISE",
        "PLAN & ORGANIZE",
        "ORGANISE & DOCUMENT",
        "ORGANIZE & DOCUMENT",
        "PUBLISH & PRESENT"
      ]
    },
    {
      name:"YELLOW",
      accent:"#f0aa00",
      bg:"#fff8e7",
      text:"#785b17",
      labels:[
        "SCHÜTZEN & KLÄREN",
        "STANDARDISIEREN & IDENTIFIZIEREN",
        "ÖFFNEN, NACHNUTZEN & AUFFINDBAR MACHEN",
        "PROTECT & CLARIFY",
        "STANDARDISE & IDENTIFY",
        "STANDARDIZE & IDENTIFY",
        "OPEN, REUSE & MAKE FINDABLE"
      ]
    },
    {
      name:"GREEN",
      accent:"#38b76a",
      bg:"#edf9f1",
      text:"#3f7451",
      labels:[
        "INFRASTRUKTUR EINRICHTEN",
        "INFRASTRUKTUR & ZUSAMMENARBEIT EINRICHTEN",
        "SPEICHERN & ZUGRIFF STEUERN",
        "REPOSITORIUM, ERHALTEN & ÜBERGEBEN",
        "SET UP INFRASTRUCTURE",
        "SET UP INFRASTRUCTURE & COLLABORATION",
        "STORE & CONTROL ACCESS",
        "REPOSITORY, PRESERVE & HAND OVER"
      ]
    }
  ];

  function num(value){
    var n=parseFloat(value);
    return Number.isFinite(n)?n:0;
  }

  function norm(value){
    return String(value||"")
      .replace(/\s+/g," ")
      .trim()
      .toUpperCase();
  }

  function visible(el){
    if(!el||el.nodeType!==1)return false;

    var style=getComputedStyle(el);
    var rect=el.getBoundingClientRect();

    return (
      style.display!=="none"&&
      style.visibility!=="hidden"&&
      rect.width>20&&
      rect.height>4
    );
  }

  function saveStyle(el,map,property){
    if(map.has(el))return;

    map.set(el,{
      value:el.style.getPropertyValue(property),
      priority:el.style.getPropertyPriority(property)
    });
  }

  function restoreStyle(el,map,property){
    var original=map.get(el);

    if(original&&original.value){
      el.style.setProperty(
        property,
        original.value,
        original.priority||""
      );
    }else{
      el.style.removeProperty(property);
    }
  }

  function resetRuntime(){
    managedHeight.forEach(function(el){
      restoreStyle(
        el,
        originalHeight,
        "min-height"
      );
      el.removeAttribute(
        "data-sn-master-equal-height"
      );
    });

    managedMargin.forEach(function(el){
      restoreStyle(
        el,
        originalMargin,
        "margin-top"
      );
      el.removeAttribute(
        "data-sn-master-first-row"
      );
    });

    managedHeight.clear();
    managedMargin.clear();
  }

  function themeFor(text){
    var value=norm(text);

    for(var i=0;i=2
      ){
        var match=
          paletteMatch(
            style.borderTopColor
          );

        if(match){
          el.style.setProperty(
            "border-left",
            "4px solid "+match.hex,
            "important"
          );
        }
      }
    });

    // Warning families: explicit safety override.
    Array.from(
      root.querySelectorAll(
        ".arsn-warn,.dmp-warn,.ido-warn,.pp-warn,"+
        ".warn,.warning,.warningmessage,.errormessage"
      )
    ).forEach(function(el){
      if(!visible(el))return;

      el.style.setProperty(
        "border-left",
        "4px solid #e94b13",
        "important"
      );
    });

    // Info families: explicit orientation override.
    Array.from(
      root.querySelectorAll(
        ".arsn-info,.dmp-info,.ido-info,.pp-info,.infomessage"
      )
    ).forEach(function(el){
      if(!visible(el))return;

      el.style.setProperty(
        "border-left",
        "4px solid #21b6d7",
        "important"
      );
    });
  }

  /* =======================================================
     OVERVIEW SEMANTIC THEME PALETTE
     ======================================================= */

  function smallestThemeHeaders(){
    return Array.from(
      root.querySelectorAll(
        "div,span,p,strong,h3,h4,h5,h6"
      )
    ).filter(function(el){
      if(!visible(el))return false;
      if(!themeFor(el.textContent))return false;

      return !Array.from(
        el.children||[]
      ).some(function(child){
        return !!themeFor(
          child.textContent
        );
      });
    });
  }

  function findOverviewCard(header){
    var node=header.parentElement;
    var candidates=[];

    while(node&&node!==root){
      var rect=node.getBoundingClientRect();
      var style=getComputedStyle(node);

      var border=
        num(style.borderTopWidth)+
        num(style.borderRightWidth)+
        num(style.borderBottomWidth)+
        num(style.borderLeftWidth);

      if(
        rect.width>=220&&
        rect.width<=800&&
        rect.height>=120&&
        border>=1
      ){
        candidates.push(node);
      }

      node=node.parentElement;
    }

    if(!candidates.length)return null;

    candidates.sort(function(a,b){
      return (
        b.getBoundingClientRect().height-
        a.getBoundingClientRect().height
      );
    });

    return candidates[0];
  }

  function rowCandidates(link,card){
    var result=[];
    var cardRect=
      card.getBoundingClientRect();

    var node=link;

    while(node&&node!==card){
      if(visible(node)){
        var rect=
          node.getBoundingClientRect();

        if(
          rect.height<=105&&
          rect.width>=
            cardRect.width*.50&&
          rect.width<=
            cardRect.width*1.03
        ){
          result.push(node);
        }
      }

      node=node.parentElement;
    }

    return result;
  }

  function chooseOuterRow(
    candidates,
    link
  ){
    if(!candidates.length){
      return link;
    }

    var bordered=
      candidates.filter(function(el){
        return (
          num(
            getComputedStyle(el)
              .borderLeftWidth
          )>=1
        );
      });

    var pool=
      bordered.length
        ?bordered
        :candidates;

    pool.sort(function(a,b){
      var ar=
        a.getBoundingClientRect();

      var br=
        b.getBoundingClientRect();

      return (
        ar.left-br.left||
        br.width-ar.width
      );
    });

    return pool[0]||link;
  }

  function applyOverviewPalette(){
    if(PAGE_KIND!=="overview"){
      return [];
    }

    var headers=
      smallestThemeHeaders()
        .map(function(el){
          return {
            el:el,
            theme:
              themeFor(
                el.textContent
              ),
            card:
              findOverviewCard(
                el
              )
          };
        })
        .filter(function(row){
          return !!row.card;
        });

    var unique=[];
    var seenHeaders=new Set();

    headers.forEach(function(row){
      var key=
        row.theme.name+
        "|"+
        Math.round(
          row.card
            .getBoundingClientRect()
            .left
        )+
        "|"+
        Math.round(
          row.el
            .getBoundingClientRect()
            .top
        );

      if(!seenHeaders.has(key)){
        seenHeaders.add(key);
        unique.push(row);
      }
    });

    unique.forEach(function(row){
      var headerRect=
        row.el
          .getBoundingClientRect();

      row.el.style.setProperty(
        "background",
        row.theme.bg,
        "important"
      );

      row.el.style.setProperty(
        "color",
        row.theme.text,
        "important"
      );

      row.el.style.setProperty(
        "text-align",
        "left",
        "important"
      );

      row.el.style.setProperty(
        "word-spacing",
        "normal",
        "important"
      );

      var later=
        unique
          .filter(function(other){
            return (
              other.card===row.card&&
              other.el
                .getBoundingClientRect()
                .top>
                headerRect.top+2
            );
          })
          .sort(function(a,b){
            return (
              a.el
                .getBoundingClientRect()
                .top-
              b.el
                .getBoundingClientRect()
                .top
            );
          });

      var stopTop=
        later.length
          ?later[0].el
              .getBoundingClientRect()
              .top
          :Infinity;

      Array.from(
        row.card.querySelectorAll("a")
      ).forEach(function(link){
        if(!visible(link))return;

        var rect=
          link.getBoundingClientRect();

        if(
          rect.top<=
            headerRect.bottom-2||
          rect.top>=
            stopTop-2
        ){
          return;
        }

        var candidates=
          rowCandidates(
            link,
            row.card
          );

        var target=
          chooseOuterRow(
            candidates,
            link
          );

        candidates.forEach(function(el){
          el.style.setProperty(
            "border-left",
            "0 solid transparent",
            "important"
          );
        });

        target.style.setProperty(
          "border-left",
          "3px solid "+
            row.theme.accent,
          "important"
        );

        target.style.setProperty(
          "box-sizing",
          "border-box",
          "important"
        );
      });
    });

    return unique;
  }

  /* =======================================================
     OVERVIEW CARD HEIGHT + FIRST THEMATIC ROW
     ======================================================= */

  function alignOverviewCards(headers){
    if(
      PAGE_KIND!=="overview"||
      window.innerWidth<=MOBILE_MAX
    ){
      return;
    }

    var cards=[];
    var seen=new Set();

    headers.forEach(function(row){
      if(!seen.has(row.card)){
        seen.add(row.card);
        cards.push(row.card);
      }
    });

    if(cards.length<2){
      return;
    }

    // Group cards by actual top position.
    var groups=[];

    cards.forEach(function(card){
      var top=
        card.getBoundingClientRect().top;

      var group=null;

      for(var i=0;i1){
            saveStyle(
              row.el,
              originalMargin,
              "margin-top"
            );

            var current=
              num(
                getComputedStyle(
                  row.el
                ).marginTop
              );

            row.el.style.setProperty(
              "margin-top",
              (
                current+delta
              )+"px"
            );

            row.el.setAttribute(
              "data-sn-master-first-row",
              "1"
            );

            managedMargin.add(
              row.el
            );
          }
        });
      }

      var maxHeight=0;

      group.cards.forEach(function(card){
        maxHeight=
          Math.max(
            maxHeight,
            card
              .getBoundingClientRect()
              .height
          );
      });

      maxHeight=
        Math.ceil(maxHeight);

      group.cards.forEach(function(card){
        saveStyle(
          card,
          originalHeight,
          "min-height"
        );

        card.style.setProperty(
          "min-height",
          maxHeight+"px"
        );

        card.setAttribute(
          "data-sn-master-equal-height",
          "1"
        );

        managedHeight.add(
          card
        );
      });
    });
  }

  /* =======================================================
     DETAIL GRID EQUAL HEIGHT, DESKTOP ONLY
     ======================================================= */

  function equaliseDetailGrids(){
    if(
      PAGE_KIND!=="detail"||
      window.innerWidth<=MOBILE_MAX
    ){
      return;
    }

    var selectors=[
      ".arsn-grid",
      ".arsn-grid-2",
      ".arsn-grid-3",
      ".dmp-grid",
      ".ido-grid",
      ".pp-grid"
    ];

    selectors.forEach(function(selector){
      Array.from(
        root.querySelectorAll(selector)
      ).forEach(function(grid){
        var children=
          Array.from(
            grid.children||[]
          ).filter(visible);

        if(children.length<2){
          return;
        }

        var groups=[];

        children.forEach(function(child){
          var top=
            child
              .getBoundingClientRect()
              .top;

          var group=null;

          for(var i=0;i
        MOBILE_MAX
      ){
        alignOverviewCards(
          headers
        );

        equaliseDetailGrids();
      }
    }finally{
      running=false;
    }
  }

  function onResize(){
    if(resizeTimer){
      clearTimeout(
        resizeTimer
      );
    }

    resizeTimer=
      setTimeout(
        function(){
          resizeTimer=0;
          run();
        },
        RESIZE_DEBOUNCE
      );
  }

  async function waitForReady(){
    if(
      document.readyState!=="complete"
    ){
      await new Promise(function(resolve){
        window.addEventListener(
          "load",
          resolve,
          {once:true}
        );
      });
    }

    if(
      document.fonts&&
      document.fonts.ready
    ){
      try{
        await document.fonts.ready;
      }catch(error){}
    }

    var images=
      Array.from(
        root.querySelectorAll("img")
      );

    await Promise.all(
      images.map(function(img){
        if(img.complete){
          return Promise.resolve();
        }

        return new Promise(function(resolve){
          var done=function(){
            resolve();
          };

          img.addEventListener(
            "load",
            done,
            {once:true}
          );

          img.addEventListener(
            "error",
            done,
            {once:true}
          );
        });
      })
    );

    run();
  }

  window.addEventListener(
    "resize",
    onResize,
    {passive:true}
  );

  waitForReady();
})();