@font-face {
  font-family: "Alice Yotsuba";
  src: url("/fonts/alice-yotsuba.ttf") format("truetype");
}

@font-face {
  font-family: "Super Corn";
  src: url("/fonts/super-corn.ttf") format("truetype");
}

:root {
  --apple: #dbfc94;
  --apple-deep: #abcd60;
  --apple-dark: #72863f;
  --leaf: #6f8f4e;
  --leaf-dark: #435733;
  --white: #ffffff;
  --cream: #fffdde;
  --blue: #d1f0f5;
  --pink: #fed4d4;
  --silver: #b9c0bd;
  --text: #596052;
  --text-soft: #7c8574;
  --border: #b6cf82;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  min-height: 100%;
}

html {
  cursor: url("/angel-wings.png") 2 2, auto;
}

body {
  min-width: 0;
  overflow-x: hidden;
  color: var(--text);
  font-family: Verdana, Geneva, sans-serif;
  cursor: url("/angel-wings.png") 2 2, auto;
  background:
    radial-gradient(circle at 9% 10%, rgba(219, 252, 148, .38), transparent 24%),
    radial-gradient(circle at 95% 17%, rgba(171, 205, 96, .24), transparent 27%),
    radial-gradient(circle at 76% 88%, rgba(219, 252, 148, .25), transparent 30%),
    radial-gradient(circle at 43% 90%, rgba(254, 212, 212, .16), transparent 19%),
    linear-gradient(#fff, #fffef5 43%, #f7fadf);
}

a {
  cursor: url("/angel-wings.png") 2 2, pointer;
}

.apple-angel {
  position: relative;
  width: 940px;
  height: 690px;
  margin: 18px auto 45px;
  overflow: visible;
}

.apple-angel::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -90px;
  left: 520px;
  width: 210px;
  height: 840px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, .68),
    rgba(255, 253, 222, .3),
    transparent
  );
  transform: rotate(12deg);
  filter: blur(7px);
  pointer-events: none;
}

.apple-angel::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 50;
  opacity: .22;
  background: repeating-linear-gradient(
    0deg,
    transparent 0,
    transparent 4px,
    rgba(255, 255, 255, .2) 5px
  );
  pointer-events: none;
}

.page-decorations {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

.decor {
  position: absolute;
  display: block;
  height: auto;
  user-select: none;
}

.apple {
  filter: drop-shadow(4px 6px 7px rgba(70, 100, 45, .12));
}

.apple-01 {
  top: -38px;
  right: -60px;
  width: 165px;
  opacity: .73;
  transform: rotate(13deg);
}

.apple-02 {
  top: 75px;
  right: 72px;
  width: 82px;
  opacity: .58;
  transform: rotate(13deg);
}

.apple-03 {
  top: -48px;
  left: 451px;
  width: 105px;
  opacity: .38;
  transform: rotate(-18deg);
}

.apple-04 {
  right: -13px;
  bottom: 87px;
  width: 94px;
  opacity: .62;
  transform: rotate(-9deg);
}

.apple-05 {
  left: -74px;
  bottom: -33px;
  width: 143px;
  opacity: .44;
  transform: rotate(9deg);
}

.apple-06 {
  left: 390px;
  bottom: -60px;
  width: 112px;
  opacity: .34;
  transform: rotate(-13deg);
}

.lily {
  filter: drop-shadow(4px 7px 8px rgba(74, 91, 55, .1));
}

.lily-01 {
  top: 250px;
  right: -104px;
  width: 230px;
  opacity: .72;
  transform: rotate(-8deg);
}

.lily-02 {
  right: 63px;
  bottom: -75px;
  width: 185px;
  opacity: .68;
  transform: rotate(12deg);
}

.lily-03 {
  top: 182px;
  left: 520px;
  z-index: -1;
  width: 250px;
  opacity: .18;
  transform: rotate(-10deg);
}

.silver-star {
  z-index: 6;
  filter: drop-shadow(1px 2px 2px rgba(80, 90, 85, .14));
}

.silver-star-01 {
  top: 23px;
  left: 478px;
  width: 23px;
  transform: rotate(12deg);
}

.silver-star-02 {
  top: 144px;
  right: 177px;
  width: 15px;
  transform: rotate(-15deg);
}

.silver-star-03 {
  top: 361px;
  right: 34px;
  width: 24px;
  transform: rotate(18deg);
}

.silver-star-04 {
  bottom: 106px;
  left: 463px;
  width: 17px;
  transform: rotate(-9deg);
}

.silver-star-05 {
  right: 229px;
  bottom: 31px;
  width: 12px;
  transform: rotate(23deg);
}

.content-side {
  position: absolute;
  z-index: 15;
  top: 31px;
  left: 88px;
  width: 390px;
}

.project-header {
  position: relative;
  width: 390px;
  height: 108px;
}

.project-header::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -13px;
  left: -31px;
  width: 77px;
  height: 77px;
  border: 2px solid rgba(171, 205, 96, .48);
  border-radius: 50%;
  box-shadow:
    0 0 0 6px rgba(219, 252, 148, .13),
    0 0 0 11px rgba(209, 240, 245, .08);
}

