/* ============================================================
   SPIRANGLE TECHNOLOGIES
   2D DELAUNAY TRIANGULATION
   Responsive Engineering Workspace
   ============================================================ */


/* ============================================================
   ROOT
   ============================================================ */

:root {
  --spirangle-dark: #084b63;
  --spirangle-dark-deep: #063b4e;

  --spirangle-blue: #329ac7;
  --spirangle-light-blue: #7fd3f1;

  --workspace: #05090b;
  --sidebar: #10242c;

  --text-primary: #ffffff;
  --text-muted: rgba(255, 255, 255, 0.55);

  --border-light: rgba(255, 255, 255, 0.10);

  --control-bg: #5fb6ed;
  --control-hover: #7fd3f1;

  --header-height: 82px;
  --sidebar-width: 74px;
}


/* ============================================================
   RESET
   ============================================================ */

* {
  box-sizing: border-box;
}

html,
body {
  width: 100%;
  height: 100%;

  margin: 0;
  padding: 0;

  overflow: hidden;

  background: var(--workspace);

  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Helvetica,
    Arial,
    sans-serif;

  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}


/* ============================================================
   HEADER
   ============================================================ */

#menu-bar {
  position: absolute;

  top: 0;
  left: 0;

  width: 100%;
  height: var(--header-height);

  display: flex;
  align-items: center;

  background:
    linear-gradient(
      180deg,
      var(--spirangle-dark) 0%,
      var(--spirangle-dark-deep) 100%
    );

  border-bottom:
    1px solid
    rgba(255, 255, 255, 0.10);

  z-index: 100;

  box-shadow:
    0 4px 18px
    rgba(0, 0, 0, 0.18);
}


/* ============================================================
   LOGO
   ============================================================ */

#logo {
  position: absolute;

  left: 22px;
  top: 50%;

  width: 145px;
  height: auto;

  transform: translateY(-50%);

  object-fit: contain;

  z-index: 110;
}


/* ============================================================
   TITLE
   ============================================================ */

#title {
  position: absolute;

  left: 220px;
  right: 640px;

  top: 50%;

  margin: 0;
  padding: 0;

  transform: translateY(-50%);

  color: rgba(255, 255, 255, 0.92);

  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  font-size: 26px;
  font-weight: 600;

  line-height: 1.35;

  letter-spacing: -0.025em;

  text-align: left;

  white-space: nowrap;

  overflow: visible;

  text-overflow: ellipsis;

  z-index: 105;
}


/* ============================================================
   SIDEBAR
   ============================================================ */

#sidebar {
  position: absolute;

  top: var(--header-height);
  left: 0;
  bottom: 0;

  width: var(--sidebar-width);

  background:
    linear-gradient(
      180deg,
      #10242c 0%,
      #0c1d24 100%
    );

  border-right:
    1px solid
    rgba(255, 255, 255, 0.08);

  z-index: 90;
}


/* ============================================================
   FILE INPUT
   ============================================================ */

#fileInput {
  display: none;
}


/* ============================================================
   OPEN FILE BUTTON
   ============================================================ */

.custom-folder-icon {
  position: absolute;

  top: 26px;
  left: 50%;

  width: 42px;
  height: 42px;

  display: flex;

  align-items: center;
  justify-content: center;

  transform: translateX(-50%);

  border:
    1px solid
    rgba(255, 255, 255, 0.06);

  border-radius: 10px;

  cursor: pointer;

  transition:
    background 0.25s ease,
    border-color 0.25s ease,
    transform 0.25s ease;
}

.custom-folder-icon:hover {
  background:
    rgba(127, 211, 241, 0.10);

  border-color:
    rgba(127, 211, 241, 0.25);

  transform:
    translateX(-50%)
    translateY(-1px);
}

.custom-folder-icon img {
  width: 34px;
  height: 34px;

  object-fit: contain;
}


/* ============================================================
   SAVE BUTTON
   ============================================================ */

