@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("./fonts/PlusJakartaSans-latin-wght.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: "Plus Jakarta Sans";
  src: url("./fonts/PlusJakartaSans-latin-ext-wght.woff2") format("woff2");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  unicode-range: U+0100-02FF, U+1E00-1EFF;
}
* {
  box-sizing: border-box;
}
body {
  margin: 0;
  color: var(--ls-text);
  background: var(--ls-wash);
  font:
    16px/1.65 "Plus Jakarta Sans",
    sans-serif;
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
.button {
  cursor: pointer;
  border: 1px solid var(--ls-line);
  border-radius: var(--ls-radius-pill);
  padding: 0.65rem 1.15rem;
  color: var(--ls-text);
  background: var(--ls-surface);
  text-decoration: none;
  display: inline-block;
}
button:hover,
.button:hover {
  background: var(--ls-primary-wash);
}
button:disabled {
  opacity: 0.6;
  cursor: default;
}
.primary {
  background: var(--ls-blue-600);
  border-color: var(--ls-blue-600);
  color: var(--ls-surface);
}
.primary:hover {
  background: var(--ls-blue-700);
}
:focus-visible {
  outline: 3px solid var(--ls-blue-600);
  outline-offset: 3px;
}
a {
  color: var(--ls-link);
}
h1,
h2,
h3 {
  line-height: 1.25;
}
p {
  overflow-wrap: anywhere;
}
input,
select,
textarea {
  width: 100%;
  border: 1px solid var(--ls-ink-3);
  border-radius: var(--ls-radius-md);
  padding: 0.7rem;
  color: var(--ls-text);
  background: var(--ls-surface);
}
input[type="radio"],
input[type="checkbox"] {
  width: auto;
  accent-color: var(--ls-blue-600);
}
label {
  display: block;
}
img,
video,
audio,
iframe {
  max-width: 100%;
}
img {
  height: auto;
}
video {
  width: 100%;
  max-height: 65vh;
  background: var(--ls-ink);
}
audio {
  width: 100%;
}
figure {
  margin: 1rem 0;
}
figcaption,
.muted {
  color: var(--ls-text-muted);
  font-size: 0.9rem;
}
hr {
  border: 0;
  border-top: 1px solid var(--ls-line);
  margin: 2rem 0;
}
[hidden] {
  display: none !important;
}
.learner {
  max-width: 1200px;
  margin: auto;
  background: var(--ls-surface);
  min-height: 100vh;
}
.player-header {
  padding: 1.2rem 2rem;
  border-bottom: 1px solid var(--ls-line);
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.player-header span {
  color: var(--ls-text-muted);
  font-size: 0.85rem;
}
.progress {
  padding: 1rem 2rem;
  display: flex;
  align-items: center;
  gap: 1rem;
}
.progress span {
  font-size: 0.85rem;
  white-space: nowrap;
}
progress {
  width: 100%;
  height: 10px;
  accent-color: var(--ls-green-600);
}
progress::-webkit-progress-bar {
  background: var(--ls-line);
  border-radius: var(--ls-radius-pill);
}
progress::-webkit-progress-value {
  background: var(--ls-green-600);
  border-radius: var(--ls-radius-pill);
}
.player-layout {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
}
.course-menu {
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.course-menu button {
  text-align: left;
  overflow-wrap: anywhere;
  border-radius: var(--ls-radius-md);
}
.course-menu [aria-current="page"] {
  background: var(--ls-primary-soft);
  color: var(--ls-blue-700);
  border-color: var(--ls-blue-600);
}
.learner-page {
  padding: 1.5rem 2.5rem;
  min-width: 0;
}
.learner-page > h1 {
  font-size: 1.1rem;
  color: var(--ls-text-muted);
}
.learner-block {
  margin: 1.6rem 0;
}
.learner-block h2 {
  font-size: clamp(1.8rem, 4vw, 2.8rem);
}
.callout {
  padding: 1.4rem;
  border-left: 5px solid var(--ls-blue-600);
  background: var(--ls-blue-50);
  border-radius: var(--ls-radius-md);
}
details {
  border: 1px solid var(--ls-line);
  border-radius: var(--ls-radius-md);
  padding: 1rem;
  margin: 0.7rem 0;
}
summary {
  cursor: pointer;
  font-weight: 700;
}
.tabs [role="tablist"] {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.tabs [aria-selected="true"] {
  color: var(--ls-surface);
  background: var(--course-accent, var(--ls-blue-600));
}
.tabs [role="tabpanel"] {
  padding: 1rem;
  background: var(--ls-wash);
  border-radius: var(--ls-radius-md);
  margin-top: 0.6rem;
}
.flip-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
  gap: 1rem;
}
.flip-card {
  border: 1px solid var(--ls-line);
  border-radius: var(--ls-radius-lg);
  padding: 1rem;
}
.flip-card button {
  width: 100%;
  font-weight: 700;
}
.process {
  padding-left: 1.5rem;
}
.process li {
  padding: 0.7rem;
}
.process li::marker {
  color: var(--ls-blue-600);
  font-weight: 800;
}
.embed {
  padding: 1rem;
  background: var(--ls-wash);
  border-radius: var(--ls-radius-lg);
}
.embed iframe {
  width: 100%;
  aspect-ratio: 16/9;
  border: 0;
}
.answer {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  padding: 0.8rem;
  border: 1px solid var(--ls-line);
  border-radius: var(--ls-radius-md);
  margin: 0.7rem 0;
}
fieldset {
  border: 0;
  padding: 0;
  min-width: 0;
}
legend {
  font-weight: 700;
  font-size: 1.2rem;
}
.quiz-feedback {
  padding: 0.8rem;
  background: var(--ls-wash);
}
.score-card {
  background: var(--ls-success-bg);
  border: 1px solid var(--ls-green-600);
  color: var(--ls-green-700);
  padding: 1.3rem;
  border-radius: var(--ls-radius-lg);
  font-weight: 700;
}
.tracking-status {
  color: var(--ls-text-muted);
  font-size: 0.85rem;
}
.player-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  border-top: 1px solid var(--ls-line);
  padding-top: 1.2rem;
}
.placeholder {
  padding: 1rem;
  background: var(--ls-wash);
  color: var(--ls-text-muted);
}
@media (max-width: 650px) {
  .player-layout {
    grid-template-columns: 1fr;
  }
  .course-menu {
    flex-direction: row;
    overflow-x: auto;
  }
  .course-menu button {
    flex: 0 0 150px;
  }
  .learner-page {
    padding: 1rem;
  }
  .player-header,
  .progress {
    padding: 1rem;
  }
  .progress {
    flex-wrap: wrap;
  }
  .player-footer {
    gap: 0.5rem;
  }
}

.accent-blue-600 {
  --course-accent: var(--ls-blue-600);
}
.accent-blue-700 {
  --course-accent: var(--ls-blue-700);
}
.accent-green-600 {
  --course-accent: var(--ls-green-600);
}
.accent-green-700 {
  --course-accent: var(--ls-green-700);
}

.scene-stage {
  position: relative;
  aspect-ratio: 16/9;
  background: var(--ls-wash);
  border: 1px solid var(--ls-line);
  overflow: hidden;
  isolation: isolate;
}
.scene-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.scene-object {
  position: absolute;
  box-sizing: border-box;
  margin: 0;
  overflow: auto;
  pointer-events: auto;
  font-size: clamp(12px, 2vw, 24px);
}
.scene-object img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.scene-shape {
  background: var(--ls-green-100);
  border: 2px solid var(--ls-green-600);
  border-radius: 12px;
  padding: 8px;
  color: var(--ls-ink);
}
.scene-button {
  background: var(--ls-blue-600);
  color: var(--ls-surface);
}
.scene-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 0;
}
.scene-controls label {
  display: flex;
  align-items: center;
  gap: 8px;
}
.scene-fade {
  animation: scene-fade 0.5s ease;
}
.scene-rise {
  animation: scene-rise 0.5s ease;
}
@keyframes scene-fade {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes scene-rise {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (prefers-reduced-motion: reduce) {
  .scene-fade,
  .scene-rise {
    animation: none;
  }
}
.scene [hidden] {
  display: none !important;
}
.sx-0 {
  left: 0%;
}
.sy-0 {
  top: 0%;
}
.sw-0 {
  width: 0%;
}
.sh-0 {
  height: 0%;
}
.sx-1 {
  left: 1%;
}
.sy-1 {
  top: 1%;
}
.sw-1 {
  width: 1%;
}
.sh-1 {
  height: 1%;
}
.sx-2 {
  left: 2%;
}
.sy-2 {
  top: 2%;
}
.sw-2 {
  width: 2%;
}
.sh-2 {
  height: 2%;
}
.sx-3 {
  left: 3%;
}
.sy-3 {
  top: 3%;
}
.sw-3 {
  width: 3%;
}
.sh-3 {
  height: 3%;
}
.sx-4 {
  left: 4%;
}
.sy-4 {
  top: 4%;
}
.sw-4 {
  width: 4%;
}
.sh-4 {
  height: 4%;
}
.sx-5 {
  left: 5%;
}
.sy-5 {
  top: 5%;
}
.sw-5 {
  width: 5%;
}
.sh-5 {
  height: 5%;
}
.sx-6 {
  left: 6%;
}
.sy-6 {
  top: 6%;
}
.sw-6 {
  width: 6%;
}
.sh-6 {
  height: 6%;
}
.sx-7 {
  left: 7%;
}
.sy-7 {
  top: 7%;
}
.sw-7 {
  width: 7%;
}
.sh-7 {
  height: 7%;
}
.sx-8 {
  left: 8%;
}
.sy-8 {
  top: 8%;
}
.sw-8 {
  width: 8%;
}
.sh-8 {
  height: 8%;
}
.sx-9 {
  left: 9%;
}
.sy-9 {
  top: 9%;
}
.sw-9 {
  width: 9%;
}
.sh-9 {
  height: 9%;
}
.sx-10 {
  left: 10%;
}
.sy-10 {
  top: 10%;
}
.sw-10 {
  width: 10%;
}
.sh-10 {
  height: 10%;
}
.sx-11 {
  left: 11%;
}
.sy-11 {
  top: 11%;
}
.sw-11 {
  width: 11%;
}
.sh-11 {
  height: 11%;
}
.sx-12 {
  left: 12%;
}
.sy-12 {
  top: 12%;
}
.sw-12 {
  width: 12%;
}
.sh-12 {
  height: 12%;
}
.sx-13 {
  left: 13%;
}
.sy-13 {
  top: 13%;
}
.sw-13 {
  width: 13%;
}
.sh-13 {
  height: 13%;
}
.sx-14 {
  left: 14%;
}
.sy-14 {
  top: 14%;
}
.sw-14 {
  width: 14%;
}
.sh-14 {
  height: 14%;
}
.sx-15 {
  left: 15%;
}
.sy-15 {
  top: 15%;
}
.sw-15 {
  width: 15%;
}
.sh-15 {
  height: 15%;
}
.sx-16 {
  left: 16%;
}
.sy-16 {
  top: 16%;
}
.sw-16 {
  width: 16%;
}
.sh-16 {
  height: 16%;
}
.sx-17 {
  left: 17%;
}
.sy-17 {
  top: 17%;
}
.sw-17 {
  width: 17%;
}
.sh-17 {
  height: 17%;
}
.sx-18 {
  left: 18%;
}
.sy-18 {
  top: 18%;
}
.sw-18 {
  width: 18%;
}
.sh-18 {
  height: 18%;
}
.sx-19 {
  left: 19%;
}
.sy-19 {
  top: 19%;
}
.sw-19 {
  width: 19%;
}
.sh-19 {
  height: 19%;
}
.sx-20 {
  left: 20%;
}
.sy-20 {
  top: 20%;
}
.sw-20 {
  width: 20%;
}
.sh-20 {
  height: 20%;
}
.sx-21 {
  left: 21%;
}
.sy-21 {
  top: 21%;
}
.sw-21 {
  width: 21%;
}
.sh-21 {
  height: 21%;
}
.sx-22 {
  left: 22%;
}
.sy-22 {
  top: 22%;
}
.sw-22 {
  width: 22%;
}
.sh-22 {
  height: 22%;
}
.sx-23 {
  left: 23%;
}
.sy-23 {
  top: 23%;
}
.sw-23 {
  width: 23%;
}
.sh-23 {
  height: 23%;
}
.sx-24 {
  left: 24%;
}
.sy-24 {
  top: 24%;
}
.sw-24 {
  width: 24%;
}
.sh-24 {
  height: 24%;
}
.sx-25 {
  left: 25%;
}
.sy-25 {
  top: 25%;
}
.sw-25 {
  width: 25%;
}
.sh-25 {
  height: 25%;
}
.sx-26 {
  left: 26%;
}
.sy-26 {
  top: 26%;
}
.sw-26 {
  width: 26%;
}
.sh-26 {
  height: 26%;
}
.sx-27 {
  left: 27%;
}
.sy-27 {
  top: 27%;
}
.sw-27 {
  width: 27%;
}
.sh-27 {
  height: 27%;
}
.sx-28 {
  left: 28%;
}
.sy-28 {
  top: 28%;
}
.sw-28 {
  width: 28%;
}
.sh-28 {
  height: 28%;
}
.sx-29 {
  left: 29%;
}
.sy-29 {
  top: 29%;
}
.sw-29 {
  width: 29%;
}
.sh-29 {
  height: 29%;
}
.sx-30 {
  left: 30%;
}
.sy-30 {
  top: 30%;
}
.sw-30 {
  width: 30%;
}
.sh-30 {
  height: 30%;
}
.sx-31 {
  left: 31%;
}
.sy-31 {
  top: 31%;
}
.sw-31 {
  width: 31%;
}
.sh-31 {
  height: 31%;
}
.sx-32 {
  left: 32%;
}
.sy-32 {
  top: 32%;
}
.sw-32 {
  width: 32%;
}
.sh-32 {
  height: 32%;
}
.sx-33 {
  left: 33%;
}
.sy-33 {
  top: 33%;
}
.sw-33 {
  width: 33%;
}
.sh-33 {
  height: 33%;
}
.sx-34 {
  left: 34%;
}
.sy-34 {
  top: 34%;
}
.sw-34 {
  width: 34%;
}
.sh-34 {
  height: 34%;
}
.sx-35 {
  left: 35%;
}
.sy-35 {
  top: 35%;
}
.sw-35 {
  width: 35%;
}
.sh-35 {
  height: 35%;
}
.sx-36 {
  left: 36%;
}
.sy-36 {
  top: 36%;
}
.sw-36 {
  width: 36%;
}
.sh-36 {
  height: 36%;
}
.sx-37 {
  left: 37%;
}
.sy-37 {
  top: 37%;
}
.sw-37 {
  width: 37%;
}
.sh-37 {
  height: 37%;
}
.sx-38 {
  left: 38%;
}
.sy-38 {
  top: 38%;
}
.sw-38 {
  width: 38%;
}
.sh-38 {
  height: 38%;
}
.sx-39 {
  left: 39%;
}
.sy-39 {
  top: 39%;
}
.sw-39 {
  width: 39%;
}
.sh-39 {
  height: 39%;
}
.sx-40 {
  left: 40%;
}
.sy-40 {
  top: 40%;
}
.sw-40 {
  width: 40%;
}
.sh-40 {
  height: 40%;
}
.sx-41 {
  left: 41%;
}
.sy-41 {
  top: 41%;
}
.sw-41 {
  width: 41%;
}
.sh-41 {
  height: 41%;
}
.sx-42 {
  left: 42%;
}
.sy-42 {
  top: 42%;
}
.sw-42 {
  width: 42%;
}
.sh-42 {
  height: 42%;
}
.sx-43 {
  left: 43%;
}
.sy-43 {
  top: 43%;
}
.sw-43 {
  width: 43%;
}
.sh-43 {
  height: 43%;
}
.sx-44 {
  left: 44%;
}
.sy-44 {
  top: 44%;
}
.sw-44 {
  width: 44%;
}
.sh-44 {
  height: 44%;
}
.sx-45 {
  left: 45%;
}
.sy-45 {
  top: 45%;
}
.sw-45 {
  width: 45%;
}
.sh-45 {
  height: 45%;
}
.sx-46 {
  left: 46%;
}
.sy-46 {
  top: 46%;
}
.sw-46 {
  width: 46%;
}
.sh-46 {
  height: 46%;
}
.sx-47 {
  left: 47%;
}
.sy-47 {
  top: 47%;
}
.sw-47 {
  width: 47%;
}
.sh-47 {
  height: 47%;
}
.sx-48 {
  left: 48%;
}
.sy-48 {
  top: 48%;
}
.sw-48 {
  width: 48%;
}
.sh-48 {
  height: 48%;
}
.sx-49 {
  left: 49%;
}
.sy-49 {
  top: 49%;
}
.sw-49 {
  width: 49%;
}
.sh-49 {
  height: 49%;
}
.sx-50 {
  left: 50%;
}
.sy-50 {
  top: 50%;
}
.sw-50 {
  width: 50%;
}
.sh-50 {
  height: 50%;
}
.sx-51 {
  left: 51%;
}
.sy-51 {
  top: 51%;
}
.sw-51 {
  width: 51%;
}
.sh-51 {
  height: 51%;
}
.sx-52 {
  left: 52%;
}
.sy-52 {
  top: 52%;
}
.sw-52 {
  width: 52%;
}
.sh-52 {
  height: 52%;
}
.sx-53 {
  left: 53%;
}
.sy-53 {
  top: 53%;
}
.sw-53 {
  width: 53%;
}
.sh-53 {
  height: 53%;
}
.sx-54 {
  left: 54%;
}
.sy-54 {
  top: 54%;
}
.sw-54 {
  width: 54%;
}
.sh-54 {
  height: 54%;
}
.sx-55 {
  left: 55%;
}
.sy-55 {
  top: 55%;
}
.sw-55 {
  width: 55%;
}
.sh-55 {
  height: 55%;
}
.sx-56 {
  left: 56%;
}
.sy-56 {
  top: 56%;
}
.sw-56 {
  width: 56%;
}
.sh-56 {
  height: 56%;
}
.sx-57 {
  left: 57%;
}
.sy-57 {
  top: 57%;
}
.sw-57 {
  width: 57%;
}
.sh-57 {
  height: 57%;
}
.sx-58 {
  left: 58%;
}
.sy-58 {
  top: 58%;
}
.sw-58 {
  width: 58%;
}
.sh-58 {
  height: 58%;
}
.sx-59 {
  left: 59%;
}
.sy-59 {
  top: 59%;
}
.sw-59 {
  width: 59%;
}
.sh-59 {
  height: 59%;
}
.sx-60 {
  left: 60%;
}
.sy-60 {
  top: 60%;
}
.sw-60 {
  width: 60%;
}
.sh-60 {
  height: 60%;
}
.sx-61 {
  left: 61%;
}
.sy-61 {
  top: 61%;
}
.sw-61 {
  width: 61%;
}
.sh-61 {
  height: 61%;
}
.sx-62 {
  left: 62%;
}
.sy-62 {
  top: 62%;
}
.sw-62 {
  width: 62%;
}
.sh-62 {
  height: 62%;
}
.sx-63 {
  left: 63%;
}
.sy-63 {
  top: 63%;
}
.sw-63 {
  width: 63%;
}
.sh-63 {
  height: 63%;
}
.sx-64 {
  left: 64%;
}
.sy-64 {
  top: 64%;
}
.sw-64 {
  width: 64%;
}
.sh-64 {
  height: 64%;
}
.sx-65 {
  left: 65%;
}
.sy-65 {
  top: 65%;
}
.sw-65 {
  width: 65%;
}
.sh-65 {
  height: 65%;
}
.sx-66 {
  left: 66%;
}
.sy-66 {
  top: 66%;
}
.sw-66 {
  width: 66%;
}
.sh-66 {
  height: 66%;
}
.sx-67 {
  left: 67%;
}
.sy-67 {
  top: 67%;
}
.sw-67 {
  width: 67%;
}
.sh-67 {
  height: 67%;
}
.sx-68 {
  left: 68%;
}
.sy-68 {
  top: 68%;
}
.sw-68 {
  width: 68%;
}
.sh-68 {
  height: 68%;
}
.sx-69 {
  left: 69%;
}
.sy-69 {
  top: 69%;
}
.sw-69 {
  width: 69%;
}
.sh-69 {
  height: 69%;
}
.sx-70 {
  left: 70%;
}
.sy-70 {
  top: 70%;
}
.sw-70 {
  width: 70%;
}
.sh-70 {
  height: 70%;
}
.sx-71 {
  left: 71%;
}
.sy-71 {
  top: 71%;
}
.sw-71 {
  width: 71%;
}
.sh-71 {
  height: 71%;
}
.sx-72 {
  left: 72%;
}
.sy-72 {
  top: 72%;
}
.sw-72 {
  width: 72%;
}
.sh-72 {
  height: 72%;
}
.sx-73 {
  left: 73%;
}
.sy-73 {
  top: 73%;
}
.sw-73 {
  width: 73%;
}
.sh-73 {
  height: 73%;
}
.sx-74 {
  left: 74%;
}
.sy-74 {
  top: 74%;
}
.sw-74 {
  width: 74%;
}
.sh-74 {
  height: 74%;
}
.sx-75 {
  left: 75%;
}
.sy-75 {
  top: 75%;
}
.sw-75 {
  width: 75%;
}
.sh-75 {
  height: 75%;
}
.sx-76 {
  left: 76%;
}
.sy-76 {
  top: 76%;
}
.sw-76 {
  width: 76%;
}
.sh-76 {
  height: 76%;
}
.sx-77 {
  left: 77%;
}
.sy-77 {
  top: 77%;
}
.sw-77 {
  width: 77%;
}
.sh-77 {
  height: 77%;
}
.sx-78 {
  left: 78%;
}
.sy-78 {
  top: 78%;
}
.sw-78 {
  width: 78%;
}
.sh-78 {
  height: 78%;
}
.sx-79 {
  left: 79%;
}
.sy-79 {
  top: 79%;
}
.sw-79 {
  width: 79%;
}
.sh-79 {
  height: 79%;
}
.sx-80 {
  left: 80%;
}
.sy-80 {
  top: 80%;
}
.sw-80 {
  width: 80%;
}
.sh-80 {
  height: 80%;
}
.sx-81 {
  left: 81%;
}
.sy-81 {
  top: 81%;
}
.sw-81 {
  width: 81%;
}
.sh-81 {
  height: 81%;
}
.sx-82 {
  left: 82%;
}
.sy-82 {
  top: 82%;
}
.sw-82 {
  width: 82%;
}
.sh-82 {
  height: 82%;
}
.sx-83 {
  left: 83%;
}
.sy-83 {
  top: 83%;
}
.sw-83 {
  width: 83%;
}
.sh-83 {
  height: 83%;
}
.sx-84 {
  left: 84%;
}
.sy-84 {
  top: 84%;
}
.sw-84 {
  width: 84%;
}
.sh-84 {
  height: 84%;
}
.sx-85 {
  left: 85%;
}
.sy-85 {
  top: 85%;
}
.sw-85 {
  width: 85%;
}
.sh-85 {
  height: 85%;
}
.sx-86 {
  left: 86%;
}
.sy-86 {
  top: 86%;
}
.sw-86 {
  width: 86%;
}
.sh-86 {
  height: 86%;
}
.sx-87 {
  left: 87%;
}
.sy-87 {
  top: 87%;
}
.sw-87 {
  width: 87%;
}
.sh-87 {
  height: 87%;
}
.sx-88 {
  left: 88%;
}
.sy-88 {
  top: 88%;
}
.sw-88 {
  width: 88%;
}
.sh-88 {
  height: 88%;
}
.sx-89 {
  left: 89%;
}
.sy-89 {
  top: 89%;
}
.sw-89 {
  width: 89%;
}
.sh-89 {
  height: 89%;
}
.sx-90 {
  left: 90%;
}
.sy-90 {
  top: 90%;
}
.sw-90 {
  width: 90%;
}
.sh-90 {
  height: 90%;
}
.sx-91 {
  left: 91%;
}
.sy-91 {
  top: 91%;
}
.sw-91 {
  width: 91%;
}
.sh-91 {
  height: 91%;
}
.sx-92 {
  left: 92%;
}
.sy-92 {
  top: 92%;
}
.sw-92 {
  width: 92%;
}
.sh-92 {
  height: 92%;
}
.sx-93 {
  left: 93%;
}
.sy-93 {
  top: 93%;
}
.sw-93 {
  width: 93%;
}
.sh-93 {
  height: 93%;
}
.sx-94 {
  left: 94%;
}
.sy-94 {
  top: 94%;
}
.sw-94 {
  width: 94%;
}
.sh-94 {
  height: 94%;
}
.sx-95 {
  left: 95%;
}
.sy-95 {
  top: 95%;
}
.sw-95 {
  width: 95%;
}
.sh-95 {
  height: 95%;
}
.sx-96 {
  left: 96%;
}
.sy-96 {
  top: 96%;
}
.sw-96 {
  width: 96%;
}
.sh-96 {
  height: 96%;
}
.sx-97 {
  left: 97%;
}
.sy-97 {
  top: 97%;
}
.sw-97 {
  width: 97%;
}
.sh-97 {
  height: 97%;
}
.sx-98 {
  left: 98%;
}
.sy-98 {
  top: 98%;
}
.sw-98 {
  width: 98%;
}
.sh-98 {
  height: 98%;
}
.sx-99 {
  left: 99%;
}
.sy-99 {
  top: 99%;
}
.sw-99 {
  width: 99%;
}
.sh-99 {
  height: 99%;
}
.sx-100 {
  left: 100%;
}
.sy-100 {
  top: 100%;
}
.sw-100 {
  width: 100%;
}
.sh-100 {
  height: 100%;
}