.project-prefix {
  margin: 0 0 0 5px;
  color: var(--leaf);
  font-family: "Super Corn", Verdana, sans-serif;
  font-size: 12px;
  letter-spacing: .15em;
}

.project-header h1 {
  margin: -1px 0 0;
  width: max-content;
  color: var(--apple);
  font-family: "Alice Yotsuba", Verdana, sans-serif;
  font-size: 55px;
  font-weight: normal;
  line-height: .88;
  letter-spacing: -1px;
  -webkit-text-stroke: 1px var(--apple-deep);
  text-shadow:
    2px 2px 0 var(--white),
    4px 4px 0 rgba(254, 212, 212, .52);
}

.project-mark {
  margin: 8px 0 0 7px;
  color: var(--text-soft);
  font-family: "Super Corn", Verdana, sans-serif;
  font-size: 9px;
  letter-spacing: .19em;
}

.nav-stage {
  position: relative;
  width: 370px;
  margin: -1px 0 17px;
}

.main-nav {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  width: 370px;
  padding: 3px;
  background: rgba(219, 252, 148, .43);
  border: 1px solid var(--apple-deep);
  box-shadow:
    2px 2px 0 rgba(254, 212, 212, .4),
    inset 0 0 5px rgba(255, 255, 255, .85);
}

.main-nav a {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 31px;
  padding: 2px 3px;
  color: var(--leaf-dark);
  text-decoration: none;
  background: linear-gradient(
    #fff,
    #fffef1 23%,
    #e8fbbd 48%,
    #c7e97f 51%,
    #aecd66
  );
  border: 1px solid #9cbd63;
  box-shadow:
    inset 1px 1px 0 rgba(255, 255, 255, .95),
    inset -1px -1px 0 rgba(92, 118, 60, .14);
  transition: .12s;
}