#saveButton {
  position: absolute;

  top: 84px;
  left: 50%;

  width: 42px;
  height: 42px;

  display: flex;

  align-items: center;
  justify-content: center;

  transform: translateX(-50%);

  padding: 0;

  border:
    1px solid
    rgba(255, 255, 255, 0.06);

  border-radius: 10px;

  background: transparent;

  cursor: pointer;

  transition:
    background 0.25s ease,
    border-color 0.25s ease,
    transform 0.25s ease;
}

#saveButton:hover {
  background:
    rgba(127, 211, 241, 0.10);

  border-color:
    rgba(127, 211, 241, 0.25);

  transform:
    translateX(-50%)
    translateY(-1px);
}

#saveButton img {
  width: 34px;
  height: 34px;

  object-fit: contain;
}


/* ============================================================
   VTK WORKSPACE
   ============================================================ */

#vtk-container {
  position: absolute;

  top: var(--header-height);
  left: var(--sidebar-width);
  right: 0;
  bottom: 0;

  margin: 0;

  background:
    radial-gradient(
      circle at 50% 48%,
      rgba(31, 126, 165, 0.07),
      transparent 42%
    ),
    #05090b;

  overflow: hidden;

  z-index: 1;
}


/* ============================================================
   SUBTLE WORKSPACE GRID
   ============================================================ */

#vtk-container::before {
  content: "";

  position: absolute;

  inset: 0;

  pointer-events: none;

  opacity: 0.035;

  background-image:
    linear-gradient(
      rgba(255, 255, 255, 0.8) 1px,
      transparent 1px
    ),
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.8) 1px,
      transparent 1px
    );

  background-size: 60px 60px;

  z-index: 0;
}


/* ============================================================
   VTK CANVAS
   ============================================================ */

#vtk-container canvas {
  display: block;

  max-width: none;
  max-height: none;
}


/* ============================================================
   UPLOAD LABEL
   ============================================================ */

#label {
  position: absolute;

  left: 50%;
  top: 50%;

  transform:
    translate(-50%, -50%);

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  width: max-content;
  min-width: 180px;

  padding: 20px;

  text-align: center;

  color:
    rgba(255, 255, 255, 0.78);

  z-index: 5;
}

#label h1 {
  margin: 14px 0 5px;

  font-size: 18px;

  line-height: 1.4;

  font-weight: 500;

  letter-spacing: -0.01em;

  color:
    rgba(255, 255, 255, 0.82);
}

#label h2 {
  margin: 0;

  font-size: 12px;

  line-height: 1.5;

  font-weight: 400;

  color:
    rgba(255, 255, 255, 0.40);
}


/* ============================================================
   UPLOAD ICON
   ============================================================ */

.folder-icon {
  display: flex;

  align-items: center;
  justify-content: center;

  width: 64px;
  height: 64px;

  border-radius: 16px;

  background:
    rgba(127, 211, 241, 0.05);

  border:
    1px solid
    rgba(127, 211, 241, 0.08);

  cursor: pointer;

  transition:
    background 0.25s ease,
    border-color 0.25s ease,
    transform 0.25s ease;
}

.folder-icon:hover {
  background:
    rgba(127, 211, 241, 0.10);

  border-color:
    rgba(127, 211, 241, 0.25);

  transform:
    translateY(-2px);
}

.folder-icon img {
  width: 44px;
  height: 44px;

  object-fit: contain;
}


/* ============================================================
   DESKTOP ACTION BAR
   ============================================================ */

#delaunay,
#contour,
#volume,
#list {
  position: absolute;

  top: 21px;

  height: 34px;

  margin: 0;

  box-sizing: border-box;

  border:
    1px solid
    rgba(255, 255, 255, 0.12);

  border-radius: 8px;

  background:
    linear-gradient(
      180deg,
      #68b9eb 0%,
      #54aee2 100%
    );

  color: #07151c;

  font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

  font-size: 13px;

  font-weight: 600;

  line-height: normal;

  cursor: pointer;

  outline: none;

  z-index: 200;

  box-shadow:
    0 3px 10px
    rgba(0, 0, 0, 0.18);

  transition:
    transform 0.2s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;
}


/* ============================================================
   BUTTON HOVER
   ============================================================ */

