.home-page{background:#090f16;--text:#edf4f6;--muted:#8da3ab;--surface:#111d25;--soft:#172630;--line:#24363e;font-family:Inter,"Segoe UI",sans-serif;color:#edf4f6}.home-page .topbar{background:#0c141bf2;border-bottom:1px solid #23323b;padding:16px max(28px,calc((100vw - 1320px)/2));position:relative;gap:28px!important}.home-page .topbar .brand{color:#fff;font-size:24px;letter-spacing:-1px}.home-page .brand span{color:#8aadae;font-size:8px}.home-page .unified-navigation nav{justify-content:center}.home-page .unified-navigation a{color:#b0bdc7!important;font-size:12px!important;padding:8px 13px!important}.home-page .unified-navigation a.current{color:#90e2ca!important;background:#18332e!important}.home-page #themeToggle{border:1px solid #2c3c46;border-radius:50px;background:transparent;color:#afc6cf;font-size:11px;padding:8px 13px}.home-page .tool-menu summary{color:#afc0cc}.home-page .tool-menu>div{background:#14222b}.home-page .workspace>#main{padding:28px 28px 0;max-width:1376px}.home-page .workspace>footer{display:none}.landing a{text-decoration:none;color:inherit}.landing-hero{height:510px;position:relative;border-radius:24px;overflow:hidden;isolation:isolate;border:1px solid #375460}.landing-art,.landing-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}.landing-art{object-position:70% 54%}.landing-shade{z-index:-1;background:linear-gradient(90deg,#081720f2 0%,#0a1e2ac7 29%,#10253629 70%),linear-gradient(0deg,#0b1823dd,transparent 55%)}.landing-copy{padding:72px 58px;max-width:720px}.landing-kicker{font-size:10px;letter-spacing:2px;font-weight:650;color:#b1d7d2;display:flex;gap:10px;align-items:center}.landing-kicker i{width:6px;height:6px;border-radius:50%;background:#8be4c5;box-shadow:0 0 14px #8be4c5}.landing-copy h1{font-size:clamp(32px,4.1vw,57px);line-height:1.17;font-weight:750;letter-spacing:-2.3px;margin:27px 0 18px;color:#fff}.landing-copy h1 em{font-style:normal;color:#b3efda}.landing-copy p{font-size:14px;color:#c5d5da;margin:0 0 30px}.landing-actions{display:flex;gap:12px;align-items:center}.landing-primary,.landing-secondary{display:inline-flex;align-items:center;gap:20px;padding:13px 21px;border-radius:9px;font-size:12px;font-weight:650}.landing-primary{background:#b9f2d9;color:#102a24!important;box-shadow:0 8px 28px #0002}.landing-primary span{font-size:20px}.landing-secondary{background:#11263299;border:1px solid #69808a70;color:#fff!important;gap:9px;backdrop-filter:blur(12px)}.landing-secondary svg{width:17px;height:17px}.landing h2{letter-spacing:-.6px}.landing-tools-title h2{font-size:23px;margin:8px 0;color:#edf4f6;font-weight:600}.landing-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:19px}.landing-feature{border:1px solid #2b3d48;border-radius:17px;overflow:hidden;background:#111d26;transition:transform .2s,border-color .2s}.landing-feature:hover{transform:translateY(-5px);border-color:#81b9ab}.feature-visual{height:195px;position:relative;overflow:hidden;background:#0d1824}.feature-sanctum .feature-visual{background:radial-gradient(ellipse at 50% 40%,#294956,#14212d 75%)}.feature-sanctum .feature-visual>img{height:100%;width:100%;object-fit:contain;padding:6px;opacity:.85;transform:rotate(-8deg) scale(1.1);filter:drop-shadow(0 0 15px #89d8ff33)}.feature-team .feature-visual{background:radial-gradient(ellipse at 50% 40%,#47416b,#1a1e32 80%)}.party-orbit{position:absolute;inset:7px 12px 16px;display:flex;align-items:center;justify-content:center}.party-orbit img{width:31%;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 10px 12px #0005)}.party-orbit img:nth-child(2){width:37%;transform:translateY(-12px)}.feature-shiny .feature-visual{background:radial-gradient(ellipse at 60% 40%,#4b395b,#241d35 75%)}.shiny-halo{position:absolute;width:145px;height:145px;border:1px solid #edc4f750;border-radius:50%;left:50%;top:40%;transform:translate(-50%,-50%);box-shadow:0 0 50px #f2c7ff12,inset 0 0 25px #f2c7ff12}.feature-visual .shiny-pet{width:160px;height:160px;object-fit:contain;position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);filter:drop-shadow(0 8px 18px #d798f34f)}.feature-spark{position:absolute;right:22%;top:22px;color:#f7daff;font-size:40px}.feature-label{padding:19px 18px;display:flex;align-items:center;gap:13px}.feature-label>svg{width:25px;height:25px;color:#a9cfc5;flex:none}.feature-label small{font-size:8px;letter-spacing:1.5px;color:#7e9da9}.feature-label h2{font-size:17px;font-weight:600;color:#edf4f6;margin:3px 0 0}.feature-label>span{margin-left:auto;color:#b1cbd1;font-size:21px}.landing-tools{display:grid;grid-template-columns:240px 1fr;gap:30px;align-items:center;margin:38px 0 28px;padding:27px 0;border-block:1px solid #24343e}.landing-tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.landing-tool-grid a{background:#111d26;border:1px solid #293b45;border-radius:12px;padding:19px 15px;display:flex;align-items:center;gap:10px;font-size:11px;transition:background .2s}.landing-tool-grid a:hover{background:#1c3337}.landing-tool-grid svg{width:23px;height:23px;color:#a1c5bf;flex:none}.landing-tool-grid b{margin-left:auto;font-size:17px;font-weight:400;color:#79929c}.landing-bottom{display:flex;justify-content:space-between;padding:0 0 28px;color:#69858f;font-size:9px;letter-spacing:1px}.landing-bottom i{font-style:normal;margin:0 10px;color:#8bbcac}.landing-bottom a{font-size:11px;letter-spacing:0;color:#a4c5c9}.landing a:focus-visible,.landing button:focus-visible,.landing input:focus-visible{outline:2px solid #b9efda;outline-offset:4px}@media(min-width:1500px){.landing-hero{height:550px}.landing-copy{padding-top:87px}.feature-visual{height:215px}}@media(max-width:1000px){.landing-tools{grid-template-columns:1fr;gap:10px}.landing-copy{padding:65px 32px}.landing-copy h1{font-size:44px}.landing-hero{height:470px}.home-page .topbar{gap:12px!important}.home-page .unified-navigation a{padding:7px 9px!important}.feature-label h2{font-size:14px}.feature-label{padding:16px 12px;gap:9px}}@media(max-width:700px){.home-page .workspace>#main{padding:14px 16px 0}.home-page .topbar{padding:13px 16px}.home-page .unified-navigation{order:3;flex-basis:100%}.home-page .unified-navigation nav{justify-content:flex-start;flex-wrap:nowrap!important;overflow-x:auto}.home-page #themeToggle{margin-left:auto}.landing-hero{height:500px;border-radius:17px}.landing-art{object-position:66% center}.landing-shade{background:linear-gradient(90deg,#081720de,#10253644),linear-gradient(0deg,#081720e8,transparent)}.landing-copy{padding:48px 25px}.landing-copy h1{font-size:38px;letter-spacing:-1.8px}.landing-copy p{font-size:12px;max-width:230px;line-height:1.7}.landing-tools-title h2{font-size:22px}.landing-features{grid-template-columns:1fr;gap:15px}.feature-visual{height:210px}.party-orbit{left:45px;right:45px}.feature-label h2{font-size:18px}.feature-label{padding:18px}.landing-tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.landing-tools{margin-top:26px;padding-top:22px}.landing-tool-grid a{font-size:11px;padding:16px 12px}.landing-actions{gap:8px}.landing-primary,.landing-secondary{font-size:11px;padding:12px 14px;gap:10px}.landing-bottom{font-size:8px;gap:15px}.landing-bottom a{font-size:10px}}
.home-page #themeToggle{display:none}

@media (max-width: 700px) {
  .home-page .unified-navigation nav {
    flex-wrap: wrap !important;
    overflow: visible;
  }
  .home-page .landing-hero { height: 410px; }
}
.topbar .brand:has(.jun-brand-icon) {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  white-space: nowrap;
}
.jun-brand-icon, .jun-brand-cross, .jun-brand-wordmark {
  flex: none;
  object-fit: contain;
}
.jun-brand-wordmark { background: none; }
@media (prefers-reduced-motion: no-preference) {
  .jun-brand-icon, .jun-brand-wordmark {
    transition: transform .2s ease, filter .2s ease;
  }
  .brand:hover .jun-brand-icon, .brand:focus-visible .jun-brand-icon {
    transform: scale(1.07);
    filter: drop-shadow(0 0 7px #45dfff88);
  }
  .brand:hover .jun-brand-wordmark, .brand:focus-visible .jun-brand-wordmark {
    filter: drop-shadow(0 0 5px #87c6ff99);
  }
}
@media (max-width: 600px) {
  .topbar .brand:has(.jun-brand-icon) { gap: 6px; }
  .jun-brand-icon { width: 42px; height: 42px; }
  .jun-brand-cross { width: 12px; height: 12px; }
  .jun-brand-wordmark { width: 78px; height: 33px; }
}
.home-page .landing-shade {
  background: linear-gradient(180deg, #0a1829de, #101c2f35 58%, #0b1727b5);
}
.home-page .landing-copy { max-width: none; text-align: center; padding: 58px 24px; }
.home-page .landing-kicker, .home-page .landing-actions { justify-content: center; }
.home-page .landing-copy h1 {
  margin: 15px 0 25px;
  color: #fff;
  text-shadow: 0 3px 22px #172f65, 0 0 48px #78affc60;
}
.home-page .landing-art { object-position: 50% 70%; }
.jun-section { margin: 44px 0; }
.jun-section > h2 {
  text-align: center;
  margin: 0 0 20px;
  font-size: clamp(22px, 3vw, 30px);
}
.jun-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 19px;
}
.jun-panel {
  min-width: 0;
  border: 1px solid #2b3d48;
  border-radius: 17px;
  background: #111d26;
  padding: 19px;
}
.jun-panel h3 { font-size: 14px; margin: 0 0 14px; color: #b3efda; }
.jun-video {
  display: grid;
  align-content: center;
  justify-items: center;
  min-height: 200px;
  aspect-ratio: 16 / 9;
  border: 1px solid #2b4250;
  border-radius: 12px;
  background: linear-gradient(#112132c7, #101827f2), url('/home/aniimo-world.webp') center 78% / cover;
  color: #c8dae4;
}
.jun-video span { font-size: 32px; line-height: 1; color: #b3efda; }
.jun-video p { margin: 12px 0 0; font-size: 13px; }
.jun-links { display: grid; gap: 8px; }
.jun-links a, .jun-panel details {
  background: #172630;
  border: 1px solid #293e49;
  border-radius: 9px;
}
.jun-links a {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 13px;
  font-weight: 600;
}
.jun-links a:hover, .jun-panel details[open] { border-color: #70bbaa; }
.jun-links svg { width: 20px; height: 20px; flex: none; color: #b3efda; }
.jun-links b { margin-left: auto; color: #9cb8c5; }
.jun-panel details + details { margin-top: 8px; }
.jun-panel summary { cursor: pointer; font-weight: 600; padding: 12px; }
.jun-panel details p { padding: 0 12px 12px; margin: 0; color: #bed0d8; }
.jun-panel details a { color: #b3efda; text-decoration: underline; }
@media (max-width: 700px) {
  .home-page .landing-copy { padding: 42px 16px; }
  .home-page .landing-copy h1 { font-size: clamp(29px, 8vw, 38px); }
  .jun-section { margin: 30px 0; }
  .jun-columns { grid-template-columns: 1fr; gap: 12px; }
  .jun-panel { padding: 14px; }
}
.home-page .landing-hero {
  height: clamp(460px, 66vh, 720px);
  border: 0;
  border-radius: 0 0 24px 24px;
  margin-bottom: 26px;
}
.landing-hero::after {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg, #5de2ff, #838fff, #f996dc, #5de2ff);
  background-size: 200% 100%;
  animation: jun-border 10s linear infinite;
}
.home-page .landing-shade {
  background: linear-gradient(180deg, #14243eea, #17263b65 45%, #090f16a6);
}
.home-page .landing-copy { padding-top: clamp(45px, 8vh, 84px); }
.home-page .landing-kicker { color: #ffe380; font-size: clamp(11px, 1.4vw, 16px); }
.home-page .landing-kicker i { background: #ffe380; box-shadow: 0 0 14px #ffe380; }
.home-page .landing-copy h1 {
  font-family: "Arial Rounded MT Bold", "Trebuchet MS", "Segoe UI", sans-serif;
  font-size: clamp(36px, 6vw, 78px);
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: -.045em;
  margin: 12px 0;
  text-shadow: 0 0 12px #9adfff, 0 0 32px #318bff, 0 5px 50px #246cff;
}
.home-page .landing-copy h1 em { color: #bbf7ff; }
.home-page .landing-actions { position: absolute; inset: auto 12px 24px; }
.jun-section > h2 { text-shadow: 0 0 20px #4cb9ff73; }
.jun-links a { transition: border-color .18s, background .18s; }
.jun-links a:hover { background: #203749; }
@keyframes jun-border { to { background-position: -200% 0; } }
@media (max-width: 700px) {
  .home-page .landing-hero { height: 390px; }
  .home-page .landing-copy { padding: 42px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .landing-hero::after, }
.home-page .landing-hero {
  margin-inline: 0;
  border-radius: 0;
  height: clamp(480px, 72vh, 760px);
}
.home-page .landing-copy { padding-top: clamp(46px, 8vh, 92px); }
.home-page .landing-kicker {
  font: 800 clamp(16px, 2vw, 28px)/1.15 "Baloo 2", sans-serif;
  letter-spacing: .01em;
  color: #ece8dd;
  text-shadow: 0 2px 5px #08101b99;
}
.home-page .landing-copy h1 {
  position: relative;
  display: inline-block;
  isolation: isolate;
  margin: 9px 0 0;
  font: 800 clamp(32px, 4.6vw, 76px)/1.05 "Baloo 2", sans-serif;
  text-transform: uppercase;
  letter-spacing: .025em;
  color: #f6f3eb;
  text-shadow: 0 2px 8px #08101ba6;
}
.home-page .landing-copy h1 em {
  color: inherit;
  text-shadow: inherit;
}
.home-page .landing-copy h1::before,
.home-page .landing-copy h1::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 6px;
  border-radius: 100%;
  background: #f9eaff;
  box-shadow: -9px 10px 0 -1px #c0ebff, 0 0 12px #74c8ff;
  transform: rotate(50deg);
  animation: jun-spark 3s ease-in-out infinite alternate;
}
.home-page .landing-copy h1::before { top: 0; left: -13px; }
.home-page .landing-copy h1::after {
  bottom: 0;
  right: -16px;
  rotate: 180deg;
  animation-delay: -1.5s;
}
.jun-section > h2 { font-family: "Baloo 2", sans-serif; font-weight: 800; }
@keyframes jun-spark { to { opacity: .45; translate: 0 -3px; } }
@media (max-width: 700px) {
  .home-page .landing-hero { height: 420px; }
  .home-page .landing-copy { padding-inline: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-page .landing-copy h1::before, .home-page .landing-copy h1::after { animation: none; }
}

.home-page .workspace>#main { max-width: none; padding: 0; }
.landing {
  display: flow-root;
  background: radial-gradient(ellipse at 50% 45%, #14263b 0, #0c1521 45%, #080e16 85%);
}
.home-page .landing-hero {
  background: radial-gradient(ellipse at 68% 45%, #233854, #0c1422 66%, #080e16);
}

.landing-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: -2;
  pointer-events: none;
}

.home-page .landing-shade {
  background: linear-gradient(90deg, #08101b66, #08101b10 68%, transparent),
    linear-gradient(0deg, #0a1421e0, #0a142159 9%, transparent 27%);
}

.landing-bottom, .landing-bottom a { color: #9aafc5; }
.home-pond {
  position: relative;
  display: flow-root;
  padding-bottom: 10px;
  background:
    linear-gradient(180deg, #0a1421 0%, #101c2966 19%, #0a172540 56%, #080e16 100%),
    url("/home/idyll-lotus-pond.webp") center top / cover no-repeat,
    #0a1421;
}
.home-pond-seam {
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, #40546880, #92d7d9, #a7a4e8, #40546880);
  box-shadow: 0 0 17px #70bfdb60;
  pointer-events: none;
}
.home-pond-seam span {
  position: absolute;
  inset: 0 auto auto 50%;
  width: 9px;
  height: 9px;
  border: 1px solid #caedf3;
  border-radius: 2px;
  background: #213d51;
  box-shadow: 0 0 14px #7ddfe6aa;
  transform: translate(-50%, -50%) rotate(45deg);
}
.home-pond > :is(.home-tool-grid, .home-community) {
  width: min(calc(100% - 48px), 1320px);
  margin-inline: auto;
}

.home-tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 24px 18px;
  max-width: 1150px;
  margin-block: 36px 48px;
  padding: 8px 0;
}

.home-tool-card {
  position: relative;
  display: grid;
  grid-template-rows: 80px 1fr;
  min-width: 0;
  min-height: 188px;
  color: #bdcce0;
  text-align: center;
  text-decoration: none;
}

.home-tool-character {
  position: absolute;
  z-index: 1;
  inset: 0 0 auto;
  margin-inline: auto;
  width: min(100%, 205px);
  height: 124px;
  object-fit: contain;
  pointer-events: none;
  filter: drop-shadow(0 0 13px color-mix(in srgb, var(--card-accent) 27%, transparent));
}
.home-tool-model {
  position: absolute;
  z-index: 2;
  inset: 0 0 auto;
  width: min(100%, 205px);
  height: 124px;
  margin-inline: auto;
  visibility: hidden;
  pointer-events: none;
}
.home-tool-model canvas { display: block; width: 100%; height: 100%; }
.home-tool-model-ready .home-tool-model { visibility: visible; }
.home-tool-model-ready .home-tool-character { visibility: hidden; }
.home-tool-preview .catalog-motion-canvas {
  position: absolute;
  z-index: 1;
  inset: 0 0 auto;
  margin-inline: auto;
  width: min(100%, 205px);
  height: 124px;
  object-fit: contain;
  pointer-events: none;
}
.home-tool-preview img[hidden],
.home-tool-preview canvas[hidden],
.home-tool-model-ready .home-tool-preview { display: none; }
.home-tool-label {
  display: grid;
  grid-row: 2;
  align-content: start;
  gap: 4px;
  min-height: 108px;
  box-sizing: border-box;
  padding: 44px 9px 12px;
  border: 1px solid color-mix(in srgb, var(--card-accent) 36%, #25354b);
  border-radius: 17px;
  background: radial-gradient(ellipse at top, color-mix(in srgb, var(--card-accent) 14%, #111b2b), #111b2b 85%);
}

.home-tool-label strong { color: var(--card-accent); font: 800 16px/1.2 "Baloo 2", system-ui, sans-serif; }
.home-tool-label > span { font-size: 12px; line-height: 1.4; }
.home-tool-card:is(:hover, :focus-visible) .home-tool-label { border-color: var(--card-accent); }
.home-community {
  max-width: none;
  margin: 34px auto 20px;
  padding: 0;
  overflow: hidden;
  border: 1px solid #354455;
  border-radius: 20px;
  background: radial-gradient(ellipse at 0 0, #213d44, transparent 60%), #151e2a;
  color: #eaf4f7;
}
.home-community-main {
  display: grid;
  grid-template-columns: 1.45fr minmax(0, 1fr);
  gap: clamp(18px, 5vw, 64px);
  padding: clamp(16px, 3.5vw, 34px);
}
.home-aniimo-stage {
  position: relative;
  container-type: inline-size;
  min-height: clamp(124px, 17vw, 186px);
  overflow: hidden;
  border-bottom: 1px solid #557b824f;
  background:
    radial-gradient(ellipse at 50% 120%, #4baf8b66, transparent 66%),
    radial-gradient(ellipse at 72% 0%, #6c5c993f, transparent 42%),
    radial-gradient(circle, #b2e6ce31 1px, transparent 1.5px) 0 0 / 18px 18px,
    #112832;
}
.home-aniimo-stage::before {
  content: "";
  position: absolute;
  inset: auto 10% -55% 10%;
  height: 83%;
  border: 1px solid #93f4c54a;
  border-radius: 50%;
  box-shadow: 0 0 24px #79eac53b, inset 0 0 26px #79eac526;
}
.home-aniimo-stage img {
  position: absolute;
  bottom: var(--perch, 2px);
  width: clamp(48px, 13cqw, 116px);
  aspect-ratio: 1;
  object-fit: contain;
  transform: translateX(-50%);
  filter: drop-shadow(0 8px 5px #08161d9c);
}
.home-stage-leafy { left: 20%; --enter-x: -33cqw; --jump-x: -9cqw; --enter-y: 12px; --tilt: -10deg; }
.home-stage-pawney { left: 80%; --enter-x: 33cqw; --jump-x: 9cqw; --enter-y: 12px; --tilt: 10deg; --delay: .26s; }
.home-stage-luminelle { left: 49%; --perch: 26%; --enter-x: 12cqw; --jump-x: 4cqw; --enter-y: -165px; --tilt: 12deg; --delay: .52s; }
.home-stage-glacy { left: 9%; --perch: 17%; --enter-x: -22cqw; --jump-x: -6cqw; --enter-y: 50px; --tilt: -12deg; --delay: .75s; }
.home-stage-pouchwisp { left: 35%; --enter-x: -16cqw; --jump-x: -4cqw; --enter-y: 115px; --tilt: -14deg; --delay: .95s; }
.home-stage-sparkelf { left: 66%; --enter-x: 27cqw; --jump-x: 8cqw; --enter-y: 105px; --tilt: 16deg; --delay: 1.15s; }
.home-stage-somniwing { left: 91%; --perch: 19%; --enter-x: 15cqw; --jump-x: 5cqw; --enter-y: -140px; --tilt: 13deg; --delay: 1.4s; }
.home-stage-sparkles {
  position: absolute;
  inset: 11px 19% auto;
  display: flex;
  justify-content: space-between;
  color: #fbe4a1;
  font: 500 16px/1 system-ui, sans-serif;
  text-shadow: 0 0 12px #ffdc88a6;
  pointer-events: none;
}
.home-stage-sparkles i { color: #baf4e0; font-style: normal; }
@media (prefers-reduced-motion: no-preference) {
  .home-aniimo-stage-active img { animation: home-stage-arrival 3.2s cubic-bezier(.22,.72,.31,1) var(--delay, 0s) both; }
  .home-aniimo-stage-active .home-stage-sparkles { animation: home-stage-twinkle 1.15s ease-in-out 4; }
  @keyframes home-stage-arrival {
    0% { opacity: 0; translate: var(--enter-x) var(--enter-y); rotate: var(--tilt); }
    28% { opacity: 1; translate: var(--jump-x) -24px; rotate: var(--tilt); }
    45% { translate: 0 0; rotate: 0deg; }
    55% { translate: 0 -8px; rotate: -5deg; }
    61% { translate: 0 0; rotate: 0deg; }
    68% { translate: 0 -15px; rotate: 0deg; }
    81%, 100% { translate: 0 0; rotate: 0deg; }
    90% { translate: 0 -5px; }
  }
  @keyframes home-stage-twinkle {
    50% { opacity: .35; transform: translateY(-3px) scale(1.035); }
  }
}
.home-community-about { display: flex; align-items: flex-start; gap: 14px; }
.home-community-avatar {
  position: relative;
  flex: none;
  width: 56px;
  height: 56px;
  overflow: hidden;
  border-radius: 14px;
  background: #132332;
  box-shadow: 0 5px 16px #07151b66;
}
.home-community-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.home-community-about h2 { margin: 0; font: 800 27px/1.12 "Baloo 2", system-ui, sans-serif; }
.home-community-about p { max-width: 390px; margin: 6px 0 0; color: #bcced8; font: 400 14px/1.6 system-ui, sans-serif; }
.home-community-social h3 { margin: 0 0 9px; color: #a8eadc; font: 800 18px/1.2 "Baloo 2", system-ui, sans-serif; }
.home-community-social ul { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.home-community-social a {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 6px 9px;
  border: 1px solid #3b4e603d;
  border-radius: 9px;
  background: #0e1b299c;
  font: 650 13px/1.3 system-ui, sans-serif;
}
.home-community-social a:hover { background: #203544; border-color: #527382; }
.home-community-social small { margin-inline-start: auto; color: #a6bdcb; font: 500 11px/1.3 system-ui, sans-serif; }
.home-social-icon {
  display: grid;
  place-items: center;
  flex: none;
  width: 24px;
  height: 24px;
  border-radius: 7px;
  font-weight: 800;
}
.home-social-icon svg { width: 18px; height: 18px; }
.home-social-discord { color: #d6d8ff; background: #333967; }
.home-social-zalo { color: #bfe5ff; background: #1b4169; }
.home-credit {
  padding: 12px;
  border-top: 1px solid #37515f80;
  background: #0e172183;
  color: #acc3cf;
  font: 500 12px/1.5 system-ui, sans-serif;
  text-align: center;
}
@media (max-width: 650px) {
  .home-community-main { grid-template-columns: minmax(0, 1fr); }
}
.home-team-card .home-tool-label { padding-bottom: 44px; }
.home-team-actions {
  position: absolute;
  bottom: 12px;
  inset-inline: 8px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px 12px;
  font-size: 12px;
}
.home-team-actions a { color: #ffd0cf; text-decoration: underline; text-underline-offset: 3px; }
.home-team-card:focus-within .home-tool-label { border-color: var(--card-accent); }
.landing-sparkles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.landing-sparkles i {
  position: absolute;
  left: var(--spark-x);
  top: -24px;
  color: #fff2b0;
  font-style: normal;
  font-size: 12px;
  opacity: 0;
  text-shadow: 0 0 9px #ffe598, 0 0 18px #b8edff;
}
@media (prefers-reduced-motion: no-preference) {
  .landing-sparkles i {
    animation: home-spark-fall var(--spark-duration) linear var(--spark-delay) infinite;
  }
  @keyframes home-spark-fall {
    0% { transform: translate(0, 0) rotate(0); opacity: 0; }
    18%, 58% { opacity: .8; }
    38%, 78% { opacity: .2; }
    100% { transform: translate(35px, 580px) rotate(160deg); opacity: 0; }
  }
  .home-tool-character { animation: home-character-float 4.8s ease-in-out infinite; }
  .home-tool-card:nth-child(3n + 2) .home-tool-character { animation-delay: -1.6s; }
  .home-tool-card:nth-child(3n) .home-tool-character { animation-delay: -3.2s; }
  @keyframes home-character-float {
    50% { transform: translateY(-6px) rotate(1deg); }
  }
}

@media (max-width: 560px) {
  .home-tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 10px; }
  .home-team-card .home-tool-label { padding-bottom: 60px; }
  .home-team-actions { font-size: 11px; gap: 4px 8px; }
}

@media (max-width: 700px) {
  .home-pond > :is(.home-tool-grid, .home-community) { width: calc(100% - 32px); }
  .home-pond { background-position: center, 63% top, center; }
}