.main-nav a:hover,
.main-nav a:focus {
  transform: translateY(-1px);
  background: linear-gradient(#fff, #fffde8, var(--pink));
}

.nav-number {
  position: absolute;
  top: 2px;
  left: 4px;
  color: rgba(112, 134, 63, .48);
  font-size: 6px;
}

.nav-name {
  margin-top: 2px;
  font-family: "Alice Yotsuba", Verdana, sans-serif;
  font-size: 10px;
  letter-spacing: .06em;
}

.nav-wing {
  position: absolute;
  z-index: 8;
  top: 50%;
  width: 64px;
  height: auto;
  opacity: .38;
  pointer-events: none;
  user-select: none;
  mix-blend-mode: multiply;
  filter: drop-shadow(1px 2px 2px rgba(90, 110, 70, .1));
}

.nav-wing-left {
  left: -53px;
  transform: translateY(-50%) scaleX(-1) rotate(-3deg);
}

.nav-wing-right {
  right: -53px;
  transform: translateY(-50%) rotate(-3deg);
}

.news {
  width: 370px;
  margin-bottom: 11px;
}

.section-heading {
  display: flex;
  align-items: baseline;
  gap: 9px;
  margin-bottom: 4px;
}

.section-heading h2 {
  margin: 0;
  color: var(--apple-dark);
  font-family: "Super Corn", Verdana, sans-serif;
  font-size: 17px;
  font-weight: normal;
  letter-spacing: .05em;
  text-shadow: 2px 2px 0 rgba(254, 212, 212, .58);
}

.section-heading span {
  color: var(--silver);
  font-size: 7px;
  letter-spacing: .15em;
}

.news-window {
  width: 370px;
  height: 116px;
  overflow-y: auto;
  padding: 5px 8px;
  background: rgba(255, 255, 255, .75);
  border: 1px solid var(--border);
  border-radius: 10px 2px 10px 2px;
  box-shadow:
    2px 3px 0 rgba(219, 252, 148, .25),
    inset 0 0 10px rgba(255, 253, 222, .78);
  scrollbar-width: thin;
  scrollbar-color: var(--apple-deep) var(--cream);
}

.news-entry {
  display: grid;
  grid-template-columns: 76px 1fr;
  gap: 7px;
  padding: 5px 2px;
  border-bottom: 1px dotted rgba(112, 134, 63, .4);
}

.news-entry:last-child {
  border-bottom: 0;
}

.news-entry time {
  color: var(--apple-dark);
  font-family: "Alice Yotsuba", Verdana, sans-serif;
  font-size: 8px;
}

.news-entry p {
  margin: 0;
  font-size: 9px;
  line-height: 1.45;
}

.news-window::-webkit-scrollbar {
  width: 6px;
}

.news-window::-webkit-scrollbar-track {
  background: var(--cream);
}

.news-window::-webkit-scrollbar-thumb {
  background: var(--apple-deep);
  border: 1px solid var(--white);
}

.featured {
  width: 370px;
}

.featured-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 6px;
}

.featured-video {
  position: relative;
  display: block;
  height: 75px;
  overflow: hidden;
  padding: 6px 7px;
  color: inherit;
  text-decoration: none;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, .87),
    rgba(255, 253, 222, .82),
    rgba(219, 252, 148, .26)
  );
  border: 1px solid var(--border);
  border-radius: 7px 2px 7px 2px;
  box-shadow: 2px 2px 0 rgba(254, 212, 212, .3);
}

.featured-video:hover {
  transform: translateY(-2px);
}

.featured-video::after {
  content: "";
  position: absolute;
  top: -25px;
  right: -13px;
  width: 48px;
  height: 125px;
  background: rgba(209, 240, 245, .28);
  transform: rotate(17deg);
}

.video-code {
  position: absolute;
  top: 5px;
  left: 6px;
  color: rgba(112, 134, 63, .45);
  font-family: "Alice Yotsuba", Verdana, sans-serif;
  font-size: 8px;
}

.video-word {
  position: absolute;
  z-index: 2;
  left: 7px;
  bottom: 7px;
  color: var(--apple-dark);
  font-family: "Super Corn", Verdana, sans-serif;
  font-size: 19px;
  text-shadow: 2px 2px 0 var(--pink);
}

.video-play {
  position: absolute;
  z-index: 3;
  right: 10px;
  bottom: 9px;
  color: var(--apple-deep);
  font-size: 14px;
}

.project-links {
  width: 352px;
  margin: 16px 0 0 4px;
  padding: 7px 2px 6px;
  border-top: 1px dotted rgba(112, 134, 63, .42);
}

.project-links-row {
  display: flex;
  align-items: center;
  gap: 7px;
  color: var(--silver);
  font-size: 9px;
}

.project-links-row a {
  color: var(--leaf);
  text-decoration: none;
  border-bottom: 1px dotted rgba(111, 143, 78, .5);
}

.project-links-row a:hover {
  color: #a76f76;
}

.site-footer {
  display: flex;
  gap: 14px;
  width: 350px;
  margin: 13px 0 0 4px;
  color: var(--text-soft);
  font-size: 7px;
  letter-spacing: .08em;
}

.character-side {
  position: absolute;
  z-index: 8;
  top: 0;
  right: 0;
  width: 525px;
  height: 690px;
  overflow: visible;
}