#delaunay:hover,
#contour:hover,
#volume:hover,
#list:hover {
  background:
    linear-gradient(
      180deg,
      #7fd3f1 0%,
      #68b9eb 100%
    );

  transform:
    translateY(-1px);

  box-shadow:
    0 7px 20px
    rgba(0, 0, 0, 0.25);
}


/* ============================================================
   BUTTON ACTIVE
   ============================================================ */

#delaunay:active,
#contour:active,
#volume:active,
#list:active {
  transform:
    translateY(0);

  box-shadow:
    0 2px 7px
    rgba(0, 0, 0, 0.18);
}


/* ============================================================
   GENERATE DELAUNAY
   ============================================================ */

#delaunay {
  right: 530px;

  width: 190px;

  padding: 0 16px;
}


/* ============================================================
   GENERATE CONTOUR
   ============================================================ */

#contour {
  right: 320px;

  width: 190px;

  padding: 0 16px;
}


/* ============================================================
   VOLUME
   ============================================================ */

#volume {
  right: 200px;

  width: 105px;

  padding: 0 14px;
}


/* ============================================================
   VIEW MODE
   ============================================================ */

#list {
  right: 22px;

  width: 160px;

  padding: 0 13px;

  appearance: auto;
  -webkit-appearance: auto;

  color: #07151c;
}


/* ============================================================
   DROPDOWN OPTIONS
   ============================================================ */

/*
 * Explicitly style the options so that the native dropdown
 * does not render white text on a white background on mobile.
 */

#list option {
  background-color: #0c222d;
  color: #ffffff;
}


/*
 * Helps supported browsers use a dark native select popup.
 */

#list {
  color-scheme: dark;
}


/* ============================================================
   VOLUME RESULT
   ============================================================ */

#myTextBox {
  position: absolute;

  right: 22px;
  bottom: 22px;

  width: 190px;
  height: 36px;

  box-sizing: border-box;

  padding: 0 12px;

  border:
    1px solid
    rgba(255, 255, 255, 0.14);

  border-radius: 9px;

  background:
    rgba(10, 20, 24, 0.82);

  color:
    rgba(255, 255, 255, 0.88);

  font-size: 13px;

  outline: none;

  z-index: 100;
}


/* ============================================================
   HIDDEN WASM CANVAS
   ============================================================ */

#canvas {
  position: absolute;

  left: 0;
  top: 0;

  width: 0;
  height: 0;
}


/* ============================================================
   LARGE LAPTOP
   ============================================================ */

@media (max-width: 1250px) {

  #logo {
    width: 125px;
  }

  #title {
    left: 180px;
    right: 610px;

    font-size: 22px;
    line-height: 1.35;
  }

  #delaunay {
    right: 500px;

    width: 170px;

    font-size: 12px;
  }

  #contour {
    right: 315px;

    width: 170px;

    font-size: 12px;
  }

  #volume {
    right: 205px;

    width: 90px;

    font-size: 12px;
  }

  #list {
    right: 18px;

    width: 165px;

    font-size: 12px;
  }
}


