@layer base,layout,panels,controls,responsive;
@layer base {
  :root {
    color-scheme: dark;
    --ink: #090a10;
    --paper: #f5f4f8;
    --muted: #aaaab9;
    --line: #ffffff19;
    --lime: #d9ff7a;
    --violet: #a78bfa;
    font-family:
      Microsoft YaHei,
      PingFang SC,
      system-ui,
      sans-serif;
    background: var(--ink);
    color: var(--paper);
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
  }
  *,
  *:before,
  *:after {
    box-sizing: border-box;
  }
  body {
    margin: 0;
    font-size: 15px;
    line-height: 1.8;
  }
  a {
    color: inherit;
    text-decoration: none;
  }
  button {
    font: inherit;
    color: inherit;
    cursor: pointer;
  }
  button,
  input {
    -webkit-tap-highlight-color: transparent;
  }
  button {
    background: none;
    border: 0;
  }
  img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  h1,
  h2,
  h3,
  p,
  figure {
    margin: 0;
  }
  h2 {
    font-size: clamp(26px, 3vw, 39px);
    line-height: 1.4;
    font-weight: 700;
    letter-spacing: -0.04em;
  }
  h3 {
    line-height: 1.5;
  }
  ol {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  small {
    font-size: 12px;
  }
  button,
  a,
  summary {
    touch-action: manipulation;
  }
  :focus-visible {
    outline: 2px solid var(--lime);
    outline-offset: 6px;
    border-radius: 3px;
  }
  ::selection {
    background: #c1a3ff;
    color: #090a10;
  }
  [hidden] {
    display: none !important;
  }
  section,
  #about {
    scroll-margin-top: 30px;
  }
  .p4v7n2ax {
    position: fixed;
    top: -100px;
    left: 20px;
    z-index: 50;
    padding: 10px 20px;
    background: var(--lime);
    color: var(--ink);
  }
  .p4v7n2ax:focus {
    top: 12px;
  }
  .k4w8a2tm {
    color: var(--violet);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.18em;
    line-height: 1.6;
  }
  .c2p8w4rm {
    color: var(--lime);
  }
  .l4v9n2rx {
    font-size: 11px;
    letter-spacing: 0.08em;
    color: #c2bfd0;
  }
  .m5q8c2vr {
    font-size: 12px;
    color: var(--muted);
    line-height: 1.9;
  }
  .i7x3m9pk {
    display: inline-block;
    font-size: 11px;
    border: 1px solid #ffffff30;
    padding: 4px 10px;
    color: #d3cbe7;
  }
}
@layer layout {
  .n8x3q6vb {
    position: sticky;
    top: 0;
    z-index: 20;
    background: #090a10ee;
    border-bottom: 1px solid var(--line);
    backdrop-filter: blur(20px);
  }
  .d5r9m2kc {
    max-width: 1440px;
    padding: 0 4.5%;
    height: 78px;
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
  }
  .t7b3x8qn {
    font-size: 21px;
    letter-spacing: -0.05em;
  }
  .t7b3x8qn a {
    display: flex;
    align-items: center;
    gap: 11px;
  }
  .t7b3x8qn img {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #ffffff35;
  }
  .t7b3x8qn .c2p8w4rm {
    margin-left: 5px;
    font-size: 18px;
    letter-spacing: -0.05em;
  }
  .m9k4z7pd {
    display: flex;
    gap: 34px;
    align-items: center;
    font-size: 13px;
    color: #bbb9c6;
  }
  .m9k4z7pd a {
    transition: color 0.2s;
  }
  .m9k4z7pd a:last-child {
    padding: 7px 15px;
    border: 1px solid #ffffff32;
    border-radius: 4px;
    color: var(--paper);
  }
  .m9k4z7pd a:last-child span {
    margin-left: 20px;
    color: var(--lime);
  }
  .j6q2n8vx {
    display: none;
  }
  .r8m4x2qa {
    position: relative;
    min-height: 730px;
    isolation: isolate;
    overflow: hidden;
    background: #101321;
  }
  .h5y9c3pk {
    position: absolute;
    inset: 0;
    z-index: -3;
    animation: k9x3v7pq 0.8s ease both;
  }
  .h5y9c3pk img {
    opacity: 0.75;
    object-position: center 42%;
  }
  .r8m4x2qa:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
      linear-gradient(90deg, #080910ed, #0809108f 53%, #08091029),
      linear-gradient(0deg, #090a10, #090a1000 30%, #090a1055);
  }
  .r8m4x2qa:after {
    content: "";
    position: absolute;
    width: 400px;
    height: 400px;
    z-index: -1;
    right: -180px;
    bottom: -230px;
    background: #a785ff33;
    filter: blur(100px);
    border-radius: 50%;
  }
  .z3v7k9bn {
    max-width: 1440px;
    padding: 40px 4.5% 22px;
    margin: auto;
  }
  .u6x2p8rc {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 10px;
    letter-spacing: 0.14em;
    color: #b7b6c2;
  }
  .u6x2p8rc .k4w8a2tm {
    color: #d7d0e8;
  }
  .f9b3q7mx {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 60px;
    padding: 90px 0 76px;
  }
  .v2n8c5pa {
    max-width: 790px;
  }
  .e4r7j9kx {
    font-size: 11px;
    letter-spacing: 0.12em;
    color: #d5c8ec;
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 20px;
  }
  .e4r7j9kx span {
    width: 6px;
    height: 6px;
    background: var(--lime);
    border-radius: 50%;
    box-shadow: 0 0 15px #d9ff7a70;
  }
  .v2n8c5pa h2 {
    font-size: clamp(40px, 5.2vw, 73px);
    line-height: 1.28;
    letter-spacing: -0.065em;
    font-weight: 800;
  }
  .v2n8c5pa h2 span {
    color: var(--lime);
  }
  .s6m2x9vc {
    margin: 23px 0 14px;
    font-size: 20px;
    color: #e1deeb;
    line-height: 1.65;
  }
  .y8c4n6qb {
    color: #b9b7c6;
    font-size: 13px;
    max-width: 425px;
  }
  .a9q3v8nk {
    display: flex;
    gap: 25px;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 28px;
  }
  .q8p2c7mb {
    flex: 0 0 240px;
    border-top: 1px solid #d9ff7a90;
    padding: 20px 0 0;
    margin-bottom: 4px;
  }
  .q8p2c7mb h3 {
    font-size: 30px;
    margin: 12px 0 8px;
    letter-spacing: 0.02em;
  }
  .q8p2c7mb p {
    font-size: 13px;
    color: #c9c5d5;
    margin-bottom: 18px;
  }
  .q8p2c7mb small {
    display: block;
    font-size: 10px;
    color: #aaa5b9;
    margin-top: 13px;
  }
  .g2p7v4nx {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    border-top: 1px solid #ffffff23;
    padding-top: 22px;
  }
  .g2p7v4nx > a {
    font-size: 11px;
    color: #b1aebf;
  }
  .g2p7v4nx > a span {
    margin-left: 18px;
  }
  .d8n4x7pq,
  .u8c3m7va,
  .f3r8n2vx,
  .b8n3q7vx,
  .m8p3v6nx,
  .s9q3k7mv,
  .v9n4p2mx,
  .q2v7n9kx {
    max-width: 1320px;
    margin-inline: auto;
  }
  .d8n4x7pq {
    padding: 78px 36px 70px;
  }
  .x3p9k6mv {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 28px;
    margin-bottom: 30px;
  }
  .x3p9k6mv h2 {
    margin-top: 8px;
  }
  .x3p9k6mv > p {
    font-size: 12px;
    line-height: 1.8;
    color: var(--muted);
  }
  .u8c3m7va {
    padding: 25px 36px 0;
  }
  .f3r8n2vx {
    padding: 90px 36px;
  }
  .b8n3q7vx {
    padding: 40px 36px 90px;
    display: grid;
    grid-template-columns: 0.76fr 1.24fr;
    align-items: center;
    gap: 80px;
  }
  .m8p3v6nx {
    padding: 30px 36px 90px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 120px;
  }
  .s9q3k7mv {
    padding: 60px 36px 90px;
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 90px;
    border-top: 1px solid var(--line);
  }
  .v9n4p2mx {
    width: calc(100% - 72px);
    padding: 50px 58px;
    display: flex;
    justify-content: space-between;
    gap: 40px;
    background:
      radial-gradient(ellipse at 95% 15%, #7951c761, transparent 60%), #171125;
    border: 1px solid #bda1ff35;
    position: relative;
    overflow: hidden;
  }
  .q2v7n9kx {
    padding: 80px 36px 24px;
  }
}
@layer panels {
  .c9r2v7kn {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border: 1px solid var(--line);
    background: #0f1019;
  }
  .c9r2v7kn article {
    padding: 27px 24px;
    position: relative;
    border-right: 1px solid var(--line);
    transition: background 0.25s;
  }
  .c9r2v7kn article:last-child {
    border-right: 0;
  }
  .c9r2v7kn article > span {
    font:
      10px/1.5 ui-monospace,
      monospace;
    letter-spacing: 0.06em;
    color: var(--violet);
  }
  .c9r2v7kn h3 {
    font-size: 18px;
    margin: 20px 0 9px;
  }
  .c9r2v7kn p {
    font-size: 12px;
    color: var(--muted);
    line-height: 1.9;
  }
  .k9p4r2nx > .m5q8c2vr {
    margin-top: -14px;
    margin-bottom: 28px;
  }
  .r6n2k9px {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
  }
  .p9v3x7ma > button {
    width: 100%;
    aspect-ratio: 1.65;
    position: relative;
    display: block;
    overflow: hidden;
    padding: 0;
    text-align: left;
    border-radius: 3px;
  }
  .p9v3x7ma > button:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, #070811cc, transparent 65%);
  }
  .p9v3x7ma img,
  .x8c2n5pk img {
    transition:
      transform 0.5s ease,
      filter 0.5s;
    background: #202030;
  }
  .b2r9n6kx {
    position: absolute;
    z-index: 1;
    top: 12px;
    left: 15px;
    font:
      38px/1 ui-monospace,
      monospace;
    color: #ffffffa3;
  }
  .n7q3v8mc {
    position: absolute;
    z-index: 1;
    bottom: 16px;
    left: 18px;
    font-size: 10px;
    color: #e8e2f6;
  }
  .o8m4x2pv {
    position: absolute;
    z-index: 1;
    bottom: 10px;
    right: 15px;
    font-size: 25px;
    color: var(--lime);
  }
  .p9v3x7ma > div {
    padding: 18px 0 0;
  }
  .p9v3x7ma h3 {
    font-size: 19px;
    margin-bottom: 7px;
  }
  .p9v3x7ma p {
    font-size: 12px;
    color: #c0bdcd;
  }
  .p9v3x7ma div > span {
    font-size: 10px;
    color: #8f8c9e;
    margin-top: 10px;
    display: block;
  }
  .v4k8m3qc {
    display: grid;
    grid-template-columns: 0.75fr 1.25fr;
    gap: 60px;
    margin-top: 55px;
    padding: 28px 30px;
    background: #11121b;
    border: 1px solid var(--line);
  }
  .v4k8m3qc h2 {
    font-size: 25px;
    margin-top: 8px;
  }
  .v4k8m3qc div > p:last-child {
    font-size: 11px;
    color: var(--muted);
    margin-top: 9px;
  }
  .a3x7p9nr li {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 11px 0;
    border-bottom: 1px solid var(--line);
  }
  .a3x7p9nr li:last-child {
    border: 0;
  }
  .a3x7p9nr li > span:first-child {
    color: var(--lime);
    font:
      italic 23px/1.2 Georgia,
      serif;
  }
  .a3x7p9nr button {
    text-align: left;
    padding: 0;
    flex: 1;
  }
  .a3x7p9nr strong {
    display: block;
    font-size: 14px;
    font-weight: 500;
  }
  .a3x7p9nr small {
    display: block;
    font-size: 10px;
    color: #9895aa;
  }
  .a3x7p9nr li > span:last-child {
    font-size: 10px;
    color: #b0a2cd;
  }
  .t9v4m7kq {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin: 30px 0;
  }
  .t9v4m7kq > p {
    font-size: 11px;
    color: var(--muted);
  }
  .q7m3r9vb {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 20px;
  }
  .x8c2n5pk button {
    width: 100%;
    text-align: left;
    padding: 0;
  }
  .x8c2n5pk > button > span {
    position: relative;
    aspect-ratio: 2 / 3;
    overflow: hidden;
    border-radius: 3px;
    border: 1px solid #ffffff16;
  }
  .x8c2n5pk > button > span:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, #090a10a3, transparent 55%);
  }
  .x8c2n5pk > button > span span {
    position: absolute;
    z-index: 1;
    font-size: 10px;
  }
  .x8c2n5pk > button > span span:first-of-type {
    top: 10px;
    left: 10px;
    padding: 2px 8px;
    background: #090a10b8;
    border: 1px solid #ffffff2c;
    border-radius: 2px;
  }
  .x8c2n5pk > button > span span:last-of-type {
    bottom: 12px;
    right: 12px;
    color: var(--lime);
  }
  .x8c2n5pk h3 {
    font-size: 15px;
    margin-top: 13px;
  }
  .x8c2n5pk p {
    font-size: 10px;
    color: #b4afc3;
    margin-top: 5px;
  }
  .x8c2n5pk small {
    display: block;
    color: #9390a5;
    font-size: 9px;
    margin-top: 7px;
  }
  .w4p9x2mc h2 {
    font-size: clamp(30px, 3vw, 43px);
    margin: 15px 0 20px;
  }
  .w4p9x2mc > p:not(.k4w8a2tm):not(.m5q8c2vr) {
    color: #bcb6cb;
    font-size: 13px;
    max-width: 310px;
    margin-bottom: 22px;
  }
  .w4p9x2mc .m5q8c2vr {
    margin: 16px 0 20px;
    max-width: 320px;
  }
  .w4p9x2mc > a,
  .s9q3k7mv > div > a {
    font-size: 12px;
    color: var(--lime);
  }
  .n3r7v9pk {
    border: 1px solid #80729355;
    background: #13121c;
    border-radius: 12px;
    padding: 11px;
    box-shadow: 20px 25px 90px #0a051c90;
    transform: perspective(1400px) rotateY(-4deg);
  }
  .f7m2x8qc {
    display: flex;
    justify-content: space-between;
    padding: 7px 6px 15px;
    color: #b7acc9;
    font:
      9px/1.6 ui-monospace,
      monospace;
  }
  .f7m2x8qc > span:last-child {
    display: flex;
    gap: 7px;
    align-items: center;
  }
  .f7m2x8qc i {
    width: 5px;
    height: 5px;
    background: var(--lime);
    border-radius: 50%;
  }
  .k2v8p4mn {
    position: relative;
    aspect-ratio: 1.57;
    overflow: hidden;
    border-radius: 5px;
  }
  .k2v8p4mn:after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, #090a10f0, #090a1000 85%);
  }
  .k2v8p4mn > div {
    position: absolute;
    bottom: 28px;
    left: 25px;
    right: 25px;
    z-index: 1;
  }
  .k2v8p4mn div > span {
    font:
      9px/1.5 ui-monospace,
      monospace;
    color: var(--lime);
    letter-spacing: 0.12em;
  }
  .k2v8p4mn h3 {
    font-size: 24px;
    margin: 7px 0;
  }
  .k2v8p4mn p {
    font-size: 12px;
    max-width: 385px;
    color: #d4cce3;
  }
  .l8q4n2vr {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 1;
    background: #090a10bd;
    padding: 3px 8px;
    font-size: 9px;
    color: #cac5d2;
  }
  .y4n9c2pk h2,
  .p2x7r9vc h2 {
    font-size: 28px;
    margin-top: 12px;
  }
  .r3k8x2mq {
    margin-top: 38px;
  }
  .r3k8x2mq li {
    display: flex;
    gap: 24px;
    position: relative;
    padding-bottom: 30px;
  }
  .r3k8x2mq li:after {
    content: "";
    position: absolute;
    top: 40px;
    bottom: 3px;
    left: 17px;
    width: 1px;
    background: #ffffff21;
  }
  .r3k8x2mq li:last-child:after {
    display: none;
  }
  .r3k8x2mq li > span {
    flex: 0 0 35px;
    height: 35px;
    display: grid;
    place-items: center;
    font:
      12px/1 ui-monospace,
      monospace;
    color: var(--lime);
    border: 1px solid #d9ff7a44;
    border-radius: 50%;
  }
  .r3k8x2mq h3 {
    font-size: 16px;
    margin: 3px 0 8px;
  }
  .r3k8x2mq p {
    color: var(--muted);
    font-size: 12px;
  }
  .r3k8x2mq a {
    font-size: 11px;
    color: #cab5fa;
    display: inline-block;
    margin-top: 7px;
  }
  .p2x7r9vc > .m5q8c2vr {
    margin-top: 12px;
    margin-bottom: 17px;
  }
  .p2x7r9vc figure {
    padding: 20px 0;
    border-bottom: 1px solid var(--line);
  }
  .p2x7r9vc figure:last-child {
    border: 0;
  }
  blockquote {
    margin: 0 0 13px;
    font-size: 13px;
    color: #c6bfd3;
  }
  figcaption {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 11px;
  }
  figcaption > span {
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    background: #211b31;
    color: #bc9eeb;
    border: 1px solid #a58bc32c;
    border-radius: 50%;
  }
  figcaption small {
    display: block;
    font-size: 9px;
    color: #9690a5;
  }
  .s9q3k7mv h2 {
    margin: 13px 0 26px;
    font-size: 31px;
  }
  .a4v8x2np details {
    border-bottom: 1px solid var(--line);
  }
  .a4v8x2np details:first-child {
    border-top: 1px solid var(--line);
  }
  .a4v8x2np summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    cursor: pointer;
    padding: 20px 0;
    list-style: none;
    font-size: 14px;
  }
  .a4v8x2np summary::-webkit-details-marker {
    display: none;
  }
  .a4v8x2np summary span {
    color: var(--violet);
    font-size: 21px;
    line-height: 1;
    transition: transform 0.2s;
  }
  .a4v8x2np details[open] summary span {
    transform: rotate(45deg);
  }
  .a4v8x2np details p {
    color: var(--muted);
    padding: 0 30px 22px 0;
    font-size: 12px;
  }
  .v9n4p2mx h2 {
    font-size: 42px;
    margin: 16px 0;
  }
  .v9n4p2mx div > p {
    max-width: 470px;
    font-size: 13px;
    color: #bdb2cf;
  }
  .v9n4p2mx aside {
    min-width: 200px;
    align-self: center;
    border-left: 1px solid #c6abff35;
    padding-left: 45px;
  }
  .h9m3r7qv {
    font:
      90px/1 system-ui,
      sans-serif;
    display: block;
    color: var(--lime);
    margin-top: -15px;
  }
  .v9n4p2mx aside p {
    font-size: 22px;
    line-height: 1.6;
    margin: 10px 0 18px;
  }
  .v9n4p2mx aside small {
    font-size: 10px;
    color: #b8a6d2;
  }
  .x6m3p8vr {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 90px;
    padding-bottom: 45px;
  }
  .g9r4x2nc {
    font-size: 23px;
    font-weight: 700;
  }
  .g9r4x2nc span {
    color: var(--lime);
    margin-left: 5px;
  }
  .x6m3p8vr .k4w8a2tm {
    color: #8d839e;
    font-size: 9px;
    margin-top: 9px;
    letter-spacing: 0.12em;
  }
  .x6m3p8vr h2 {
    font-size: 14px;
    margin-bottom: 12px;
  }
  .x6m3p8vr div > p:not(.k4w8a2tm) {
    font-size: 11px;
    color: #a39bab;
    line-height: 2.1;
  }
  .j3p8v4mq {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 13px 24px;
    padding: 23px 0;
    border-block: 1px solid var(--line);
    font-size: 11px;
    color: #9b93a7;
  }
  .j3p8v4mq > span {
    color: #e2d8ef;
    margin-right: 16px;
  }
  .t4k9m2vx {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding-top: 23px;
    color: #8d859a;
    font-size: 10px;
  }
  .t4k9m2vx a {
    margin-left: 25px;
    color: #c7bbd7;
  }
  .m3v8p2qc {
    width: min(620px, calc(100% - 32px));
    color: var(--paper);
    background: #15131e;
    border: 1px solid #ac91d555;
    border-radius: 10px;
    padding: 30px;
    max-height: calc(100dvh - 40px);
    overflow: auto;
  }
  .m3v8p2qc::backdrop {
    background: #030308d9;
    backdrop-filter: blur(8px);
  }
  .n8p4x7mr {
    display: flex;
    gap: 15px;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
  }
  .n8p4x7mr button {
    font-size: 28px;
    padding: 0 6px;
    line-height: 1.2;
  }
  .m3v8p2qc h2 {
    margin: 13px 0 20px;
    font-size: 33px;
  }
  #dialog-copy,
  .j9m2q7vx p {
    font-size: 14px;
    color: #c3b9d2;
    line-height: 2;
  }
  .j9m2q7vx {
    padding: 20px;
    background: #211c30;
    border-left: 2px solid var(--lime);
    margin: 25px 0 20px;
  }
  .j9m2q7vx h3 {
    font-size: 13px;
    color: var(--lime);
    margin-bottom: 8px;
  }
  .m3v8p2qc > a {
    margin-top: 25px;
  }
}
@layer controls {
  .b7x2p4rm {
    display: inline-flex;
    gap: 40px;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(105deg, #c4a2ff, #d5baff 55%, #e4ecb0);
    color: #171024;
    border: 1px solid #ffffff33;
    border-radius: 4px;
    padding: 12px 22px;
    font-size: 13px;
    font-weight: 700;
    transition:
      transform 0.2s,
      box-shadow 0.2s;
  }
  .b7x2p4rm > span:last-child {
    font-size: 20px;
    line-height: 1;
  }
  .o5n9k3vx {
    font-size: 12px;
    color: #ddd5ed;
    display: inline-flex;
    gap: 10px;
    align-items: center;
  }
  .o5n9k3vx > span {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    border: 1px solid #c6b3e278;
    border-radius: 50%;
    font-size: 14px;
  }
  .w9q4b6nc {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: 22px;
    padding: 0 0 12px;
    border-bottom: 1px solid #ffffff47;
    font-size: 12px;
  }
  .w9q4b6nc span {
    font-size: 22px;
    color: var(--lime);
  }
  .a8m3r6qc {
    display: flex;
    gap: 22px;
    align-items: center;
  }
  .a8m3r6qc button {
    padding: 7px 0;
    font:
      11px/1.5 ui-monospace,
      monospace;
    color: #a5a0b2;
    position: relative;
  }
  .a8m3r6qc button span {
    font:
      10px/1.5 Microsoft YaHei,
      sans-serif;
    margin-left: 10px;
  }
  .a8m3r6qc button[aria-pressed="true"] {
    color: var(--lime);
  }
  .a8m3r6qc button[data-scene]:after {
    content: "";
    position: absolute;
    top: -23px;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--lime);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s;
  }
  .a8m3r6qc button[data-scene][aria-pressed="true"]:after {
    transform: scaleX(1);
  }
  .a8m3r6qc .z6k9x2mr {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    padding: 0;
    border: 1px solid #ffffff3b;
    font-size: 12px;
  }
  .e2p8x3nc {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
  }
  .e2p8x3nc button {
    padding: 7px 17px;
    border: 1px solid #ffffff20;
    border-radius: 3px;
    color: #b1a8c1;
    font-size: 11px;
    transition:
      color 0.2s,
      background 0.2s;
  }
  .e2p8x3nc button[aria-pressed="true"] {
    background: var(--lime);
    border-color: var(--lime);
    color: #1b2110;
  }
  .c4x9m7pn {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding-top: 11px;
    gap: 7px;
  }
  .c4x9m7pn button {
    text-align: left;
    padding: 12px 10px;
    color: #aca1bd;
    font-size: 10px;
    border-radius: 3px;
    background: #1d1929;
    transition: background 0.2s;
  }
  .c4x9m7pn button span {
    margin-right: 8px;
    font:
      10px/1.5 ui-monospace,
      monospace;
  }
  .c4x9m7pn button[aria-pressed="true"] {
    background: #d9ff7a;
    color: #1d2511;
  }
  [data-reveal] {
    transition:
      opacity 0.65s ease,
      translate 0.65s ease;
  }
  [data-reveal][data-waiting] {
    opacity: 0;
    translate: 0 20px;
  }
  @keyframes k9x3v7pq {
    0% {
      opacity: 0.3;
      scale: 1.025;
    }
    to {
      opacity: 1;
      scale: 1;
    }
  }
  @media (hover: hover) {
    a:hover,
    .m9k4z7pd a:hover {
      color: var(--lime);
    }
    .b7x2p4rm:hover {
      transform: translateY(-3px);
      box-shadow: 0 7px 24px #a078ff30;
      color: #171024;
    }
    .c9r2v7kn article:hover {
      background: #181622;
    }
    .p9v3x7ma button:hover img,
    .x8c2n5pk button:hover img {
      transform: scale(1.06);
      filter: brightness(1.12);
    }
    .a3x7p9nr button:hover,
    .w9q4b6nc:hover,
    .e2p8x3nc button:hover,
    .a4v8x2np summary:hover {
      color: var(--lime);
    }
  }
}
@layer responsive {
  @media (min-width: 1550px) {
    .r8m4x2qa {
      min-height: 780px;
    }
    .f9b3q7mx {
      padding-top: 110px;
      padding-bottom: 100px;
    }
  }
  @media (max-width: 1100px) {
    .m9k4z7pd {
      gap: 20px;
    }
    .f9b3q7mx {
      gap: 30px;
    }
    .v2n8c5pa h2 {
      font-size: 54px;
    }
    .q8p2c7mb {
      flex-basis: 210px;
    }
    .q7m3r9vb {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 30px 24px;
    }
    .x8c2n5pk > button > span {
      aspect-ratio: 3 / 3.8;
    }
    .x8c2n5pk h3 {
      font-size: 18px;
    }
    .x8c2n5pk p {
      font-size: 12px;
    }
    .b8n3q7vx,
    .m8p3v6nx {
      gap: 50px;
    }
    .b8n3q7vx {
      grid-template-columns: 0.7fr 1.3fr;
    }
    .c9r2v7kn article {
      padding: 24px 18px;
    }
    .k2v8p4mn h3 {
      font-size: 20px;
    }
    .c4x9m7pn button {
      padding-inline: 6px;
      font-size: 9px;
    }
    .s9q3k7mv {
      gap: 40px;
    }
  }
  @media (max-width: 760px) {
    :root {
      scroll-padding-top: 78px;
    }
    .d5r9m2kc {
      height: 66px;
      padding-inline: 22px;
    }
    .t7b3x8qn {
      font-size: 18px;
    }
    .t7b3x8qn img {
      width: 29px;
      height: 29px;
    }
    .j6q2n8vx {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 6px;
      padding: 10px 5px;
      width: 34px;
      height: 40px;
    }
    .j6q2n8vx span {
      width: 24px;
      height: 1px;
      background: #e0d9ee;
      transition: transform 0.2s;
    }
    .j6q2n8vx[aria-expanded="true"] span:first-child {
      transform: translateY(3.5px) rotate(45deg);
    }
    .j6q2n8vx[aria-expanded="true"] span:last-child {
      transform: translateY(-3.5px) rotate(-45deg);
    }
    .m9k4z7pd {
      display: none;
      position: absolute;
      left: 0;
      right: 0;
      top: 65px;
      padding: 18px 24px 24px;
      background: #111019;
      border-bottom: 1px solid #ffffff30;
      box-shadow: 0 20px 30px #0008;
    }
    .m9k4z7pd[data-opened] {
      display: grid;
      gap: 0;
    }
    .m9k4z7pd a {
      padding: 12px 0;
    }
    .m9k4z7pd a:last-child {
      margin-top: 8px;
      padding: 10px 15px;
    }
    .r8m4x2qa {
      min-height: 0;
    }
    .z3v7k9bn {
      padding: 26px 22px 23px;
    }
    .u6x2p8rc > span:last-child {
      display: none;
    }
    .u6x2p8rc .k4w8a2tm {
      font-size: 9px;
    }
    .f9b3q7mx {
      display: block;
      padding: 60px 0 30px;
    }
    .v2n8c5pa h2 {
      font-size: clamp(36px, 7.5vw, 56px);
      letter-spacing: -0.06em;
    }
    .e4r7j9kx {
      font-size: 9px;
      letter-spacing: 0.07em;
      margin-bottom: 18px;
    }
    .s6m2x9vc {
      font-size: 17px;
      margin-top: 20px;
    }
    .y8c4n6qb {
      font-size: 12px;
      max-width: 340px;
    }
    .a9q3v8nk {
      gap: 22px;
    }
    .b7x2p4rm {
      padding: 11px 16px;
      font-size: 12px;
      gap: 25px;
    }
    .o5n9k3vx {
      font-size: 11px;
    }
    .q8p2c7mb {
      padding-top: 20px;
      margin-top: 45px;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 3px 15px;
      align-items: center;
    }
    .q8p2c7mb > .l4v9n2rx {
      grid-column: 1 / -1;
      font-size: 9px;
    }
    .q8p2c7mb h3 {
      font-size: 22px;
      margin: 7px 0 2px;
    }
    .q8p2c7mb .i7x3m9pk {
      grid-column: 2;
      grid-row: 2;
      font-size: 9px;
    }
    .q8p2c7mb p {
      grid-column: 1 / -1;
      margin: 0;
      font-size: 11px;
    }
    .w9q4b6nc {
      grid-column: 2;
      margin: 7px 0 0;
      padding: 0;
      border: 0;
      font-size: 10px;
      gap: 15px;
    }
    .q8p2c7mb small {
      grid-column: 1;
      grid-row: 4;
      margin-top: 8px;
      font-size: 9px;
    }
    .g2p7v4nx {
      padding-top: 17px;
    }
    .g2p7v4nx > a {
      display: none;
    }
    .a8m3r6qc {
      width: 100%;
      gap: 0;
      justify-content: space-between;
    }
    .a8m3r6qc button span {
      margin-left: 5px;
      font-size: 9px;
    }
    .a8m3r6qc button[data-scene]:after {
      top: -18px;
    }
    .d8n4x7pq,
    .u8c3m7va,
    .f3r8n2vx,
    .b8n3q7vx,
    .m8p3v6nx,
    .s9q3k7mv,
    .q2v7n9kx {
      padding-inline: 22px;
    }
    .d8n4x7pq {
      padding-block: 55px 45px;
    }
    .x3p9k6mv {
      gap: 15px;
      margin-bottom: 24px;
      align-items: flex-start;
    }
    .x3p9k6mv > p,
    .x3p9k6mv > .l4v9n2rx {
      display: none;
    }
    h2 {
      font-size: 27px;
    }
    .k4w8a2tm {
      font-size: 9px;
    }
    .c9r2v7kn {
      grid-template-columns: 1fr 1fr;
    }
    .c9r2v7kn article {
      padding: 23px 17px;
    }
    .c9r2v7kn article:nth-child(2) {
      border-right: 0;
    }
    .c9r2v7kn article:nth-child(-n + 2) {
      border-bottom: 1px solid var(--line);
    }
    .c9r2v7kn h3 {
      font-size: 16px;
      margin-top: 16px;
    }
    .c9r2v7kn p {
      font-size: 11px;
    }
    .c9r2v7kn article > span {
      font-size: 9px;
    }
    .u8c3m7va {
      padding-top: 15px;
    }
    .r6n2k9px {
      grid-template-columns: 1fr;
      gap: 26px;
    }
    .p9v3x7ma {
      display: grid;
      grid-template-columns: 1.1fr 1fr;
      gap: 17px;
      align-items: center;
    }
    .p9v3x7ma > button {
      aspect-ratio: 1.35;
    }
    .p9v3x7ma > div {
      padding: 0;
    }
    .p9v3x7ma h3 {
      font-size: 17px;
    }
    .p9v3x7ma p {
      font-size: 11px;
    }
    .p9v3x7ma div > span {
      font-size: 9px;
      margin-top: 6px;
    }
    .b2r9n6kx {
      font-size: 28px;
    }
    .n7q3v8mc {
      left: 12px;
      bottom: 10px;
      font-size: 8px;
    }
    .o8m4x2pv {
      font-size: 20px;
      bottom: 5px;
      right: 10px;
    }
    .v4k8m3qc {
      display: block;
      padding: 25px 20px;
      margin-top: 35px;
    }
    .v4k8m3qc div > p:last-child br {
      display: none;
    }
    .a3x7p9nr {
      margin-top: 15px;
    }
    .a3x7p9nr li {
      gap: 15px;
    }
    .a3x7p9nr li > span:last-child {
      font-size: 8px;
    }
    .f3r8n2vx {
      padding-block: 60px;
    }
    .t9v4m7kq {
      display: block;
      margin: 20px 0 23px;
    }
    .t9v4m7kq > p {
      margin-top: 12px;
      font-size: 10px;
    }
    .e2p8x3nc {
      gap: 6px;
    }
    .e2p8x3nc button {
      padding: 6px 11px;
      font-size: 10px;
    }
    .q7m3r9vb {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 27px 16px;
    }
    .x8c2n5pk > button > span {
      aspect-ratio: 2 / 2.8;
    }
    .x8c2n5pk h3 {
      font-size: 16px;
    }
    .x8c2n5pk p {
      font-size: 10px;
    }
    .x8c2n5pk small {
      font-size: 8px;
    }
    .b8n3q7vx {
      display: block;
      padding-top: 5px;
      padding-bottom: 60px;
    }
    .w4p9x2mc h2 {
      font-size: 32px;
    }
    .w4p9x2mc > p:not(.k4w8a2tm):not(.m5q8c2vr),
    .w4p9x2mc .m5q8c2vr {
      max-width: none;
    }
    .n3r7v9pk {
      margin-top: 30px;
      transform: none;
      padding: 8px;
    }
    .k2v8p4mn {
      aspect-ratio: 1.2;
    }
    .k2v8p4mn > div {
      left: 15px;
      right: 15px;
      bottom: 20px;
    }
    .k2v8p4mn h3 {
      font-size: 21px;
    }
    .k2v8p4mn p {
      font-size: 11px;
    }
    .c4x9m7pn button {
      font-size: 9px;
      padding: 11px 5px;
    }
    .c4x9m7pn button span {
      margin-right: 4px;
      font-size: 9px;
    }
    .m8p3v6nx {
      display: block;
      padding-top: 15px;
      padding-bottom: 45px;
    }
    .r3k8x2mq {
      margin-top: 30px;
    }
    .p2x7r9vc {
      margin-top: 32px;
    }
    .y4n9c2pk h2,
    .p2x7r9vc h2 {
      font-size: 27px;
    }
    .s9q3k7mv {
      display: block;
      padding-top: 45px;
      padding-bottom: 55px;
    }
    .s9q3k7mv h2 {
      font-size: 28px;
    }
    .a4v8x2np {
      margin-top: 30px;
    }
    .a4v8x2np summary {
      font-size: 13px;
    }
    .v9n4p2mx {
      width: calc(100% - 44px);
      padding: 30px 25px;
    }
    .v9n4p2mx h2 {
      font-size: 33px;
    }
    .v9n4p2mx aside {
      display: none;
    }
    .v9n4p2mx div > p {
      font-size: 12px;
    }
    .v9n4p2mx .a9q3v8nk {
      gap: 15px;
    }
    .q2v7n9kx {
      padding-top: 50px;
    }
    .x6m3p8vr {
      display: block;
      padding-bottom: 30px;
    }
    .x6m3p8vr > div:last-child {
      margin-top: 30px;
    }
    .j3p8v4mq {
      gap: 12px 20px;
      font-size: 10px;
    }
    .j3p8v4mq > span {
      flex-basis: 100%;
    }
    .t4k9m2vx {
      display: block;
      font-size: 9px;
    }
    .t4k9m2vx p + p {
      margin-top: 10px;
    }
    .m3v8p2qc {
      padding: 23px;
    }
    .m3v8p2qc h2 {
      font-size: 28px;
    }
  }
  @media (max-width: 359px) {
    .v2n8c5pa h2 {
      font-size: 32px;
    }
    .a9q3v8nk {
      gap: 18px;
    }
    .v2n8c5pa .a9q3v8nk {
      align-items: flex-start;
      flex-direction: column;
    }
    .q8p2c7mb {
      column-gap: 8px;
    }
    .e2p8x3nc button {
      padding-inline: 8px;
    }
    .a8m3r6qc button span {
      display: none;
    }
    .p9v3x7ma {
      gap: 12px;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    :root {
      scroll-behavior: auto;
    }
    *,
    *:before,
    *:after {
      animation: none !important;
      transition: none !important;
    }
    [data-reveal][data-waiting] {
      opacity: 1;
      translate: none;
    }
    .n3r7v9pk {
      transform: none;
    }
  }
}
.x8c2n5pk > button > span {
  display: block;
}
.x8c2n5pk h3 button {
  font: inherit;
}