.character-side::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -53px;
  left: 55px;
  width: 385px;
  height: 780px;
  background: linear-gradient(
    112deg,
    rgba(255, 255, 255, .23),
    rgba(255, 253, 222, .27),
    rgba(219, 252, 148, .17)
  );
  clip-path: polygon(24% 0, 100% 0, 84% 100%, 0 100%);
}

.character-side::after {
  content: "";
  position: absolute;
  z-index: 1;
  right: -58px;
  bottom: -61px;
  width: 480px;
  height: 225px;
  background: radial-gradient(
    ellipse at center bottom,
    rgba(171, 205, 96, .3),
    rgba(219, 252, 148, .17) 48%,
    transparent 72%
  );
}

.classified-character {
  position: absolute;
  z-index: 5;
  left: -22px;
  bottom: 15px;
  width: 470px;
  height: 635px;
}

.classified-silhouette {
  position: absolute;
  left: 108px;
  bottom: 39px;
  width: 270px;
  height: 525px;
  opacity: .68;
  background: linear-gradient(
    rgba(255, 255, 255, .7),
    rgba(219, 252, 148, .09)
  );
  clip-path: polygon(
    42% 0,
    58% 0,
    67% 8%,
    66% 19%,
    73% 28%,
    71% 43%,
    83% 61%,
    75% 67%,
    69% 58%,
    65% 100%,
    54% 100%,
    51% 67%,
    47% 67%,
    45% 100%,
    34% 100%,
    29% 58%,
    23% 68%,
    15% 62%,
    27% 43%,
    25% 28%,
    34% 18%,
    33% 8%
  );
  filter: blur(8px);
}

.classified-label {
  position: absolute;
  z-index: 7;
  left: 150px;
  bottom: 51px;
  text-align: center;
}

.classified-label span {
  display: block;
  margin-bottom: 3px;
  color: var(--text-soft);
  font-family: "Alice Yotsuba", Verdana, sans-serif;
  font-size: 9px;
  letter-spacing: .18em;
}

.classified-label strong {
  display: block;
  color: var(--apple-dark);
  font-family: "Super Corn", Verdana, sans-serif;
  font-size: 11px;
  font-weight: normal;
  letter-spacing: .14em;
}

.character-art {
  position: absolute;
  z-index: 10;
  left: -76px;
  bottom: -5px;
  width: 540px;
  height: 680px;
  object-fit: contain;
  object-position: center bottom;
  filter: drop-shadow(7px 10px 7px rgba(64, 83, 48, .16));
}

.foreground-details {
  position: absolute;
  inset: 0;
  z-index: 22;
  pointer-events: none;
}

.tiny-cross {
  position: absolute;
  color: rgba(143, 170, 151, .65);
  font-family: "Alice Yotsuba", sans-serif;
}

.tiny-cross-01 {
  top: 85px;
  left: 502px;
  font-size: 13px;
  transform: rotate(13deg);
}

.tiny-cross-02 {
  right: 154px;
  bottom: 128px;
  color: rgba(177, 202, 212, .72);
  font-size: 17px;
  transform: rotate(-11deg);
}

.tiny-dot {
  position: absolute;
  width: 5px;
  height: 5px;
  border: 1px solid var(--silver);
  border-radius: 50%;
}

.tiny-dot-01 {
  top: 119px;
  right: 252px;
}

.tiny-dot-02 {
  bottom: 74px;
  left: 493px;
}

::selection {
  color: var(--leaf-dark);
  background: var(--apple);
}