/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 1100px) {

  :root {
    --header-height: 58px;
    --sidebar-width: 0px;

    --mobile-bottom:
      env(safe-area-inset-bottom, 0px);
  }


  /* ==========================================================
     MOBILE PAGE
     ========================================================== */

  html,
  body {
    width: 100%;
    height: 100%;
    height: 100dvh;

    overflow: hidden;

    background:
      #05090b;
  }


  /* ==========================================================
     MOBILE HEADER
     ========================================================== */

  #menu-bar {
    position: fixed;

    top: 0;
    left: 0;
    right: 0;

    width: 100%;
    height: var(--header-height);

    padding: 0 12px;

    background:
      linear-gradient(
        180deg,
        #084b63 0%,
        #063b4e 100%
      );

    z-index: 1000;

    box-shadow:
      0 5px 22px
      rgba(0, 0, 0, 0.25);
  }


  /* ==========================================================
     MOBILE LOGO
     ========================================================== */

  #logo {
    position: absolute;

    left: 12px;
    top: 50%;

    width: 96px;
    height: auto;

    transform:
      translateY(-50%);

    object-fit: contain;
  }


  /* ==========================================================
     MOBILE TITLE
     ========================================================== */

  #title {
    position: absolute;

    left: 120px;
    right: 12px;

    top: 50%;

    margin: 0;

    transform:
      translateY(-50%);

    font-size: 11px;

    line-height: 1.25;

    font-weight: 600;

    letter-spacing: -0.01em;

    color:
      rgba(255, 255, 255, 0.88);

    text-align: right;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;
  }


  /* ==========================================================
     MOBILE SIDEBAR
     ========================================================== */

  #sidebar {
    position: fixed;

    top:
      calc(
        var(--header-height) + 12px
      );

    left: 10px;

    right: auto;
    bottom: auto;

    width: 42px;
    height: auto;

    padding: 6px 0;

    display: flex;
    flex-direction: column;
    align-items: center;

    gap: 6px;

    background:
      rgba(13, 34, 44, 0.88);

    border:
      1px solid
      rgba(255, 255, 255, 0.08);

    border-radius: 13px;

    box-shadow:
      0 10px 28px
      rgba(0, 0, 0, 0.28);

    backdrop-filter:
      blur(12px);

    -webkit-backdrop-filter:
      blur(12px);

    z-index: 900;
  }


  /* ==========================================================
     MOBILE FILE BUTTON
     ========================================================== */

  .custom-folder-icon {
    position: relative;

    top: auto;
    left: auto;

    width: 32px;
    height: 32px;

    transform: none;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
      1px solid
      rgba(255, 255, 255, 0.06);

    border-radius: 9px;

    background:
      rgba(255, 255, 255, 0.04);

    cursor: pointer;
  }


  .custom-folder-icon:hover {
    transform: none;

    background:
      rgba(127, 211, 241, 0.10);
  }


  .custom-folder-icon img {
    width: 20px;
    height: 20px;

    object-fit: contain;
  }


  /* ==========================================================
     MOBILE SAVE
     ========================================================== */

  #saveButton {
    position: relative;

    top: auto;
    left: auto;

    width: 32px;
    height: 32px;

    transform: none;

    padding: 0;

    display: flex;

    align-items: center;
    justify-content: center;

    border:
      1px solid
      rgba(255, 255, 255, 0.06);

    border-radius: 9px;

    background:
      rgba(255, 255, 255, 0.04);
  }


  #saveButton:hover {
    transform: none;

    background:
      rgba(127, 211, 241, 0.10);
  }


  #saveButton img {
    width: 20px;
    height: 20px;

    object-fit: contain;
  }


  /* ==========================================================
     MOBILE VTK WORKSPACE
     ========================================================== */

  #vtk-container {
    position: fixed;

    top: var(--header-height);
    left: 0;
    right: 0;
    bottom: 70px;

    width: 100%;
    height: auto;

    margin: 0;

    background:
      radial-gradient(
        circle at 50% 45%,
        rgba(31, 126, 165, 0.10),
        transparent 48%
      ),
      #05090b;

    overflow: hidden;

    z-index: 1;
  }


  /* ==========================================================
     MOBILE GRID
     ========================================================== */

  #vtk-container::before {
    opacity: 0.025;

    background-size:
      44px 44px;
  }


  /* ==========================================================
     MOBILE CANVAS
     ========================================================== */

  #vtk-container canvas {
    display: block;

    max-width: none;
    max-height: none;
  }


  /* ==========================================================
     MOBILE UPLOAD STATE
     ========================================================== */

  #label {
    position: absolute;

    left: 50%;
    top: 50%;

    transform:
      translate(-50%, -50%);

    width:
      min(
        260px,
        calc(100vw - 90px)
      );

    min-width: 0;

    padding: 20px 16px;

    border:
      1px solid
      rgba(127, 211, 241, 0.12);

    border-radius: 17px;

    background:
      rgba(8, 25, 34, 0.72);

    box-shadow:
      0 20px 50px
      rgba(0, 0, 0, 0.35);

    backdrop-filter:
      blur(12px);

    -webkit-backdrop-filter:
      blur(12px);

    z-index: 20;
  }


  #label h1 {
    margin:
      11px 0 4px;

    font-size: 14px;

    line-height: 1.35;

    font-weight: 600;

    color:
      rgba(255, 255, 255, 0.88);
  }


  #label h2 {
    margin: 0;

    font-size: 10px;

    line-height: 1.4;

    color:
      rgba(255, 255, 255, 0.38);
  }


  .folder-icon {
    width: 48px;
    height: 48px;

    border-radius: 13px;

    background:
      rgba(127, 211, 241, 0.06);

    border:
      1px solid
      rgba(127, 211, 241, 0.12);
  }


  .folder-icon img {
    width: 30px;
    height: 30px;
  }


  /* ==========================================================
     MOBILE VIEW MODE / SELECT
     ========================================================== */

  #list {
    position: fixed;

    top:
      calc(
        var(--header-height) + 12px
      );

    right: 10px;

    width: auto;
    min-width: 104px;

    height: 36px;

    padding:
      0 30px 0 11px;

    margin: 0;

    border:
      1px solid
      rgba(127, 211, 241, 0.22);

    border-radius: 10px;

    background-color:
      #0c222d;

    color:
      #ffffff !important;

    font-size: 10px;

    font-weight: 600;

    appearance: auto;
    -webkit-appearance: auto;

    /*
     * Important for native mobile/browser dropdowns.
     */
    color-scheme: dark;

    box-shadow:
      0 8px 24px
      rgba(0, 0, 0, 0.25);

    backdrop-filter:
      blur(12px);

    -webkit-backdrop-filter:
      blur(12px);

    z-index: 800;
  }


  /*
   * Explicit option colors.
   *
   * This fixes the white-background / white-text
   * problem visible in your screenshot.
   */

  #list option {
    background-color:
      #0c222d !important;

    color:
      #ffffff !important;

    -webkit-text-fill-color:
      #ffffff !important;
  }


  /* ==========================================================
     MOBILE BOTTOM ACTION BAR
     ========================================================== */

  #delaunay,
  #contour,
  #volume {
    position: fixed;

    top: auto;

    bottom:
      calc(
        10px +
        var(--mobile-bottom)
      );

    height: 48px;

    margin: 0;

    padding: 0 6px;

    border-radius: 13px;

    font-size: 10px;

    font-weight: 650;

    line-height: 1.15;

    white-space: normal;

    box-shadow:
      0 8px 25px
      rgba(0, 0, 0, 0.25);

    z-index: 1000;

    -webkit-tap-highlight-color:
      transparent;

    touch-action: manipulation;
  }


  /* ==========================================================
     DELAUNAY BUTTON
     ========================================================== */

  #delaunay {
    left: 10px;

    right: auto;

    width:
      calc(
        33.333vw - 14px
      );

    background:
      linear-gradient(
        180deg,
        #68b9eb 0%,
        #329ac7 100%
      );

    color:
      #07151c;

    border:
      1px solid
      rgba(255, 255, 255, 0.14);
  }


  /* ==========================================================
     CONTOUR BUTTON
     ========================================================== */

  #contour {
    left:
      calc(
        33.333vw + 2px
      );

    right: auto;

    width:
      calc(
        33.333vw - 14px
      );

    background:
      rgba(12, 35, 46, 0.96);

    color:
      rgba(255, 255, 255, 0.90);

    border:
      1px solid
      rgba(127, 211, 241, 0.20);
  }


  /* ==========================================================
     VOLUME BUTTON
     ========================================================== */

  #volume {
    right: 10px;

    left: auto;

    width:
      calc(
        33.333vw - 14px
      );

    background:
      rgba(12, 35, 46, 0.96);

    color:
      rgba(255, 255, 255, 0.90);

    border:
      1px solid
      rgba(127, 211, 241, 0.20);
  }


  #delaunay:active,
  #contour:active,
  #volume:active {
    transform:
      scale(0.97);
  }


  /* ==========================================================
     MOBILE VOLUME RESULT
     ========================================================== */

  #myTextBox {
    position: fixed;

    right: 12px;

    bottom:
      calc(
        70px +
        var(--mobile-bottom)
      );

    width: 145px;
    height: 36px;

    padding: 0 10px;

    border:
      1px solid
      rgba(127, 211, 241, 0.18);

    border-radius: 10px;

    background:
      rgba(6, 18, 25, 0.90);

    color:
      rgba(157, 226, 250, 0.95);

    font-family:
      "SFMono-Regular",
      Consolas,
      "Liberation Mono",
      monospace;

    font-size: 10px;

    font-weight: 600;

    text-align: center;

    box-shadow:
      0 10px 28px
      rgba(0, 0, 0, 0.32);

    backdrop-filter:
      blur(12px);

    -webkit-backdrop-filter:
      blur(12px);

    z-index: 950;
  }
}


/* ============================================================
   SMALL PHONE
   ============================================================ */

@media (max-width: 420px) {

  :root {
    --header-height: 56px;
  }


  #logo {
    left: 10px;

    width: 90px;
  }


  #title {
    left: 108px;
    right: 10px;

    font-size: 10px;
  }


  #sidebar {
    top:
      calc(
        var(--header-height) + 10px
      );

    left: 8px;

    width: 40px;

    padding: 5px 0;

    gap: 5px;
  }


  .custom-folder-icon,
  #saveButton {
    width: 30px;
    height: 30px;
  }


  .custom-folder-icon img,
  #saveButton img {
    width: 19px;
    height: 19px;
  }


  #vtk-container {
    top: var(--header-height);

    bottom: 68px;
  }


  #list {
    top:
      calc(
        var(--header-height) + 10px
      );

    right: 8px;

    min-width: 94px;

    height: 34px;

    padding:
      0 27px 0 10px;

    font-size: 9px;

    background-color:
      #0c222d !important;

    color:
      #ffffff !important;

    color-scheme: dark;
  }


  #list option {
    background-color:
      #0c222d !important;

    color:
      #ffffff !important;

    -webkit-text-fill-color:
      #ffffff !important;
  }


  #delaunay,
  #contour,
  #volume {
    bottom:
      calc(
        9px +
        var(--mobile-bottom)
      );

    height: 46px;

    font-size: 9px;

    border-radius: 12px;
  }


  #delaunay {
    left: 8px;

    width:
      calc(
        33.333vw - 11px
      );
  }


  #contour {
    left:
      calc(
        33.333vw + 1px
      );

    width:
      calc(
        33.333vw - 11px
      );
  }


  #volume {
    right: 8px;

    width:
      calc(
        33.333vw - 11px
      );
  }


  #myTextBox {
    right: 9px;

    bottom:
      calc(
        67px +
        var(--mobile-bottom)
      );

    width: 132px;

    height: 34px;

    font-size: 9px;
  }
}