@media (max-width: 960px) {
  .apple-angel {
    width: 100%;
    max-width: 560px;
    min-height: 940px;
    height: auto;
    margin: 0 auto;
    padding: 20px 18px 35px;
    overflow: hidden;
  }

  .apple-angel::before {
    top: -110px;
    left: 50%;
    width: 150px;
    height: 1100px;
    transform: translateX(-50%) rotate(10deg);
  }

  .content-side {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
  }

  .project-header {
    width: 100%;
    height: 108px;
    text-align: center;
  }

  .project-header::before {
    top: -9px;
    left: 50%;
    width: 65px;
    height: 65px;
    transform: translateX(-160px);
  }

  .project-prefix {
    margin: 0 0 2px;
    font-size: 10px;
  }

  .project-header h1 {
    margin: 0 auto;
    max-width: 100%;
    font-size: clamp(40px, 11vw, 55px);
  }

  .project-mark {
    margin: 8px 0 0;
    font-size: 8px;
  }

  .nav-stage {
    width: min(370px, calc(100% - 86px));
    margin: 0 auto 17px;
  }

  .main-nav {
    width: 100%;
  }

  .main-nav a {
    height: 34px;
  }

  .nav-number {
    font-size: 5px;
  }

  .nav-name {
    font-size: 9px;
  }

  .nav-wing {
    width: 49px;
    opacity: .31;
  }

  .nav-wing-left {
    left: -42px;
  }

  .nav-wing-right {
    right: -42px;
  }

  .news {
    width: 100%;
  }

  .section-heading {
    justify-content: center;
  }

  .news-window {
    width: 100%;
    height: 128px;
  }

  .news-entry {
    grid-template-columns: 73px minmax(0, 1fr);
    gap: 6px;
  }

  .news-entry time {
    font-size: 7px;
  }

  .news-entry p {
    font-size: 8px;
  }

  .featured {
    width: 100%;
  }

  .featured-grid {
    width: 100%;
  }

  .featured-video {
    height: 72px;
  }

  .video-word {
    font-size: 17px;
  }

  .project-links {
    width: 100%;
    margin: 16px auto 0;
    text-align: center;
  }

  .project-links-row {
    justify-content: center;
    font-size: 8px;
  }

  .site-footer {
    width: 100%;
    justify-content: center;
    margin: 12px auto 0;
    text-align: center;
    font-size: 6px;
  }

  .character-side {
    position: relative;
    top: auto;
    right: auto;
    width: 100%;
    max-width: 420px;
    height: 380px;
    margin: 5px auto 0;
  }

  .character-side::before {
    top: -25px;
    left: 50%;
    width: 320px;
    height: 420px;
    transform: translateX(-50%);
    clip-path: polygon(18% 0, 88% 0, 78% 100%, 6% 100%);
  }

  .character-side::after {
    right: auto;
    left: 50%;
    bottom: -20px;
    width: 360px;
    height: 170px;
    transform: translateX(-50%);
  }

  .classified-character {
    left: 50%;
    bottom: 0;
    width: 100%;
    height: 370px;
    transform: translateX(-50%);
  }

  .classified-silhouette {
    left: 50%;
    bottom: 28px;
    width: 185px;
    height: 330px;
    transform: translateX(-50%);
    filter: blur(7px);
  }

  .classified-label {
    left: 50%;
    bottom: 40px;
    width: 200px;
    transform: translateX(-50%);
  }

  .character-art {
    left: 50%;
    bottom: 0;
    width: 100%;
    max-width: 400px;
    height: 380px;
    transform: translateX(-50%);
  }

  .apple-01 {
    top: -22px;
    right: -36px;
    width: 112px;
    opacity: .55;
  }

  .apple-02 {
    top: 128px;
    right: -7px;
    width: 55px;
    opacity: .35;
  }

  .apple-03 {
    top: 23px;
    left: -5px;
    width: 69px;
    opacity: .25;
  }

  .apple-04 {
    right: -20px;
    bottom: 105px;
    width: 72px;
    opacity: .48;
  }

  .apple-05 {
    left: -32px;
    bottom: 12px;
    width: 90px;
    opacity: .35;
  }

  .apple-06,
  .lily-03,
  .silver-star-05 {
    display: none;
  }

  .lily-01 {
    top: 620px;
    right: -78px;
    width: 170px;
    opacity: .42;
  }

  .lily-02 {
    right: -38px;
    bottom: -25px;
    width: 145px;
    opacity: .46;
  }

  .silver-star-01 {
    top: 35px;
    left: auto;
    right: 13%;
    width: 16px;
  }

  .silver-star-02 {
    top: 205px;
    right: 7%;
    width: 11px;
  }

  .silver-star-03 {
    top: auto;
    right: 8%;
    bottom: 285px;
    width: 17px;
  }

  .silver-star-04 {
    left: 10%;
    bottom: 105px;
    width: 13px;
  }

  .tiny-cross-01 {
    top: 95px;
    left: auto;
    right: 8%;
    font-size: 10px;
  }

  .tiny-cross-02 {
    right: 12%;
    bottom: 105px;
    font-size: 13px;
  }

  .tiny-dot {
    display: none;
  }
}