/* ============================================================
   VERY SMALL PHONE
   ============================================================ */

@media (max-width: 350px) {

  #logo {
    width: 82px;
  }


  #title {
    left: 98px;

    font-size: 9px;
  }


  #delaunay,
  #contour,
  #volume {
    font-size: 8px;
  }


  #list {
    min-width: 86px;

    font-size: 8px;
  }
}


/* ============================================================
   LANDSCAPE PHONE
   ============================================================ */

@media (
  max-width: 900px
) and (
  orientation: landscape
) {

  :root {
    --header-height: 50px;
  }


  #menu-bar {
    height: 50px;
  }


  #logo {
    width: 86px;
  }


  #title {
    left: 108px;

    font-size: 10px;
  }


  #sidebar {
    top: 60px;
  }


  #vtk-container {
    top: 50px;

    bottom: 58px;
  }


  #list {
    top: 60px;

    height: 32px;

    background-color:
      #0c222d !important;

    color:
      #ffffff !important;

    color-scheme: dark;
  }


  #list option {
    background-color:
      #0c222d !important;

    color:
      #ffffff !important;

    -webkit-text-fill-color:
      #ffffff !important;
  }


  #delaunay,
  #contour,
  #volume {
    bottom:
      calc(
        7px +
        var(--mobile-bottom)
      );

    height: 42px;
  }


  #myTextBox {
    bottom:
      calc(
        55px +
        var(--mobile-bottom)
      );

    height: 32px;
  }
}


/* ============================================================
   REDUCE MOTION
   ============================================================ */

@media (prefers-reduced-motion: reduce) {

  *,
  *::before,
  *::after {
    transition: none !important;
    animation: none !important;
  }
}