@media (max-width: 480px) {
  .apple-angel {
    min-height: 900px;
    padding: 14px 12px 28px;
  }

  .project-header {
    height: 96px;
  }

  .project-header::before {
    width: 54px;
    height: 54px;
    transform: translateX(-138px);
  }

  .project-prefix {
    font-size: 9px;
  }

  .project-header h1 {
    font-size: clamp(35px, 12vw, 48px);
  }

  .project-mark {
    font-size: 7px;
    letter-spacing: .14em;
  }

  .nav-stage {
    width: calc(100% - 68px);
    margin-bottom: 15px;
  }

  .nav-wing {
    width: 41px;
  }

  .nav-wing-left {
    left: -35px;
  }

  .nav-wing-right {
    right: -35px;
  }

  .main-nav {
    padding: 2px;
  }

  .main-nav a {
    height: 32px;
  }

  .nav-number {
    left: 3px;
    font-size: 5px;
  }

  .nav-name {
    font-size: 8px;
  }

  .section-heading h2 {
    font-size: 15px;
  }

  .section-heading span {
    font-size: 6px;
  }

  .news-window {
    height: 132px;
    padding: 5px 6px;
  }

  .news-entry {
    grid-template-columns: 65px minmax(0, 1fr);
    gap: 5px;
    padding: 5px 1px;
  }

  .news-entry time,
  .news-entry p {
    font-size: 7px;
  }

  .news-entry p {
    font-size: 8px;
  }

  .featured-grid {
    gap: 5px;
  }

  .featured-video {
    height: 67px;
    padding: 5px;
  }

  .video-code {
    font-size: 7px;
  }

  .video-word {
    left: 6px;
    bottom: 6px;
    font-size: 15px;
  }

  .video-play {
    right: 7px;
    bottom: 7px;
    font-size: 11px;
  }

  .project-links {
    margin-top: 14px;
    padding-top: 6px;
  }

  .project-links-row {
    gap: 5px;
    font-size: 7px;
  }

  .site-footer {
    gap: 10px;
    margin-top: 10px;
    font-size: 6px;
  }

  .character-side {
    height: 345px;
    margin-top: 0;
  }

  .character-side::before {
    width: 275px;
    height: 370px;
  }

  .character-side::after {
    width: 310px;
  }

  .classified-character {
    height: 340px;
  }

  .classified-silhouette {
    width: 160px;
    height: 300px;
    bottom: 27px;
  }

  .classified-label {
    bottom: 37px;
  }

  .classified-label span {
    font-size: 8px;
  }

  .classified-label strong {
    font-size: 10px;
  }

  .character-art {
    max-width: 350px;
    height: 345px;
  }

  .apple-01 {
    top: -18px;
    right: -30px;
    width: 92px;
  }

  .apple-02 {
    top: 120px;
    width: 45px;
  }

  .apple-03 {
    top: 28px;
    left: -8px;
    width: 54px;
  }

  .apple-04 {
    width: 62px;
  }

  .apple-05 {
    width: 76px;
  }

  .lily-01 {
    top: 580px;
    right: -63px;
    width: 140px;
  }

  .lily-02 {
    width: 120px;
  }
}

@media (max-width: 360px) {
  .apple-angel {
    padding-left: 9px;
    padding-right: 9px;
  }

  .project-header h1 {
    font-size: 39px;
  }

  .project-header::before {
    transform: translateX(-122px);
  }

  .nav-stage {
    width: calc(100% - 58px);
  }

  .nav-wing {
    width: 35px;
  }

  .nav-wing-left {
    left: -30px;
  }

  .nav-wing-right {
    right: -30px;
  }

  .nav-name {
    font-size: 7px;
  }

  .news-entry {
    grid-template-columns: 60px minmax(0, 1fr);
  }

  .video-word {
    font-size: 13px;
  }

  .project-links-row {
    font-size: 6px;
  }
}