@font-face {
        font-family: Barlow;
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url(../fonts/723df36580.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Barlow;
        font-style: italic;
        font-weight: 400;
        font-display: swap;
        src: url(../fonts/30f7aa4199.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Barlow;
        font-style: normal;
        font-weight: 600;
        font-display: swap;
        src: url(../fonts/b68cdebfb4.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Barlow;
        font-style: normal;
        font-weight: 700;
        font-display: swap;
        src: url(../fonts/0c18236a18.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Bebas Neue;
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url(../fonts/523ff93571.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Oxanium;
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url(../fonts/cdb1d4e79f.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Oxanium;
        font-style: normal;
        font-weight: 600;
        font-display: swap;
        src: url(../fonts/43c5e043d9.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Oxanium;
        font-style: normal;
        font-weight: 700;
        font-display: swap;
        src: url(../fonts/03ff1e6486.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Share Tech Mono;
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src: url(../fonts/ea30f8dd25.woff2)
          format("woff2");
      }
      @font-face {
        font-family: Vazirmatn;
        font-style: normal;
        font-weight: 400;
        font-display: swap;
        src:
          url(../fonts/b6f1a79ae7.woff2)
            format("woff2"),
          url(../fonts/0319fc7446.woff2)
            format("woff2");
      }
      @font-face {
        font-family: Vazirmatn;
        font-style: normal;
        font-weight: 600;
        font-display: swap;
        src: url(../fonts/39ea5fb324.woff2)
          format("woff2");
      }
      *,
      :before,
      :after {
        --tw-border-spacing-x: 0;
        --tw-border-spacing-y: 0;
        --tw-translate-x: 0;
        --tw-translate-y: 0;
        --tw-rotate: 0;
        --tw-skew-x: 0;
        --tw-skew-y: 0;
        --tw-scale-x: 1;
        --tw-scale-y: 1;
        --tw-pan-x: ;
        --tw-pan-y: ;
        --tw-pinch-zoom: ;
        --tw-scroll-snap-strictness: proximity;
        --tw-gradient-from-position: ;
        --tw-gradient-via-position: ;
        --tw-gradient-to-position: ;
        --tw-ordinal: ;
        --tw-slashed-zero: ;
        --tw-numeric-figure: ;
        --tw-numeric-spacing: ;
        --tw-numeric-fraction: ;
        --tw-ring-inset: ;
        --tw-ring-offset-width: 0px;
        --tw-ring-offset-color: #fff;
        --tw-ring-color: rgb(59 130 246 / 0.5);
        --tw-ring-offset-shadow: 0 0 #0000;
        --tw-ring-shadow: 0 0 #0000;
        --tw-shadow: 0 0 #0000;
        --tw-shadow-colored: 0 0 #0000;
        --tw-blur: ;
        --tw-brightness: ;
        --tw-contrast: ;
        --tw-grayscale: ;
        --tw-hue-rotate: ;
        --tw-invert: ;
        --tw-saturate: ;
        --tw-sepia: ;
        --tw-drop-shadow: ;
        --tw-backdrop-blur: ;
        --tw-backdrop-brightness: ;
        --tw-backdrop-contrast: ;
        --tw-backdrop-grayscale: ;
        --tw-backdrop-hue-rotate: ;
        --tw-backdrop-invert: ;
        --tw-backdrop-opacity: ;
        --tw-backdrop-saturate: ;
        --tw-backdrop-sepia: ;
        --tw-contain-size: ;
        --tw-contain-layout: ;
        --tw-contain-paint: ;
        --tw-contain-style: ;
      }
      ::backdrop {
        --tw-border-spacing-x: 0;
        --tw-border-spacing-y: 0;
        --tw-translate-x: 0;
        --tw-translate-y: 0;
        --tw-rotate: 0;
        --tw-skew-x: 0;
        --tw-skew-y: 0;
        --tw-scale-x: 1;
        --tw-scale-y: 1;
        --tw-pan-x: ;
        --tw-pan-y: ;
        --tw-pinch-zoom: ;
        --tw-scroll-snap-strictness: proximity;
        --tw-gradient-from-position: ;
        --tw-gradient-via-position: ;
        --tw-gradient-to-position: ;
        --tw-ordinal: ;
        --tw-slashed-zero: ;
        --tw-numeric-figure: ;
        --tw-numeric-spacing: ;
        --tw-numeric-fraction: ;
        --tw-ring-inset: ;
        --tw-ring-offset-width: 0px;
        --tw-ring-offset-color: #fff;
        --tw-ring-color: rgb(59 130 246 / 0.5);
        --tw-ring-offset-shadow: 0 0 #0000;
        --tw-ring-shadow: 0 0 #0000;
        --tw-shadow: 0 0 #0000;
        --tw-shadow-colored: 0 0 #0000;
        --tw-blur: ;
        --tw-brightness: ;
        --tw-contrast: ;
        --tw-grayscale: ;
        --tw-hue-rotate: ;
        --tw-invert: ;
        --tw-saturate: ;
        --tw-sepia: ;
        --tw-drop-shadow: ;
        --tw-backdrop-blur: ;
        --tw-backdrop-brightness: ;
        --tw-backdrop-contrast: ;
        --tw-backdrop-grayscale: ;
        --tw-backdrop-hue-rotate: ;
        --tw-backdrop-invert: ;
        --tw-backdrop-opacity: ;
        --tw-backdrop-saturate: ;
        --tw-backdrop-sepia: ;
        --tw-contain-size: ;
        --tw-contain-layout: ;
        --tw-contain-paint: ;
        --tw-contain-style: ;
      }
      *,
      :before,
      :after {
        box-sizing: border-box;
        border-width: 0;
        border-style: solid;
        border-color: #e5e7eb;
      }
      :before,
      :after {
        --tw-content: "";
      }
      html,
      :host {
        line-height: 1.5;
        -webkit-text-size-adjust: 100%;
        -moz-tab-size: 4;
        -o-tab-size: 4;
        tab-size: 4;
        font-family: Barlow, Inter, sans-serif;
        font-feature-settings: normal;
        font-variation-settings: normal;
        -webkit-tap-highlight-color: transparent;
      }
      body {
        margin: 0;
        line-height: inherit;
      }
      hr {
        height: 0;
        color: inherit;
        border-top-width: 1px;
      }
      abbr:where([title]) {
        -webkit-text-decoration: underline dotted;
        text-decoration: underline dotted;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        font-size: inherit;
        font-weight: inherit;
      }
      a {
        color: inherit;
        text-decoration: inherit;
      }
      b,
      strong {
        font-weight: bolder;
      }
      code,
      kbd,
      samp,
      pre {
        font-family:
          Share Tech Mono,
          Oxanium,
          monospace;
        font-feature-settings: normal;
        font-variation-settings: normal;
        font-size: 1em;
      }
      small {
        font-size: 80%;
      }
      sub,
      sup {
        font-size: 75%;
        line-height: 0;
        position: relative;
        vertical-align: baseline;
      }
      sub {
        bottom: -0.25em;
      }
      sup {
        top: -0.5em;
      }
      table {
        text-indent: 0;
        border-color: inherit;
        border-collapse: collapse;
      }
      button,
      input,
      optgroup,
      select,
      textarea {
        font-family: inherit;
        font-feature-settings: inherit;
        font-variation-settings: inherit;
        font-size: 100%;
        font-weight: inherit;
        line-height: inherit;
        letter-spacing: inherit;
        color: inherit;
        margin: 0;
        padding: 0;
      }
      button,
      select {
        text-transform: none;
      }
      button,
      input:where([type="button"]),
      input:where([type="reset"]),
      input:where([type="submit"]) {
        -webkit-appearance: button;
        background-color: transparent;
        background-image: none;
      }
      :-moz-focusring {
        outline: auto;
      }
      :-moz-ui-invalid {
        box-shadow: none;
      }
      progress {
        vertical-align: baseline;
      }
      ::-webkit-inner-spin-button,
      ::-webkit-outer-spin-button {
        height: auto;
      }
      [type="search"] {
        -webkit-appearance: textfield;
        outline-offset: -2px;
      }
      ::-webkit-search-decoration {
        -webkit-appearance: none;
      }
      ::-webkit-file-upload-button {
        -webkit-appearance: button;
        font: inherit;
      }
      summary {
        display: list-item;
      }
      blockquote,
      dl,
      dd,
      h1,
      h2,
      h3,
      h4,
      h5,
      h6,
      hr,
      figure,
      p,
      pre {
        margin: 0;
      }
      fieldset {
        margin: 0;
        padding: 0;
      }
      legend {
        padding: 0;
      }
      ol,
      ul,
      menu {
        list-style: none;
        margin: 0;
        padding: 0;
      }
      dialog {
        padding: 0;
      }
      textarea {
        resize: vertical;
      }
      input::-moz-placeholder,
      textarea::-moz-placeholder {
        opacity: 1;
        color: #9ca3af;
      }
      input::placeholder,
      textarea::placeholder {
        opacity: 1;
        color: #9ca3af;
      }
      button,
      [role="button"] {
        cursor: pointer;
      }
      :disabled {
        cursor: default;
      }
      img,
      svg,
      video,
      canvas,
      audio,
      iframe,
      embed,
      object {
        display: block;
        vertical-align: middle;
      }
      img,
      video {
        max-width: 100%;
        height: auto;
      }
      [hidden]:where(:not([hidden="until-found"])) {
        display: none;
      }
      .pointer-events-none {
        pointer-events: none;
      }
      .pointer-events-auto {
        pointer-events: auto;
      }
      .visible {
        visibility: visible;
      }
      .static {
        position: static;
      }
      .fixed {
        position: fixed;
      }
      .absolute {
        position: absolute;
      }
      .relative {
        position: relative;
      }
      .sticky {
        position: sticky;
      }
      .inset-0 {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
      }
      .inset-2 {
        top: 0.5rem;
        right: 0.5rem;
        bottom: 0.5rem;
        left: 0.5rem;
      }
      .inset-3 {
        top: 0.75rem;
        right: 0.75rem;
        bottom: 0.75rem;
        left: 0.75rem;
      }
      .inset-y-0 {
        top: 0;
        bottom: 0;
      }
      .-left-\[31px\] {
        left: -31px;
      }
      .-right-1 {
        right: -0.25rem;
      }
      .-top-1 {
        top: -0.25rem;
      }
      .bottom-0 {
        bottom: 0;
      }
      .bottom-2 {
        bottom: 0.5rem;
      }
      .bottom-2\.5 {
        bottom: 0.625rem;
      }
      .bottom-6 {
        bottom: 1.5rem;
      }
      .bottom-8 {
        bottom: 2rem;
      }
      .bottom-full {
        bottom: 100%;
      }
      .left-0 {
        left: 0;
      }
      .left-1\/2 {
        left: 50%;
      }
      .left-2 {
        left: 0.5rem;
      }
      .left-2\.5 {
        left: 0.625rem;
      }
      .left-4 {
        left: 1rem;
      }
      .left-\[11px\] {
        left: 11px;
      }
      .right-0 {
        right: 0;
      }
      .right-2 {
        right: 0.5rem;
      }
      .right-2\.5 {
        right: 0.625rem;
      }
      .right-4 {
        right: 1rem;
      }
      .right-6 {
        right: 1.5rem;
      }
      .top-0 {
        top: 0;
      }
      .top-1 {
        top: 0.25rem;
      }
      .top-1\/2 {
        top: 50%;
      }
      .top-2 {
        top: 0.5rem;
      }
      .top-2\.5 {
        top: 0.625rem;
      }
      .top-24 {
        top: 6rem;
      }
      .top-4 {
        top: 1rem;
      }
      .top-6 {
        top: 1.5rem;
      }
      .top-full {
        top: 100%;
      }
      .z-0 {
        z-index: 0;
      }
      .z-10 {
        z-index: 10;
      }
      .z-20 {
        z-index: 20;
      }
      .z-40 {
        z-index: 40;
      }
      .z-50 {
        z-index: 50;
      }
      .z-\[100\] {
        z-index: 100;
      }
      .z-\[1\] {
        z-index: 1;
      }
      .z-\[200\] {
        z-index: 200;
      }
      .z-\[60\] {
        z-index: 60;
      }
      .z-\[78\] {
        z-index: 78;
      }
      .z-\[80\] {
        z-index: 80;
      }
      .z-\[90\] {
        z-index: 90;
      }
      .z-\[95\] {
        z-index: 95;
      }
      .z-\[96\] {
        z-index: 96;
      }
      .-mx-4 {
        margin-left: -1rem;
        margin-right: -1rem;
      }
      .mx-auto {
        margin-left: auto;
        margin-right: auto;
      }
      .my-auto {
        margin-top: auto;
        margin-bottom: auto;
      }
      .mb-1 {
        margin-bottom: 0.25rem;
      }
      .mb-1\.5 {
        margin-bottom: 0.375rem;
      }
      .mb-10 {
        margin-bottom: 2.5rem;
      }
      .mb-12 {
        margin-bottom: 3rem;
      }
      .mb-16 {
        margin-bottom: 4rem;
      }
      .mb-2 {
        margin-bottom: 0.5rem;
      }
      .mb-3 {
        margin-bottom: 0.75rem;
      }
      .mb-4 {
        margin-bottom: 1rem;
      }
      .mb-6 {
        margin-bottom: 1.5rem;
      }
      .mb-8 {
        margin-bottom: 2rem;
      }
      .ml-0\.5 {
        margin-left: 0.125rem;
      }
      .ml-1 {
        margin-left: 0.25rem;
      }
      .ml-2 {
        margin-left: 0.5rem;
      }
      .ml-3 {
        margin-left: 0.75rem;
      }
      .ml-4 {
        margin-left: 1rem;
      }
      .ml-auto {
        margin-left: auto;
      }
      .mr-0\.5 {
        margin-right: 0.125rem;
      }
      .mr-2 {
        margin-right: 0.5rem;
      }
      .mr-2\.5 {
        margin-right: 0.625rem;
      }
      .mt-0\.5 {
        margin-top: 0.125rem;
      }
      .mt-1 {
        margin-top: 0.25rem;
      }
      .mt-1\.5 {
        margin-top: 0.375rem;
      }
      .mt-10 {
        margin-top: 2.5rem;
      }
      .mt-12 {
        margin-top: 3rem;
      }
      .mt-2 {
        margin-top: 0.5rem;
      }
      .mt-2\.5 {
        margin-top: 0.625rem;
      }
      .mt-20 {
        margin-top: 5rem;
      }
      .mt-3 {
        margin-top: 0.75rem;
      }
      .mt-4 {
        margin-top: 1rem;
      }
      .mt-5 {
        margin-top: 1.25rem;
      }
      .mt-6 {
        margin-top: 1.5rem;
      }
      .mt-8 {
        margin-top: 2rem;
      }
      .mt-auto {
        margin-top: auto;
      }
      .line-clamp-1 {
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
      }
      .line-clamp-2 {
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
      }
      .line-clamp-6 {
        overflow: hidden;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 6;
      }
      .block {
        display: block;
      }
      .inline-block {
        display: inline-block;
      }
      .inline {
        display: inline;
      }
      .flex {
        display: flex;
      }
      .inline-flex {
        display: inline-flex;
      }
      .grid {
        display: grid;
      }
      .\!hidden {
        display: none !important;
      }
      .hidden {
        display: none;
      }
      .aspect-\[2\/3\] {
        aspect-ratio: 2/3;
      }
      .aspect-\[3\/4\] {
        aspect-ratio: 3/4;
      }
      .aspect-\[4\/3\] {
        aspect-ratio: 4/3;
      }
      .aspect-\[4\/5\] {
        aspect-ratio: 4/5;
      }
      .aspect-video {
        aspect-ratio: 16 / 9;
      }
      .\!h-\[22px\] {
        height: 22px !important;
      }
      .h-1 {
        height: 0.25rem;
      }
      .h-1\.5 {
        height: 0.375rem;
      }
      .h-10 {
        height: 2.5rem;
      }
      .h-11 {
        height: 2.75rem;
      }
      .h-12 {
        height: 3rem;
      }
      .h-14 {
        height: 3.5rem;
      }
      .h-16 {
        height: 4rem;
      }
      .h-2 {
        height: 0.5rem;
      }
      .h-2\.5 {
        height: 0.625rem;
      }
      .h-20 {
        height: 5rem;
      }
      .h-28 {
        height: 7rem;
      }
      .h-3 {
        height: 0.75rem;
      }
      .h-3\.5 {
        height: 0.875rem;
      }
      .h-4 {
        height: 1rem;
      }
      .h-48 {
        height: 12rem;
      }
      .h-5 {
        height: 1.25rem;
      }
      .h-6 {
        height: 1.5rem;
      }
      .h-8 {
        height: 2rem;
      }
      .h-80 {
        height: 20rem;
      }
      .h-96 {
        height: 24rem;
      }
      .h-\[1\.5px\] {
        height: 1.5px;
      }
      .h-\[100px\] {
        height: 100px;
      }
      .h-\[1em\] {
        height: 1em;
      }
      .h-\[23px\] {
        height: 23px;
      }
      .h-\[24px\] {
        height: 24px;
      }
      .h-\[260vh\] {
        height: 260vh;
      }
      .h-\[min\(560px\,80vh\)\] {
        height: min(560px, 80vh);
      }
      .h-full {
        height: 100%;
      }
      .h-px {
        height: 1px;
      }
      .h-screen {
        height: 100vh;
      }
      .max-h-28 {
        max-height: 7rem;
      }
      .max-h-40 {
        max-height: 10rem;
      }
      .max-h-\[50vh\] {
        max-height: 50vh;
      }
      .max-h-\[55vh\] {
        max-height: 55vh;
      }
      .max-h-full {
        max-height: 100%;
      }
      .\!min-h-0 {
        min-height: 0px !important;
      }
      .min-h-0 {
        min-height: 0px;
      }
      .min-h-\[110px\] {
        min-height: 110px;
      }
      .min-h-\[160px\] {
        min-height: 160px;
      }
      .min-h-\[2\.5em\] {
        min-height: 2.5em;
      }
      .min-h-\[70vh\] {
        min-height: 70vh;
      }
      .min-h-\[90vh\] {
        min-height: 90vh;
      }
      .min-h-screen {
        min-height: 100vh;
      }
      .w-1\.5 {
        width: 0.375rem;
      }
      .w-10 {
        width: 2.5rem;
      }
      .w-11 {
        width: 2.75rem;
      }
      .w-12 {
        width: 3rem;
      }
      .w-14 {
        width: 3.5rem;
      }
      .w-16 {
        width: 4rem;
      }
      .w-2 {
        width: 0.5rem;
      }
      .w-2\.5 {
        width: 0.625rem;
      }
      .w-20 {
        width: 5rem;
      }
      .w-28 {
        width: 7rem;
      }
      .w-3 {
        width: 0.75rem;
      }
      .w-3\.5 {
        width: 0.875rem;
      }
      .w-32 {
        width: 8rem;
      }
      .w-4 {
        width: 1rem;
      }
      .w-5 {
        width: 1.25rem;
      }
      .w-56 {
        width: 14rem;
      }
      .w-6 {
        width: 1.5rem;
      }
      .w-8 {
        width: 2rem;
      }
      .w-9 {
        width: 2.25rem;
      }
      .w-\[0\.5em\] {
        width: 0.5em;
      }
      .w-\[1\.5px\] {
        width: 1.5px;
      }
      .w-\[23px\] {
        width: 23px;
      }
      .w-\[24px\] {
        width: 24px;
      }
      .w-\[94vw\] {
        width: 94vw;
      }
      .w-auto {
        width: auto;
      }
      .w-full {
        width: 100%;
      }
      .w-max {
        width: -moz-max-content;
        width: max-content;
      }
      .w-px {
        width: 1px;
      }
      .\!min-w-\[22px\] {
        min-width: 22px !important;
      }
      .min-w-0 {
        min-width: 0px;
      }
      .min-w-\[190px\] {
        min-width: 190px;
      }
      .max-w-2xl {
        max-width: 42rem;
      }
      .max-w-3xl {
        max-width: 48rem;
      }
      .max-w-4xl {
        max-width: 56rem;
      }
      .max-w-5xl {
        max-width: 64rem;
      }
      .max-w-6xl {
        max-width: 72rem;
      }
      .max-w-7xl {
        max-width: 80rem;
      }
      .max-w-\[90\%\] {
        max-width: 90%;
      }
      .max-w-full {
        max-width: 100%;
      }
      .max-w-md {
        max-width: 28rem;
      }
      .max-w-none {
        max-width: none;
      }
      .max-w-sm {
        max-width: 24rem;
      }
      .max-w-xl {
        max-width: 36rem;
      }
      .max-w-xs {
        max-width: 20rem;
      }
      .flex-1 {
        flex: 1 1 0%;
      }
      .shrink {
        flex-shrink: 1;
      }
      .shrink-0 {
        flex-shrink: 0;
      }
      .grow {
        flex-grow: 1;
      }
      .-translate-x-1\/2 {
        --tw-translate-x: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .-translate-y-1 {
        --tw-translate-y: -0.25rem;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .-translate-y-1\/2 {
        --tw-translate-y: -50%;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .translate-x-1 {
        --tw-translate-x: 0.25rem;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .rotate-180 {
        --tw-rotate: 180deg;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .rotate-45 {
        --tw-rotate: 45deg;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .rotate-90 {
        --tw-rotate: 90deg;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .scale-100 {
        --tw-scale-x: 1;
        --tw-scale-y: 1;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .scale-105 {
        --tw-scale-x: 1.05;
        --tw-scale-y: 1.05;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .scale-110 {
        --tw-scale-x: 1.1;
        --tw-scale-y: 1.1;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .transform {
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      @keyframes bounce {
        0%,
        to {
          transform: translateY(-25%);
          animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
        }
        50% {
          transform: none;
          animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
        }
      }
      .animate-bounce {
        animation: bounce 1s infinite;
      }
      @keyframes ping {
        75%,
        to {
          transform: scale(2);
          opacity: 0;
        }
      }
      .animate-ping {
        animation: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
      }
      @keyframes pulse {
        50% {
          opacity: 0.5;
        }
      }
      .animate-pulse {
        animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
      }
      @keyframes spin {
        to {
          transform: rotate(360deg);
        }
      }
      .animate-spin {
        animation: spin 1s linear infinite;
      }
      .cursor-pointer {
        cursor: pointer;
      }
      .select-none {
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
      }
      .resize {
        resize: both;
      }
      .appearance-none {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
      }
      .columns-2 {
        -moz-columns: 2;
        columns: 2;
      }
      .break-inside-avoid {
        -moz-column-break-inside: avoid;
        break-inside: avoid;
      }
      .grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
      }
      .grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
      }
      .grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
      }
      .flex-col {
        flex-direction: column;
      }
      .flex-wrap {
        flex-wrap: wrap;
      }
      .items-start {
        align-items: flex-start;
      }
      .items-end {
        align-items: flex-end;
      }
      .items-center {
        align-items: center;
      }
      .items-baseline {
        align-items: baseline;
      }
      .justify-center {
        justify-content: center;
      }
      .justify-between {
        justify-content: space-between;
      }
      .gap-1 {
        gap: 0.25rem;
      }
      .gap-1\.5 {
        gap: 0.375rem;
      }
      .gap-2 {
        gap: 0.5rem;
      }
      .gap-3 {
        gap: 0.75rem;
      }
      .gap-4 {
        gap: 1rem;
      }
      .gap-5 {
        gap: 1.25rem;
      }
      .gap-6 {
        gap: 1.5rem;
      }
      .gap-8 {
        gap: 2rem;
      }
      .gap-x-3 {
        -moz-column-gap: 0.75rem;
        column-gap: 0.75rem;
      }
      .gap-x-4 {
        -moz-column-gap: 1rem;
        column-gap: 1rem;
      }
      .gap-x-5 {
        -moz-column-gap: 1.25rem;
        column-gap: 1.25rem;
      }
      .gap-y-0\.5 {
        row-gap: 0.125rem;
      }
      .gap-y-1 {
        row-gap: 0.25rem;
      }
      .space-x-0\.5 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(0.125rem * var(--tw-space-x-reverse));
        margin-left: calc(0.125rem * calc(1 - var(--tw-space-x-reverse)));
      }
      .space-x-1 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(0.25rem * var(--tw-space-x-reverse));
        margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
      }
      .space-x-1\.5 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(0.375rem * var(--tw-space-x-reverse));
        margin-left: calc(0.375rem * calc(1 - var(--tw-space-x-reverse)));
      }
      .space-x-2 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(0.5rem * var(--tw-space-x-reverse));
        margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
      }
      .space-x-3 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(0.75rem * var(--tw-space-x-reverse));
        margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
      }
      .space-x-4 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(1rem * var(--tw-space-x-reverse));
        margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
      }
      .space-y-0\.5 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.125rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.125rem * var(--tw-space-y-reverse));
      }
      .space-y-1 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
      }
      .space-y-1\.5 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.375rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.375rem * var(--tw-space-y-reverse));
      }
      .space-y-2 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
      }
      .space-y-2\.5 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.625rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.625rem * var(--tw-space-y-reverse));
      }
      .space-y-20 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(5rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(5rem * var(--tw-space-y-reverse));
      }
      .space-y-3 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
      }
      .space-y-4 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(1rem * var(--tw-space-y-reverse));
      }
      .space-y-6 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
      }
      .space-y-8 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(2rem * var(--tw-space-y-reverse));
      }
      .self-start {
        align-self: flex-start;
      }
      .self-center {
        align-self: center;
      }
      .overflow-auto {
        overflow: auto;
      }
      .overflow-hidden {
        overflow: hidden;
      }
      .overflow-x-auto {
        overflow-x: auto;
      }
      .overflow-y-auto {
        overflow-y: auto;
      }
      .overflow-x-hidden {
        overflow-x: hidden;
      }
      .overflow-x-clip {
        overflow-x: clip;
      }
      .truncate {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
      .whitespace-nowrap {
        white-space: nowrap;
      }
      .whitespace-pre-wrap {
        white-space: pre-wrap;
      }
      .break-words {
        overflow-wrap: break-word;
      }
      .break-all {
        word-break: break-all;
      }
      .\!rounded-none {
        border-radius: 0 !important;
      }
      .rounded {
        border-radius: 0.25rem;
      }
      .rounded-2xl {
        border-radius: 1rem;
      }
      .rounded-3xl {
        border-radius: 1.5rem;
      }
      .rounded-full {
        border-radius: 9999px;
      }
      .rounded-lg {
        border-radius: 0.5rem;
      }
      .rounded-md {
        border-radius: 0.375rem;
      }
      .rounded-xl {
        border-radius: 0.75rem;
      }
      .rounded-t-sm {
        border-top-left-radius: 0.125rem;
        border-top-right-radius: 0.125rem;
      }
      .border {
        border-width: 1px;
      }
      .border-2 {
        border-width: 2px;
      }
      .border-b {
        border-bottom-width: 1px;
      }
      .border-l {
        border-left-width: 1px;
      }
      .border-r {
        border-right-width: 1px;
      }
      .border-t {
        border-top-width: 1px;
      }
      .border-\[var\(--theme-accent\)\] {
        border-color: var(--theme-accent);
      }
      .border-amber-500\/40 {
        border-color: #f59e0b66;
      }
      .border-black\/40 {
        border-color: #0006;
      }
      .border-cyan-400 {
        --tw-border-opacity: 1;
        border-color: rgb(34 211 238 / var(--tw-border-opacity, 1));
      }
      .border-cyan-400\/40 {
        border-color: #22d3ee66;
      }
      .border-cyan-400\/50 {
        border-color: #22d3ee80;
      }
      .border-cyan-500\/30 {
        border-color: #06b6d44d;
      }
      .border-cyan-500\/40 {
        border-color: #06b6d466;
      }
      .border-cyan-800\/40 {
        border-color: #155e7566;
      }
      .border-emerald-500\/40 {
        border-color: #10b98166;
      }
      .border-emerald-800\/30 {
        border-color: #065f464d;
      }
      .border-emerald-800\/40 {
        border-color: #065f4666;
      }
      .border-green-500 {
        --tw-border-opacity: 1;
        border-color: rgb(34 197 94 / var(--tw-border-opacity, 1));
      }
      .border-green-500\/30 {
        border-color: #22c55e4d;
      }
      .border-neutral-700 {
        --tw-border-opacity: 1;
        border-color: rgb(64 64 64 / var(--tw-border-opacity, 1));
      }
      .border-orange-500\/40 {
        border-color: #f9731666;
      }
      .border-red-400 {
        --tw-border-opacity: 1;
        border-color: rgb(248 113 113 / var(--tw-border-opacity, 1));
      }
      .border-red-500\/30 {
        border-color: #ef44444d;
      }
      .border-red-500\/50 {
        border-color: #ef444480;
      }
      .border-transparent {
        border-color: transparent;
      }
      .border-white {
        --tw-border-opacity: 1;
        border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
      }
      .border-white\/10 {
        border-color: #ffffff1a;
      }
      .border-white\/15 {
        border-color: #ffffff26;
      }
      .border-white\/20 {
        border-color: #fff3;
      }
      .border-white\/40 {
        border-color: #fff6;
      }
      .border-white\/5 {
        border-color: #ffffff0d;
      }
      .bg-\[\#020202\] {
        --tw-bg-opacity: 1;
        background-color: rgb(2 2 2 / var(--tw-bg-opacity, 1));
      }
      .bg-\[\#050505\] {
        --tw-bg-opacity: 1;
        background-color: rgb(5 5 5 / var(--tw-bg-opacity, 1));
      }
      .bg-\[\#060606\] {
        --tw-bg-opacity: 1;
        background-color: rgb(6 6 6 / var(--tw-bg-opacity, 1));
      }
      .bg-\[\#080808\] {
        --tw-bg-opacity: 1;
        background-color: rgb(8 8 8 / var(--tw-bg-opacity, 1));
      }
      .bg-\[\#080808\]\/95 {
        background-color: #080808f2;
      }
      .bg-\[\#090909\] {
        --tw-bg-opacity: 1;
        background-color: rgb(9 9 9 / var(--tw-bg-opacity, 1));
      }
      .bg-\[\#0a0a0a\] {
        --tw-bg-opacity: 1;
        background-color: rgb(10 10 10 / var(--tw-bg-opacity, 1));
      }
      .bg-\[var\(--theme-accent\)\] {
        background-color: var(--theme-accent);
      }
      .bg-amber-500\/20 {
        background-color: #f59e0b33;
      }
      .bg-black {
        --tw-bg-opacity: 1;
        background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
      }
      .bg-black\/30 {
        background-color: #0000004d;
      }
      .bg-black\/40 {
        background-color: #0006;
      }
      .bg-black\/50 {
        background-color: #00000080;
      }
      .bg-black\/60 {
        background-color: #0009;
      }
      .bg-black\/70 {
        background-color: #000000b3;
      }
      .bg-black\/80 {
        background-color: #000c;
      }
      .bg-black\/85 {
        background-color: #000000d9;
      }
      .bg-black\/90 {
        background-color: #000000e6;
      }
      .bg-cyan-400 {
        --tw-bg-opacity: 1;
        background-color: rgb(34 211 238 / var(--tw-bg-opacity, 1));
      }
      .bg-cyan-500\/10 {
        background-color: #06b6d41a;
      }
      .bg-cyan-500\/20 {
        background-color: #06b6d433;
      }
      .bg-cyan-600\/30 {
        background-color: #0891b24d;
      }
      .bg-cyan-950\/20 {
        background-color: #08334433;
      }
      .bg-cyan-950\/60 {
        background-color: #08334499;
      }
      .bg-cyan-950\/80 {
        background-color: #083344cc;
      }
      .bg-emerald-400 {
        --tw-bg-opacity: 1;
        background-color: rgb(52 211 153 / var(--tw-bg-opacity, 1));
      }
      .bg-emerald-500\/20 {
        background-color: #10b98133;
      }
      .bg-emerald-500\/80 {
        background-color: #10b981cc;
      }
      .bg-emerald-950\/20 {
        background-color: #022c2233;
      }
      .bg-emerald-950\/80 {
        background-color: #022c22cc;
      }
      .bg-green-500\/10 {
        background-color: #22c55e1a;
      }
      .bg-neutral-800 {
        --tw-bg-opacity: 1;
        background-color: rgb(38 38 38 / var(--tw-bg-opacity, 1));
      }
      .bg-neutral-900 {
        --tw-bg-opacity: 1;
        background-color: rgb(23 23 23 / var(--tw-bg-opacity, 1));
      }
      .bg-neutral-950\/60 {
        background-color: #0a0a0a99;
      }
      .bg-red-500\/10 {
        background-color: #ef44441a;
      }
      .bg-red-500\/80 {
        background-color: #ef4444cc;
      }
      .bg-transparent {
        background-color: transparent;
      }
      .bg-white {
        --tw-bg-opacity: 1;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
      }
      .bg-white\/10 {
        background-color: #ffffff1a;
      }
      .bg-white\/15 {
        background-color: #ffffff26;
      }
      .bg-white\/20 {
        background-color: #fff3;
      }
      .bg-white\/5 {
        background-color: #ffffff0d;
      }
      .bg-white\/\[0\.04\] {
        background-color: #ffffff0a;
      }
      .bg-yellow-500\/80 {
        background-color: #eab308cc;
      }
      .bg-\[url\(\'https\:\/\/upload\.wikimedia\.org\/wikipedia\/commons\/e\/e0\/Matrix_code\.jpg\'\)\] {
        background-image: url(https://upload.wikimedia.org/wikipedia/commons/e/e0/Matrix_code.jpg);
      }
      .bg-gradient-to-b {
        background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
      }
      .bg-gradient-to-br {
        background-image: linear-gradient(
          to bottom right,
          var(--tw-gradient-stops)
        );
      }
      .bg-gradient-to-t {
        background-image: linear-gradient(to top, var(--tw-gradient-stops));
      }
      .from-\[var\(--theme-accent\)\] {
        --tw-gradient-from: var(--theme-accent) var(--tw-gradient-from-position);
        --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
        --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
      }
      .from-black\/80 {
        --tw-gradient-from: rgb(0 0 0 / 0.8) var(--tw-gradient-from-position);
        --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
        --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
      }
      .from-white\/\[0\.06\] {
        --tw-gradient-from: rgb(255 255 255 / 0.06)
          var(--tw-gradient-from-position);
        --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
        --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
      }
      .via-white\/15 {
        --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
        --tw-gradient-stops:
          var(--tw-gradient-from),
          rgb(255 255 255 / 0.15) var(--tw-gradient-via-position),
          var(--tw-gradient-to);
      }
      .to-transparent {
        --tw-gradient-to: transparent var(--tw-gradient-to-position);
      }
      .bg-cover {
        background-size: cover;
      }
      .fill-current {
        fill: currentColor;
      }
      .object-contain {
        -o-object-fit: contain;
        object-fit: contain;
      }
      .object-cover {
        -o-object-fit: cover;
        object-fit: cover;
      }
      .\!p-0 {
        padding: 0 !important;
      }
      .\!p-5 {
        padding: 1.25rem !important;
      }
      .\!p-8 {
        padding: 2rem !important;
      }
      .p-1 {
        padding: 0.25rem;
      }
      .p-1\.5 {
        padding: 0.375rem;
      }
      .p-2 {
        padding: 0.5rem;
      }
      .p-2\.5 {
        padding: 0.625rem;
      }
      .p-3 {
        padding: 0.75rem;
      }
      .p-3\.5 {
        padding: 0.875rem;
      }
      .p-4 {
        padding: 1rem;
      }
      .p-5 {
        padding: 1.25rem;
      }
      .p-6 {
        padding: 1.5rem;
      }
      .p-\[22\%\] {
        padding: 22%;
      }
      .px-0\.5 {
        padding-left: 0.125rem;
        padding-right: 0.125rem;
      }
      .px-1 {
        padding-left: 0.25rem;
        padding-right: 0.25rem;
      }
      .px-1\.5 {
        padding-left: 0.375rem;
        padding-right: 0.375rem;
      }
      .px-2 {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
      }
      .px-2\.5 {
        padding-left: 0.625rem;
        padding-right: 0.625rem;
      }
      .px-3 {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
      }
      .px-3\.5 {
        padding-left: 0.875rem;
        padding-right: 0.875rem;
      }
      .px-4 {
        padding-left: 1rem;
        padding-right: 1rem;
      }
      .px-5 {
        padding-left: 1.25rem;
        padding-right: 1.25rem;
      }
      .px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
      }
      .py-0\.5 {
        padding-top: 0.125rem;
        padding-bottom: 0.125rem;
      }
      .py-1 {
        padding-top: 0.25rem;
        padding-bottom: 0.25rem;
      }
      .py-1\.5 {
        padding-top: 0.375rem;
        padding-bottom: 0.375rem;
      }
      .py-12 {
        padding-top: 3rem;
        padding-bottom: 3rem;
      }
      .py-16 {
        padding-top: 4rem;
        padding-bottom: 4rem;
      }
      .py-2 {
        padding-top: 0.5rem;
        padding-bottom: 0.5rem;
      }
      .py-2\.5 {
        padding-top: 0.625rem;
        padding-bottom: 0.625rem;
      }
      .py-20 {
        padding-top: 5rem;
        padding-bottom: 5rem;
      }
      .py-24 {
        padding-top: 6rem;
        padding-bottom: 6rem;
      }
      .py-3 {
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
      }
      .py-3\.5 {
        padding-top: 0.875rem;
        padding-bottom: 0.875rem;
      }
      .py-4 {
        padding-top: 1rem;
        padding-bottom: 1rem;
      }
      .py-6 {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
      }
      .py-8 {
        padding-top: 2rem;
        padding-bottom: 2rem;
      }
      .\!pb-0 {
        padding-bottom: 0 !important;
      }
      .pb-16 {
        padding-bottom: 4rem;
      }
      .pb-28 {
        padding-bottom: 7rem;
      }
      .pb-3 {
        padding-bottom: 0.75rem;
      }
      .pb-4 {
        padding-bottom: 1rem;
      }
      .pb-6 {
        padding-bottom: 1.5rem;
      }
      .pl-1 {
        padding-left: 0.25rem;
      }
      .pl-10 {
        padding-left: 2.5rem;
      }
      .pl-2 {
        padding-left: 0.5rem;
      }
      .pl-6 {
        padding-left: 1.5rem;
      }
      .pr-2 {
        padding-right: 0.5rem;
      }
      .pr-20 {
        padding-right: 5rem;
      }
      .pt-1 {
        padding-top: 0.25rem;
      }
      .pt-10 {
        padding-top: 2.5rem;
      }
      .pt-2 {
        padding-top: 0.5rem;
      }
      .pt-20 {
        padding-top: 5rem;
      }
      .pt-28 {
        padding-top: 7rem;
      }
      .pt-4 {
        padding-top: 1rem;
      }
      .pt-6 {
        padding-top: 1.5rem;
      }
      .text-left {
        text-align: left;
      }
      .text-center {
        text-align: center;
      }
      .text-right {
        text-align: right;
      }
      .align-middle {
        vertical-align: middle;
      }
      .font-\[Vazirmatn\,Tahoma\,sans-serif\] {
        font-family: Vazirmatn, Tahoma, sans-serif;
      }
      .font-display {
        font-family:
          Bebas Neue,
          Oxanium,
          sans-serif;
      }
      .font-mono {
        font-family:
          Share Tech Mono,
          Oxanium,
          monospace;
      }
      .font-sans {
        font-family: Barlow, Inter, sans-serif;
      }
      .font-serif {
        font-family:
          ui-serif,
          Georgia,
          Cambria,
          Times New Roman,
          Times,
          serif;
      }
      .text-2xl {
        font-size: 1.5rem;
        line-height: 2rem;
      }
      .text-3xl {
        font-size: 1.875rem;
        line-height: 2.25rem;
      }
      .text-4xl {
        font-size: 2.25rem;
        line-height: 2.5rem;
      }
      .text-5xl {
        font-size: 3rem;
        line-height: 1;
      }
      .text-6xl {
        font-size: 3.75rem;
        line-height: 1;
      }
      .text-\[10px\] {
        font-size: 10px;
      }
      .text-\[11px\] {
        font-size: 11px;
      }
      .text-\[12px\] {
        font-size: 12px;
      }
      .text-\[8\.5px\] {
        font-size: 8.5px;
      }
      .text-\[8px\] {
        font-size: 8px;
      }
      .text-\[9px\] {
        font-size: 9px;
      }
      .text-base {
        font-size: 1rem;
        line-height: 1.5rem;
      }
      .text-lg {
        font-size: 1.125rem;
        line-height: 1.75rem;
      }
      .text-sm {
        font-size: 0.875rem;
        line-height: 1.25rem;
      }
      .text-xl {
        font-size: 1.25rem;
        line-height: 1.75rem;
      }
      .text-xs {
        font-size: 0.75rem;
        line-height: 1rem;
      }
      .font-bold {
        font-weight: 700;
      }
      .font-light {
        font-weight: 300;
      }
      .font-medium {
        font-weight: 500;
      }
      .font-normal {
        font-weight: 400;
      }
      .font-semibold {
        font-weight: 600;
      }
      .uppercase {
        text-transform: uppercase;
      }
      .normal-case {
        text-transform: none;
      }
      .italic {
        font-style: italic;
      }
      .leading-\[0\.85\] {
        line-height: 0.85;
      }
      .leading-\[0\.9\] {
        line-height: 0.9;
      }
      .leading-none {
        line-height: 1;
      }
      .leading-relaxed {
        line-height: 1.625;
      }
      .leading-snug {
        line-height: 1.375;
      }
      .leading-tight {
        line-height: 1.25;
      }
      .tracking-\[0\.22em\] {
        letter-spacing: 0.22em;
      }
      .tracking-\[0\.25em\] {
        letter-spacing: 0.25em;
      }
      .tracking-\[0\.26em\] {
        letter-spacing: 0.26em;
      }
      .tracking-\[0\.2em\] {
        letter-spacing: 0.2em;
      }
      .tracking-\[0\.35em\] {
        letter-spacing: 0.35em;
      }
      .tracking-\[0\.3em\] {
        letter-spacing: 0.3em;
      }
      .tracking-\[0\.4em\] {
        letter-spacing: 0.4em;
      }
      .tracking-normal {
        letter-spacing: 0em;
      }
      .tracking-tight {
        letter-spacing: -0.025em;
      }
      .tracking-wide {
        letter-spacing: 0.025em;
      }
      .tracking-wider {
        letter-spacing: 0.05em;
      }
      .tracking-widest {
        letter-spacing: 0.1em;
      }
      .text-\[\#d5d5d5\] {
        --tw-text-opacity: 1;
        color: rgb(213 213 213 / var(--tw-text-opacity, 1));
      }
      .text-\[var\(--term-accent\)\] {
        color: var(--term-accent);
      }
      .text-\[var\(--theme-accent\)\] {
        color: var(--theme-accent);
      }
      .text-amber-200\/80 {
        color: #fde68acc;
      }
      .text-amber-300 {
        --tw-text-opacity: 1;
        color: rgb(252 211 77 / var(--tw-text-opacity, 1));
      }
      .text-amber-300\/70 {
        color: #fcd34db3;
      }
      .text-amber-400 {
        --tw-text-opacity: 1;
        color: rgb(251 191 36 / var(--tw-text-opacity, 1));
      }
      .text-black {
        --tw-text-opacity: 1;
        color: rgb(0 0 0 / var(--tw-text-opacity, 1));
      }
      .text-black\/50 {
        color: #00000080;
      }
      .text-cyan-100 {
        --tw-text-opacity: 1;
        color: rgb(207 250 254 / var(--tw-text-opacity, 1));
      }
      .text-cyan-300 {
        --tw-text-opacity: 1;
        color: rgb(103 232 249 / var(--tw-text-opacity, 1));
      }
      .text-cyan-400 {
        --tw-text-opacity: 1;
        color: rgb(34 211 238 / var(--tw-text-opacity, 1));
      }
      .text-cyan-500 {
        --tw-text-opacity: 1;
        color: rgb(6 182 212 / var(--tw-text-opacity, 1));
      }
      .text-emerald-300 {
        --tw-text-opacity: 1;
        color: rgb(110 231 183 / var(--tw-text-opacity, 1));
      }
      .text-emerald-400 {
        --tw-text-opacity: 1;
        color: rgb(52 211 153 / var(--tw-text-opacity, 1));
      }
      .text-green-400 {
        --tw-text-opacity: 1;
        color: rgb(74 222 128 / var(--tw-text-opacity, 1));
      }
      .text-neutral-100 {
        --tw-text-opacity: 1;
        color: rgb(245 245 245 / var(--tw-text-opacity, 1));
      }
      .text-neutral-200 {
        --tw-text-opacity: 1;
        color: rgb(229 229 229 / var(--tw-text-opacity, 1));
      }
      .text-neutral-300 {
        --tw-text-opacity: 1;
        color: rgb(212 212 212 / var(--tw-text-opacity, 1));
      }
      .text-neutral-400 {
        --tw-text-opacity: 1;
        color: rgb(163 163 163 / var(--tw-text-opacity, 1));
      }
      .text-neutral-500 {
        --tw-text-opacity: 1;
        color: rgb(115 115 115 / var(--tw-text-opacity, 1));
      }
      .text-neutral-600 {
        --tw-text-opacity: 1;
        color: rgb(82 82 82 / var(--tw-text-opacity, 1));
      }
      .text-orange-400 {
        --tw-text-opacity: 1;
        color: rgb(251 146 60 / var(--tw-text-opacity, 1));
      }
      .text-red-400 {
        --tw-text-opacity: 1;
        color: rgb(248 113 113 / var(--tw-text-opacity, 1));
      }
      .text-red-500 {
        --tw-text-opacity: 1;
        color: rgb(239 68 68 / var(--tw-text-opacity, 1));
      }
      .text-sky-300 {
        --tw-text-opacity: 1;
        color: rgb(125 211 252 / var(--tw-text-opacity, 1));
      }
      .text-transparent {
        color: transparent;
      }
      .text-white {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
      }
      .text-white\/70 {
        color: #ffffffb3;
      }
      .antialiased {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
      }
      .placeholder-green-800::-moz-placeholder {
        --tw-placeholder-opacity: 1;
        color: rgb(22 101 52 / var(--tw-placeholder-opacity, 1));
      }
      .placeholder-green-800::placeholder {
        --tw-placeholder-opacity: 1;
        color: rgb(22 101 52 / var(--tw-placeholder-opacity, 1));
      }
      .placeholder-neutral-500::-moz-placeholder {
        --tw-placeholder-opacity: 1;
        color: rgb(115 115 115 / var(--tw-placeholder-opacity, 1));
      }
      .placeholder-neutral-500::placeholder {
        --tw-placeholder-opacity: 1;
        color: rgb(115 115 115 / var(--tw-placeholder-opacity, 1));
      }
      .placeholder-neutral-600::-moz-placeholder {
        --tw-placeholder-opacity: 1;
        color: rgb(82 82 82 / var(--tw-placeholder-opacity, 1));
      }
      .placeholder-neutral-600::placeholder {
        --tw-placeholder-opacity: 1;
        color: rgb(82 82 82 / var(--tw-placeholder-opacity, 1));
      }
      .accent-\[var\(--theme-accent\)\] {
        accent-color: var(--theme-accent);
      }
      .accent-cyan-400 {
        accent-color: #22d3ee;
      }
      .opacity-0 {
        opacity: 0;
      }
      .opacity-100 {
        opacity: 1;
      }
      .opacity-20 {
        opacity: 0.2;
      }
      .opacity-30 {
        opacity: 0.3;
      }
      .opacity-50 {
        opacity: 0.5;
      }
      .opacity-60 {
        opacity: 0.6;
      }
      .opacity-70 {
        opacity: 0.7;
      }
      .opacity-80 {
        opacity: 0.8;
      }
      .opacity-90 {
        opacity: 0.9;
      }
      .mix-blend-screen {
        mix-blend-mode: screen;
      }
      .shadow {
        --tw-shadow:
          0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
        --tw-shadow-colored:
          0 1px 3px 0 var(--tw-shadow-color),
          0 1px 2px -1px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-2xl {
        --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
        --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-\[-10px_0_50px_rgba\(0\,0\,0\,0\.8\)\] {
        --tw-shadow: -10px 0 50px rgba(0, 0, 0, 0.8);
        --tw-shadow-colored: -10px 0 50px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-\[-20px_0_50px_rgba\(0\,0\,0\,0\.8\)\] {
        --tw-shadow: -20px 0 50px rgba(0, 0, 0, 0.8);
        --tw-shadow-colored: -20px 0 50px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-\[0_0_15px_rgba\(0\,240\,255\,0\.2\)\] {
        --tw-shadow: 0 0 15px rgba(0, 240, 255, 0.2);
        --tw-shadow-colored: 0 0 15px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-\[0_0_25px_rgba\(0\,240\,255\,0\.25\)\] {
        --tw-shadow: 0 0 25px rgba(0, 240, 255, 0.25);
        --tw-shadow-colored: 0 0 25px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-glow-cyan {
        --tw-shadow: 0 0 25px -5px rgba(0, 240, 255, 0.4);
        --tw-shadow-colored: 0 0 25px -5px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-glow-gold {
        --tw-shadow: 0 0 25px -5px rgba(230, 185, 95, 0.4);
        --tw-shadow-colored: 0 0 25px -5px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-glow-neon {
        --tw-shadow: 0 0 25px -5px rgba(57, 255, 20, 0.4);
        --tw-shadow-colored: 0 0 25px -5px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-glow-red {
        --tw-shadow: 0 0 25px -5px rgba(255, 51, 102, 0.4);
        --tw-shadow-colored: 0 0 25px -5px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-lg {
        --tw-shadow:
          0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
        --tw-shadow-colored:
          0 10px 15px -3px var(--tw-shadow-color),
          0 4px 6px -4px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-md {
        --tw-shadow:
          0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
        --tw-shadow-colored:
          0 4px 6px -1px var(--tw-shadow-color),
          0 2px 4px -2px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .shadow-xl {
        --tw-shadow:
          0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
        --tw-shadow-colored:
          0 20px 25px -5px var(--tw-shadow-color),
          0 8px 10px -6px var(--tw-shadow-color);
        box-shadow:
          var(--tw-ring-offset-shadow, 0 0 #0000),
          var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
      }
      .outline-none {
        outline: 2px solid transparent;
        outline-offset: 2px;
      }
      .outline {
        outline-style: solid;
      }
      .ring {
        --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0
          var(--tw-ring-offset-width) var(--tw-ring-offset-color);
        --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
          calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
        box-shadow:
          var(--tw-ring-offset-shadow), var(--tw-ring-shadow),
          var(--tw-shadow, 0 0 #0000);
      }
      .blur {
        --tw-blur: blur(8px);
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .blur-0 {
        --tw-blur: blur(0);
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .blur-md {
        --tw-blur: blur(12px);
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .drop-shadow {
        --tw-drop-shadow: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1))
          drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .drop-shadow-\[0_0_12px_rgba\(255\,255\,255\,0\.2\)\] {
        --tw-drop-shadow: drop-shadow(0 0 12px rgba(255, 255, 255, 0.2));
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .drop-shadow-\[0_0_8px_rgba\(255\,255\,255\,0\.3\)\] {
        --tw-drop-shadow: drop-shadow(0 0 8px rgba(255, 255, 255, 0.3));
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .drop-shadow-\[0_2px_10px_rgba\(0\,0\,0\,0\.8\)\] {
        --tw-drop-shadow: drop-shadow(0 2px 10px rgba(0, 0, 0, 0.8));
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .drop-shadow-\[0_4px_20px_rgba\(0\,0\,0\,0\.8\)\] {
        --tw-drop-shadow: drop-shadow(0 4px 20px rgba(0, 0, 0, 0.8));
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .drop-shadow-\[0_6px_30px_rgba\(0\,0\,0\,0\.85\)\] {
        --tw-drop-shadow: drop-shadow(0 6px 30px rgba(0, 0, 0, 0.85));
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .drop-shadow-lg {
        --tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04))
          drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .filter {
        filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)
          var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)
          var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
      }
      .backdrop-blur {
        --tw-backdrop-blur: blur(8px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur)
          var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
          var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
          var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
          var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
          var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale)
          var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
          var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
          var(--tw-backdrop-sepia);
      }
      .backdrop-blur-2xl {
        --tw-backdrop-blur: blur(40px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur)
          var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
          var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
          var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
          var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
          var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale)
          var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
          var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
          var(--tw-backdrop-sepia);
      }
      .backdrop-blur-md {
        --tw-backdrop-blur: blur(12px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur)
          var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
          var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
          var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
          var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
          var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale)
          var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
          var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
          var(--tw-backdrop-sepia);
      }
      .backdrop-blur-sm {
        --tw-backdrop-blur: blur(4px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur)
          var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
          var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
          var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
          var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
          var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale)
          var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
          var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
          var(--tw-backdrop-sepia);
      }
      .backdrop-blur-xl {
        --tw-backdrop-blur: blur(24px);
        -webkit-backdrop-filter: var(--tw-backdrop-blur)
          var(--tw-backdrop-brightness) var(--tw-backdrop-contrast)
          var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate)
          var(--tw-backdrop-invert) var(--tw-backdrop-opacity)
          var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);
        backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness)
          var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale)
          var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert)
          var(--tw-backdrop-opacity) var(--tw-backdrop-saturate)
          var(--tw-backdrop-sepia);
      }
      .transition {
        transition-property:
          color, background-color, border-color, text-decoration-color, fill,
          stroke, opacity, box-shadow, transform, filter, backdrop-filter;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 0.15s;
      }
      .transition-all {
        transition-property: all;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 0.15s;
      }
      .transition-colors {
        transition-property:
          color, background-color, border-color, text-decoration-color, fill,
          stroke;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 0.15s;
      }
      .transition-opacity {
        transition-property: opacity;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 0.15s;
      }
      .transition-transform {
        transition-property: transform;
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-duration: 0.15s;
      }
      .duration-100 {
        transition-duration: 0.1s;
      }
      .duration-1000 {
        transition-duration: 1s;
      }
      .duration-200 {
        transition-duration: 0.2s;
      }
      .duration-300 {
        transition-duration: 0.3s;
      }
      .duration-500 {
        transition-duration: 0.5s;
      }
      .duration-700 {
        transition-duration: 0.7s;
      }
      .duration-75 {
        transition-duration: 75ms;
      }
      .duration-\[3000ms\] {
        transition-duration: 3s;
      }
      .ease-\[cubic-bezier\(0\.22\,1\,0\.36\,1\)\] {
        transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
      }
      .ease-out {
        transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
      }
      .will-change-transform {
        will-change: transform;
      }
      .\[-webkit-text-stroke\:1px_rgba\(255\,255\,255\,0\.35\)\] {
        -webkit-text-stroke: 1px rgba(255, 255, 255, 0.35);
      }
      .\[column-fill\:_balance\] {
        -moz-column-fill: balance;
        column-fill: balance;
      }
      :root {
        --bg-primary: #050505;
        --accent-color: #00f0ff;
        --accent-rgb: 0, 240, 255;
        --surface-color: rgba(14, 14, 14, 0.7);
        --border-color: rgba(255, 255, 255, 0.08);
        --bg-matte: #070708;
        --panel-bg: #030304;
        --bg: #070708;
        --bg-raised: linear-gradient(145deg, #08080a, #010102);
        --fg: #ffffff;
        --fg-muted: #8a8a93;
        --white: #ffffff;
        --text-main: #ffffff;
        --text-sub: #8a8a93;
        --line: rgba(255, 255, 255, 0.12);
        --edge: rgba(255, 255, 255, 0.15);
        --danger: #ff0055;
        --info: #00d2ff;
        --success: #00ff66;
      }
      [data-theme="light"],
      .theme-light {
        --bg-matte: #0e0e11;
        --panel-bg: rgba(255, 255, 255, 0.03);
        --bg: #0e0e11;
        --bg-raised: linear-gradient(145deg, #121316, #09090b);
        --fg: #ffffff;
        --fg-muted: #8a8a93;
        --white: #ffffff;
        --text-main: #ffffff;
        --text-sub: #8a8a93;
        --line: rgba(255, 255, 255, 0.12);
        --edge: rgba(255, 255, 255, 0.15);
        --danger: #ff0055;
        --info: #00d2ff;
        --success: #00ff66;
        --bg-primary: var(--bg-matte);
        --surface-color: rgba(20, 20, 25, 0.6);
        --border-color: rgba(255, 255, 255, 0.08);
      }
      body {
        background-color: var(--bg-matte);
        color: var(--fg);
      }
      ::-webkit-scrollbar {
        width: 6px;
        height: 6px;
      }
      ::-webkit-scrollbar-track {
        background: #050505;
      }
      ::-webkit-scrollbar-thumb {
        background: #ffffff26;
        border-radius: 3px;
      }
      ::-webkit-scrollbar-thumb:hover {
        background: var(--accent-color);
      }
      .glass-panel {
        background: var(--surface-color);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        border: 1px solid var(--border-color);
      }
      .glass-panel-hover {
        transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
      }
      .glass-panel-hover:hover {
        border-color: rgba(var(--accent-rgb), 0.35);
        box-shadow: 0 0 30px -10px rgba(var(--accent-rgb), 0.25);
        transform: translateY(-2px);
      }
      .scanline-overlay {
        background:
          linear-gradient(#12101000 50%, #00000040 50%),
          linear-gradient(90deg, #ff000008, #00ff0003, #0000ff08);
        background-size:
          100% 3px,
          6px 100%;
        pointer-events: none;
      }
      .font-mono-tech {
        font-family:
          Share Tech Mono,
          monospace;
        letter-spacing: 0.05em;
      }
      .font-display-cyber {
        font-family:
          Oxanium,
          Bebas Neue,
          sans-serif;
        letter-spacing: 0.08em;
      }
      .corner-bracket {
        position: relative;
      }
      .corner-bracket:before {
        content: "";
        position: absolute;
        top: -1px;
        left: -1px;
        width: 8px;
        height: 8px;
        border-top: 1.5px solid var(--accent-color);
        border-left: 1.5px solid var(--accent-color);
      }
      .corner-bracket:after {
        content: "";
        position: absolute;
        bottom: -1px;
        right: -1px;
        width: 8px;
        height: 8px;
        border-bottom: 1.5px solid var(--accent-color);
        border-right: 1.5px solid var(--accent-color);
      }
      html {
        scroll-behavior: smooth;
      }
      @media (prefers-reduced-motion: reduce) {
        html {
          scroll-behavior: auto;
        }
      }
      body {
        overflow-x: hidden;
      }
      :focus-visible {
        outline: 2px solid var(--theme-accent, #00f0ff);
        outline-offset: 2px;
      }
      html.has-custom-cursor,
      html.has-custom-cursor * {
        cursor: none !important;
      }
      html.has-custom-cursor input,
      html.has-custom-cursor textarea {
        cursor: text !important;
      }
      .mk-section {
        position: relative;
        max-width: 80rem;
        margin: 0 auto;
        padding: 7rem 1rem 5rem;
      }
      @media (min-width: 640px) {
        .mk-section {
          padding: 9rem 2rem 6rem;
        }
      }
      .mk-card {
        position: relative;
        border-radius: 1.25rem;
        padding: 1.5rem;
        background: linear-gradient(160deg, #0e0e10d1, #060608c7);
        border: 1px solid rgba(255, 255, 255, 0.09);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        transition:
          border-color 0.3s ease,
          transform 0.3s ease;
      }
      .mk-card:hover {
        border-color: #ffffff2e;
      }
      @media (min-width: 640px) {
        .mk-card {
          padding: 1.75rem;
        }
      }
      .mk-thumb {
        display: block;
        width: 100%;
        overflow: hidden;
        border-radius: 0.75rem;
        background: #ffffff08;
        border: 1px solid rgba(255, 255, 255, 0.08);
      }
      .mk-thumb:hover {
        border-color: var(--theme-accent);
      }
      .mk-slot {
        display: flex;
        flex-direction: column;
        padding: 0.85rem;
        border-radius: 0.75rem;
        border: 1px dashed rgba(255, 255, 255, 0.22);
        background:
          repeating-linear-gradient(
            135deg,
            #ffffff06 0,
            #ffffff06 10px,
            #fff0 10px,
            #fff0 20px
          ),
          #00000059;
        overflow: hidden;
      }
      .mk-slot:hover {
        border-color: var(--theme-accent);
      }
      @keyframes mk-float {
        0%,
        to {
          transform: translateY(0) rotate(var(--tilt, 0deg));
        }
        50% {
          transform: translateY(calc(var(--amp, 6px) * -1))
            rotate(calc(var(--tilt, 0deg) * -0.6));
        }
      }
      .mk-float {
        animation: mk-float 7s ease-in-out infinite;
        will-change: transform;
      }
      .mk-float:hover {
        animation-play-state: paused;
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-float {
          animation: none;
        }
      }
      .mk-dock-bar {
        display: flex;
        align-items: center;
        gap: 6px;
        height: 48px;
        padding: 0 8px 0 2px;
        border-radius: 16px;
        background: #08080ad6;
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
        border: 1px solid rgba(255, 255, 255, 0.12);
        box-shadow: 0 10px 30px #0000008c;
      }
      .mk-dock.is-dragging .mk-dock-bar {
        box-shadow:
          0 0 0 1px var(--theme-accent),
          0 16px 40px #0009;
      }
      .mk-dock.is-drop .mk-dock-bar {
        box-shadow: 0 0 0 2px var(--theme-accent);
      }
      .mk-dock-grip {
        display: flex;
        align-items: center;
        height: 100%;
        padding: 0 2px;
        color: #6b6b6b;
        cursor: grab;
      }
      .mk-dock.is-dragging .mk-dock-grip {
        cursor: grabbing;
      }
      .mk-dock-btn {
        width: 30px;
        height: 30px;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 9px;
        background: #ffffff0d;
        border: 1px solid rgba(255, 255, 255, 0.1);
        color: #cfcfcf;
        transition:
          color 0.2s,
          border-color 0.2s,
          background 0.2s;
      }
      .mk-dock-btn:hover {
        color: #fff;
        border-color: #ffffff40;
      }
      .mk-dock-btn:disabled {
        opacity: 0.35;
      }
      .mk-dock-play.is-on {
        color: var(--theme-accent);
        border-color: var(--theme-accent);
        box-shadow: 0 0 14px -2px var(--theme-accent);
      }
      .mk-dock-num {
        min-width: 26px;
        height: 26px;
        padding: 0 6px;
        border-radius: 8px;
        font-size: 11px;
        color: #9a9a9a;
        border: 1px solid rgba(255, 255, 255, 0.08);
        background: #ffffff08;
      }
      .mk-dock-num:hover {
        color: #fff;
      }
      .mk-dock-num.is-on {
        color: #000;
        background: var(--theme-accent);
        border-color: var(--theme-accent);
        font-weight: 700;
      }
      .mk-dock-pop {
        position: absolute;
        left: 0;
        width: min(300px, calc(100vw - 16px));
        padding: 12px;
        border-radius: 16px;
        background: #08080af0;
        -webkit-backdrop-filter: blur(18px);
        backdrop-filter: blur(18px);
        border: 1px solid rgba(255, 255, 255, 0.12);
        box-shadow: 0 16px 40px #0009;
      }
      .mk-term {
        background: #060708d1;
        backdrop-filter: blur(16px) saturate(120%);
        -webkit-backdrop-filter: blur(16px) saturate(120%);
        border: 1px solid
          color-mix(in srgb, var(--term-accent, #5eead4) 40%, transparent);
        box-shadow: 0 20px 60px #000000bf;
      }
      :root {
        --sai-t: env(safe-area-inset-top, 0px);
        --sai-r: env(safe-area-inset-right, 0px);
        --sai-b: env(safe-area-inset-bottom, 0px);
        --sai-l: env(safe-area-inset-left, 0px);
      }
      @supports (height: 100dvh) {
        .h-screen {
          height: 100dvh;
        }
        .min-h-screen {
          min-height: 100dvh;
        }
      }
      html {
        -webkit-text-size-adjust: 100%;
        overscroll-behavior-x: none;
      }
      body {
        overscroll-behavior-x: none;
      }
      @media (hover: none) {
        html.has-custom-cursor,
        html.has-custom-cursor * {
          cursor: auto !important;
        }
        .mk-card {
          border-color: #ffffff24;
        }
        .mk-thumb {
          border-color: #ffffff29;
        }
        .mk-thumb:active {
          border-color: var(--theme-accent);
          transform: scale(0.985);
        }
        .mk-thumb:active img {
          transform: scale(1.03);
        }
        .mk-dock-btn:active,
        .mk-dock-num:active {
          background: #ffffff29;
          color: #fff;
        }
        .glass-panel-hover:hover {
          transform: none;
        }
        .mk-thumb span:last-child {
          opacity: 1;
        }
        .mk-dock-btn {
          width: 36px;
          height: 36px;
        }
        .mk-dock-num {
          min-width: 34px;
          height: 32px;
        }
        .mk-dock-bar {
          height: 56px;
          gap: 8px;
        }
        .mk-dock-grip {
          padding: 0 6px;
        }
        [role="tab"] {
          min-height: 40px;
        }
      }
      .mk-dock {
        max-width: calc(100vw - 16px);
      }
      @media (max-width: 560px) {
        .mk-section {
          padding: 5rem 1rem 3.5rem;
        }
        .mk-card {
          padding: 1.1rem;
          border-radius: 1rem;
        }
        #hero .font-display {
          font-size: clamp(2.6rem, 15vw, 5rem);
          line-height: 0.88;
        }
        .mk-float {
          animation-duration: 9s;
        }
        .terminal-container {
          border-radius: 1rem;
        }
      }
      @media (max-height: 460px) and (orientation: landscape) {
        #hero .font-display {
          font-size: clamp(2rem, 9vh, 3.4rem);
        }
        .mk-section {
          padding-top: 4.5rem;
          padding-bottom: 2.5rem;
        }
        .mk-dock-bar {
          height: 44px;
        }
        .mk-dock-pop {
          max-height: 60vh;
          overflow-y: auto;
        }
        .terminal-container {
          right: 8px !important;
          bottom: 8px !important;
          left: 8px !important;
          top: 8px !important;
          width: auto !important;
          height: auto !important;
          transform: none !important;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-float,
        .animate-pulse,
        .animate-ping {
          animation: none !important;
        }
        * {
          transition-duration: 0.01ms !important;
        }
      }
      @media (max-width: 430px) {
        .mk-eq {
          display: none;
        }
        .mk-dock-bar {
          gap: 5px;
        }
      }
      @media (max-width: 860px) {
        header.fixed:before {
          content: "";
          position: absolute;
          inset: 0 0 auto 0;
          height: calc(100% + 18px);
          background: linear-gradient(
            to bottom,
            #050505eb,
            #050505a6 55%,
            #05050500
          );
          pointer-events: none;
          z-index: -1;
        }
      }
      .mk-rail,
      .mk-rail-tip,
      .mk-rail-pop,
      .mk-dockpick {
        --rail-bg: rgba(8, 8, 10, 0.72);
        --rail-pop: rgba(10, 10, 12, 0.94);
        --rail-line: rgba(255, 255, 255, 0.1);
        --rail-fg: #c9c9c9;
        --rail-fg-hi: #ffffff;
        --rail-hover: rgba(255, 255, 255, 0.07);
        --rail-act-bg: #ffffff;
        --rail-act-fg: #000000;
        --rail-accent: var(--theme-accent, #e60000);
        --rail-shadow: 0 14px 40px rgba(0, 0, 0, 0.55);
      }
      [data-skin="acad-light"].mk-rail,
      [data-skin="acad-light"].mk-rail-tip,
      [data-skin="acad-light"].mk-rail-pop,
      [data-skin="acad-light"].mk-dockpick {
        --rail-bg: rgba(247, 236, 225, 0.55);
        --rail-pop: rgba(250, 250, 255, 0.9);
        --rail-line: rgba(25, 25, 25, 0.12);
        --rail-fg: #191919;
        --rail-fg-hi: #000000;
        --rail-hover: rgba(25, 25, 25, 0.07);
        --rail-act-bg: #191919;
        --rail-act-fg: #f7ece1;
        --rail-accent: #fe4a49;
        --rail-shadow:
          0 14px 40px rgba(28, 28, 28, 0.14),
          inset 0 1px 0 rgba(255, 255, 255, 0.6);
      }
      [data-skin="acad-dark"].mk-rail,
      [data-skin="acad-dark"].mk-rail-tip,
      [data-skin="acad-dark"].mk-rail-pop,
      [data-skin="acad-dark"].mk-dockpick {
        --rail-bg: rgba(25, 25, 25, 0.6);
        --rail-pop: rgba(28, 28, 28, 0.94);
        --rail-line: rgba(247, 236, 225, 0.14);
        --rail-fg: #daddd8;
        --rail-fg-hi: #fafaff;
        --rail-hover: rgba(247, 236, 225, 0.08);
        --rail-act-bg: #f7ece1;
        --rail-act-fg: #191919;
        --rail-accent: #fe4a49;
        --rail-shadow:
          0 14px 40px rgba(0, 0, 0, 0.5),
          inset 0 1px 0 rgba(247, 236, 225, 0.06);
      }
      .mk-rail {
        position: fixed;
        z-index: 75;
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 6px;
        border-radius: 18px;
        background: var(--rail-bg);
        border: 1px solid var(--rail-line);
        backdrop-filter: blur(18px) saturate(150%);
        -webkit-backdrop-filter: blur(18px) saturate(150%);
        box-shadow: var(--rail-shadow);
        font-family:
          Share Tech Mono,
          ui-monospace,
          monospace;
        scrollbar-width: none;
        overscroll-behavior: contain;
        transition:
          box-shadow 0.22s ease,
          border-color 0.22s ease;
      }
      .mk-rail::-webkit-scrollbar {
        display: none;
      }
      .mk-rail[data-dock="right"],
      .mk-rail[data-dock="left"] {
        flex-direction: column;
        top: 50%;
        transform: translateY(-50%);
        max-height: calc(100vh - 20px - var(--sai-t) - var(--sai-b));
        overflow-y: auto;
        overflow-x: hidden;
      }
      @supports (height: 100dvh) {
        .mk-rail[data-dock="right"],
        .mk-rail[data-dock="left"] {
          max-height: calc(100dvh - 20px - var(--sai-t) - var(--sai-b));
        }
      }
      .mk-rail[data-dock="right"] {
        right: calc(10px + var(--sai-r));
      }
      .mk-rail[data-dock="left"] {
        left: calc(10px + var(--sai-l));
      }
      .mk-rail[data-dock="top"],
      .mk-rail[data-dock="bottom"] {
        flex-direction: row;
        left: 50%;
        transform: translate(-50%);
        max-width: calc(100vw - 20px - var(--sai-l) - var(--sai-r));
        overflow-x: auto;
        overflow-y: hidden;
      }
      .mk-rail[data-dock="top"] {
        top: calc(10px + var(--sai-t));
      }
      .mk-rail[data-dock="bottom"] {
        bottom: calc(10px + var(--sai-b));
      }
      .mk-rail-btn {
        position: relative;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-width: 38px;
        height: 38px;
        padding: 0 10px;
        border-radius: 12px;
        color: var(--rail-fg);
        border: 1px solid transparent;
        transition:
          background-color 0.18s ease,
          color 0.18s ease,
          border-color 0.18s ease,
          transform 0.18s ease;
      }
      .mk-rail[data-dock="right"] .mk-rail-btn,
      .mk-rail[data-dock="left"] .mk-rail-btn {
        width: 38px;
        padding: 0;
      }
      .mk-rail-btn:hover {
        background: var(--rail-hover);
        color: var(--rail-fg-hi);
      }
      .mk-rail-btn:active {
        transform: scale(0.94);
      }
      .mk-rail-btn.is-open {
        background: var(--rail-hover);
        color: var(--rail-fg-hi);
        border-color: var(--rail-line);
      }
      .mk-rail-btn.is-active {
        background: var(--rail-act-bg);
        color: var(--rail-act-fg);
      }
      .mk-rail-btn.is-lit {
        color: var(--rail-accent);
        border-color: var(--rail-accent);
        box-shadow: 0 0 14px -4px var(--rail-accent);
      }
      .mk-rail-ico {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 16px;
        height: 16px;
      }
      .mk-rail-wide {
        display: none;
        font-size: 10px;
        letter-spacing: 0.2em;
        white-space: nowrap;
      }
      @media (min-width: 1280px) {
        .mk-rail-wide {
          display: inline;
        }
      }
      .mk-rail-sep {
        flex-shrink: 0;
        background: var(--rail-line);
      }
      .mk-rail[data-dock="right"] .mk-rail-sep,
      .mk-rail[data-dock="left"] .mk-rail-sep {
        width: 20px;
        height: 1px;
        margin: 3px 0;
      }
      .mk-rail[data-dock="top"] .mk-rail-sep,
      .mk-rail[data-dock="bottom"] .mk-rail-sep {
        width: 1px;
        height: 20px;
        margin: 0 3px;
      }
      .mk-rail-tip {
        position: fixed;
        z-index: 190;
        pointer-events: none;
        padding: 4px 9px;
        border-radius: 8px;
        white-space: nowrap;
        font:
          10px/1.4 Share Tech Mono,
          ui-monospace,
          monospace;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        background: var(--rail-pop);
        color: var(--rail-fg-hi);
        border: 1px solid var(--rail-line);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: var(--rail-shadow);
      }
      .mk-rail-pop {
        position: fixed;
        z-index: 190;
      }
      .mk-rail-pop:after {
        content: "";
        position: absolute;
        width: 11px;
        height: 11px;
        transform: rotate(45deg);
        pointer-events: none;
        background: var(--rail-pop);
        border: 1px solid var(--rail-line);
      }
      .mk-rail-pop[data-side="top"]:after {
        top: -6px;
        left: calc(var(--caret) - 5.5px);
        border-right: 0;
        border-bottom: 0;
      }
      .mk-rail-pop[data-side="bottom"]:after {
        bottom: -6px;
        left: calc(var(--caret) - 5.5px);
        border-left: 0;
        border-top: 0;
      }
      .mk-rail-pop[data-side="left"]:after {
        left: -6px;
        top: calc(var(--caret) - 5.5px);
        border-top: 0;
        border-right: 0;
      }
      .mk-rail-pop[data-side="right"]:after {
        right: -6px;
        top: calc(var(--caret) - 5.5px);
        border-left: 0;
        border-bottom: 0;
      }
      .mk-rail-menu {
        position: relative;
        padding: 8px;
        border-radius: 16px;
        max-height: min(80vh, 520px);
        overflow-y: auto;
        background: var(--rail-pop);
        color: var(--rail-fg);
        border: 1px solid var(--rail-line);
        backdrop-filter: blur(20px) saturate(140%);
        -webkit-backdrop-filter: blur(20px) saturate(140%);
        box-shadow: var(--rail-shadow);
        font-family:
          Share Tech Mono,
          ui-monospace,
          monospace;
      }
      .mk-rail-menu-title {
        font-size: 9px;
        letter-spacing: 0.26em;
        text-transform: uppercase;
        opacity: 0.6;
        padding: 4px 8px 8px;
      }
      .mk-rail-menu-item {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 9px;
        padding: 9px 10px;
        border-radius: 10px;
        font-size: 10px;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        text-align: left;
        color: var(--rail-fg);
      }
      .mk-rail-menu-item:hover {
        background: var(--rail-hover);
        color: var(--rail-fg-hi);
      }
      .mk-rail-menu-item.is-on {
        color: var(--rail-accent);
      }
      html[data-dock="top"] body {
        padding-top: var(--rail-t, 0px);
      }
      html[data-dock="top"] #hero {
        margin-top: calc(-1 * var(--rail-t, 0px));
      }
      html[data-dock="bottom"] body {
        padding-bottom: var(--rail-b, 0px);
      }
      @media (max-width: 1480px) {
        html[data-dock="right"] body {
          padding-right: var(--rail-r, 0px);
        }
        html[data-dock="left"] body {
          padding-left: var(--rail-l, 0px);
        }
      }
      @media (hover: none) {
        .mk-rail-btn {
          min-width: 42px;
          height: 42px;
        }
        .mk-rail[data-dock="right"] .mk-rail-btn,
        .mk-rail[data-dock="left"] .mk-rail-btn {
          width: 42px;
        }
        .mk-rail {
          gap: 3px;
          padding: 5px;
        }
      }
      html[data-theme="light"] body {
        background:
          linear-gradient(180deg, #fafaff, #eef0f2 46%, #ecebe4) fixed,
          #fafaff;
      }
      html[data-theme="academic-dark"] body {
        background:
          radial-gradient(120% 70% at 50% -10%, #2a2a2a, #1c1c1c 55%, #161616)
            fixed,
          #1c1c1c;
      }
      html[data-theme="light"] ::-webkit-scrollbar-track {
        background: #ecebe4;
      }
      html[data-theme="light"] ::-webkit-scrollbar-thumb {
        background: #1c1c1c40;
      }
      html[data-theme="academic-dark"] ::-webkit-scrollbar-track {
        background: #1c1c1c;
      }
      .acad {
        --a-ink: #1c1c1c;
        --a-body: rgba(28, 28, 28, 0.84);
        --a-muted: rgba(28, 28, 28, 0.6);
        --a-accent: #fe4a49;
        --a-accent-text: #c8393a;
        --a-line: #daddd8;
        --a-sheet: rgba(250, 250, 255, 0.3);
        --a-sheet-edge: rgba(218, 221, 216, 0.9);
        --a-box: linear-gradient(
          150deg,
          rgba(247, 236, 225, 0.66) 0%,
          rgba(247, 236, 225, 0.36) 100%
        );
        --a-box-line: rgba(25, 25, 25, 0.1);
        --a-box-shadow:
          inset 0 1px 0 rgba(255, 255, 255, 0.8),
          inset 0 -1px 0 rgba(25, 25, 25, 0.04),
          0 14px 34px -16px rgba(25, 25, 25, 0.25);
        --a-ink-box: linear-gradient(
          150deg,
          rgba(25, 25, 25, 0.86) 0%,
          rgba(25, 25, 25, 0.7) 100%
        );
        --a-ink-box-fg: #f7ece1;
        --a-chip: rgba(254, 74, 73, 0.1);
        --a-chip-line: rgba(254, 74, 73, 0.38);
        --a-chip-fg: #191919;
        --a-chipbox: rgba(25, 25, 25, 0.05);
        --a-btn-bg: #191919;
        --a-btn-fg: #f7ece1;
        position: relative;
        min-height: 100vh;
        color: var(--a-body);
        font-family: Barlow, Inter, sans-serif;
      }
      .acad[data-tone="dark"] {
        --a-ink: #fafaff;
        --a-body: rgba(238, 240, 242, 0.84);
        --a-muted: rgba(218, 221, 216, 0.6);
        --a-accent: #fe4a49;
        --a-accent-text: #fe4a49;
        --a-line: rgba(218, 221, 216, 0.14);
        --a-sheet: rgba(28, 28, 28, 0.32);
        --a-sheet-edge: rgba(218, 221, 216, 0.1);
        --a-box: linear-gradient(
          150deg,
          rgba(25, 25, 25, 0.68) 0%,
          rgba(25, 25, 25, 0.42) 100%
        );
        --a-box-line: rgba(247, 236, 225, 0.12);
        --a-box-shadow:
          inset 0 1px 0 rgba(247, 236, 225, 0.08),
          0 16px 38px -16px rgba(0, 0, 0, 0.75);
        --a-ink-box: linear-gradient(
          150deg,
          rgba(247, 236, 225, 0.9) 0%,
          rgba(247, 236, 225, 0.76) 100%
        );
        --a-ink-box-fg: #191919;
        --a-chip: rgba(254, 74, 73, 0.12);
        --a-chip-line: rgba(254, 74, 73, 0.42);
        --a-chip-fg: #f7ece1;
        --a-chipbox: rgba(247, 236, 225, 0.05);
        --a-btn-bg: #f7ece1;
        --a-btn-fg: #191919;
      }
      .acad ::-moz-selection {
        background: #fe4a49;
        color: #191919;
      }
      .acad ::selection {
        background: #fe4a49;
        color: #191919;
      }
      .acad-field {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 0;
        pointer-events: none;
        display: block;
      }
      .acad-sheet {
        position: relative;
        z-index: 1;
        max-width: 72rem;
        margin: 0 auto;
        min-height: 100vh;
        background: var(--a-sheet);
        backdrop-filter: blur(1.5px) saturate(110%);
        -webkit-backdrop-filter: blur(1.5px) saturate(110%);
        border-left: 1px solid var(--a-sheet-edge);
        border-right: 1px solid var(--a-sheet-edge);
      }
      @media (max-width: 1180px) {
        .acad-sheet {
          border-left: 0;
          border-right: 0;
        }
      }
      .acad-masthead {
        padding: 4.5rem 1.5rem 0;
      }
      @media (max-width: 640px) {
        .acad-masthead {
          padding-top: 3rem;
        }
      }
      .acad-ink {
        color: var(--a-ink);
      }
      .acad-body {
        color: var(--a-body);
      }
      .acad-muted {
        color: var(--a-muted);
      }
      .acad-accent {
        color: var(--a-accent-text);
      }
      .acad strong {
        color: var(--a-ink);
      }
      .acad-line {
        border-color: var(--a-line) !important;
      }
      .acad-box {
        background: var(--a-box);
        border: 1px solid var(--a-box-line);
        box-shadow: var(--a-box-shadow);
        backdrop-filter: blur(22px) saturate(170%);
        -webkit-backdrop-filter: blur(22px) saturate(170%);
      }
      .acad-box-hover {
        transition:
          border-color 0.25s ease,
          transform 0.25s ease,
          box-shadow 0.25s ease;
      }
      .acad-box-hover:hover {
        border-color: #fe4a498c;
        transform: translateY(-2px);
      }
      .acad-box--note {
        background: linear-gradient(150deg, #fe4a491f, #f7ece152);
        border-color: #fe4a4959;
      }
      .acad[data-tone="dark"] .acad-box--note {
        background: linear-gradient(150deg, #fe4a4924, #19191980);
      }
      .acad-box--ink {
        background: var(--a-ink-box);
        border-color: transparent;
        color: var(--a-ink-box-fg);
      }
      .acad-box--ink .acad-ink {
        color: var(--a-ink-box-fg);
      }
      .acad-box--ink .acad-body {
        color: color-mix(in srgb, var(--a-ink-box-fg) 84%, transparent);
      }
      .acad-box--ink .acad-muted {
        color: color-mix(in srgb, var(--a-ink-box-fg) 58%, transparent);
      }
      .acad-box--ink .acad-accent {
        color: #fe4a49;
      }
      .acad-box--ink .acad-line {
        border-color: color-mix(
          in srgb,
          var(--a-ink-box-fg) 16%,
          transparent
        ) !important;
      }
      .acad[data-tone="light"] .acad-box--ink .acad-accent {
        color: #fe4a49;
      }
      .acad[data-tone="dark"] .acad-box--ink .acad-accent {
        color: #c8393a;
      }
      .acad-chip {
        background: var(--a-chip);
        border: 1px solid var(--a-chip-line);
        color: var(--a-chip-fg) !important;
      }
      .acad-chipbox {
        background: var(--a-chipbox);
        border: 1px solid var(--a-box-line);
        color: var(--a-body);
      }
      .acad-btn {
        background: var(--a-btn-bg);
        color: var(--a-btn-fg);
        border: 1px solid var(--a-btn-bg);
        transition:
          background-color 0.2s ease,
          color 0.2s ease,
          transform 0.2s ease;
      }
      .acad-btn:hover {
        background: #fe4a49;
        border-color: #fe4a49;
        color: #191919;
      }
      .acad-btn:active {
        transform: scale(0.97);
      }
      .acad-footer {
        background: transparent;
      }
      .acad main {
        position: relative;
      }
      @media (max-width: 560px) {
        #hero > div {
          padding-bottom: calc(150px + var(--sai-b));
        }
      }
      @media (max-height: 460px) and (orientation: landscape) {
        #hero > div {
          padding-top: calc(14px + var(--sai-t));
          padding-bottom: calc(78px + var(--sai-b));
        }
        #hero nav {
          margin-top: 0.75rem;
        }
        #hero nav ~ div {
          display: none;
        }
      }
      @media (max-width: 760px) {
        .acad-sheet {
          background: #fafaff33;
          backdrop-filter: blur(1px);
          -webkit-backdrop-filter: blur(1px);
        }
        .acad[data-tone="dark"] .acad-sheet {
          background: #1c1c1c38;
        }
      }
      .mk-media {
        max-width: none;
      }
      .mk-media-bar {
        position: relative;
        overflow: hidden;
        gap: 2px;
        padding: 0 4px;
      }
      .mk-media-half {
        flex: 1 1 0;
        min-width: 0;
        height: 100%;
        display: flex;
        align-items: center;
        gap: 5px;
        transition: flex-grow 0.32s cubic-bezier(0.22, 1, 0.36, 1);
      }
      .mk-media-half.is-shown {
        animation: mk-media-in 0.22s ease-out;
      }
      @keyframes mk-media-in {
        0% {
          opacity: 0;
          transform: translateY(3px);
        }
        to {
          opacity: 1;
          transform: none;
        }
      }
      .mk-media-bar[data-open="music"] .mk-media-music,
      .mk-media-bar[data-open="video"] .mk-media-video {
        flex-grow: 2.4;
      }
      .mk-media-bar[data-open] .mk-media-half:not(.is-shown) .mk-media-txt,
      .mk-media-bar[data-open] .mk-media-half:not(.is-shown) .mk-eq {
        display: none;
      }
      .mk-media-bar[data-open] .mk-media-half:not(.is-shown) .mk-media-rest {
        justify-content: center;
        padding: 0;
      }
      .mk-media-rest {
        width: 100%;
        height: calc(100% - 10px);
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 0 6px;
        border-radius: 12px;
        text-align: left;
        color: #cfcfcf;
        min-width: 0;
        transition:
          background-color 0.2s ease,
          color 0.2s ease;
      }
      .mk-media-rest:hover {
        background: #ffffff0d;
        color: #fff;
      }
      .mk-media-txt {
        min-width: 0;
        flex: 1 1 auto;
      }
      .mk-media-ico {
        width: 28px;
        height: 28px;
        flex: none;
        display: flex;
        align-items: center;
        justify-content: center;
        color: #8f8f8f;
        border-radius: 9px;
      }
      .mk-media-half.is-live .mk-media-ico {
        color: var(--theme-accent);
        filter: drop-shadow(0 0 6px var(--theme-accent));
      }
      .mk-media-half.is-shown .mk-media-ico {
        color: #e5e5e5;
      }
      .mk-media-grip {
        flex: none;
        padding: 0 1px;
        border-left: 1px solid rgba(255, 255, 255, 0.08);
        border-right: 1px solid rgba(255, 255, 255, 0.08);
        height: 60%;
      }
      .mk-media-prog {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 2px;
        background: #ffffff0d;
        pointer-events: none;
      }
      .mk-dock-btn.is-on-soft {
        color: #fff;
        border-color: #ffffff4d;
        background: #ffffff1a;
      }
      .mk-media-pop {
        width: 100% !important;
        left: 0;
        right: auto;
      }
      @media (hover: none) {
        .mk-media-bar {
          gap: 3px;
        }
        .mk-media-half {
          gap: 4px;
        }
      }
      .mk-media {
        pointer-events: none;
      }
      .mk-media .mk-media-bar,
      .mk-media .mk-media-pop {
        pointer-events: auto;
      }
      .mk-dock-bar.mk-media-bar {
        height: 36px;
        margin: 0 auto;
        padding: 0 3px;
        gap: 2px;
        border-radius: 13px;
        transition:
          width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
          box-shadow 0.2s ease;
      }
      .mk-media-half {
        overflow: hidden;
      }
      .mk-media-bar.is-pill .mk-media-half {
        justify-content: center;
      }
      .mk-media-rest {
        height: calc(100% - 6px);
        justify-content: center;
        padding: 0;
        border-radius: 10px;
      }
      .mk-media-sep {
        flex: none;
        width: 1px;
        height: 46%;
        background: #ffffff24;
      }
      .mk-media .mk-dock-btn {
        width: 28px;
        height: 28px;
        border-radius: 8px;
      }
      .mk-media .mk-dock-num {
        min-width: 26px;
        height: 24px;
        border-radius: 7px;
      }
      .mk-media .mk-media-ico {
        width: 24px;
        height: 24px;
      }
      .mk-media-grip {
        cursor: grab;
        outline: none;
        display: flex;
        align-items: center;
        justify-content: center;
      }
      @media (hover: none) {
        .mk-dock-bar.mk-media-bar {
          height: 42px;
          gap: 2px;
        }
        .mk-media-grip {
          width: 30px;
          height: 100%;
          padding: 0;
          border: 0;
        }
        .mk-media .mk-dock-btn {
          width: 32px;
          height: 32px;
        }
        .mk-media .mk-dock-num {
          min-width: 30px;
          height: 28px;
        }
      }
      @media (max-height: 460px) and (orientation: landscape) {
        .mk-dock-bar.mk-media-bar {
          height: 36px;
        }
      }
      .mk-logo-backdrop {
        background: radial-gradient(70% 60% at 50% 45%, #ffffff12, #fff0 70%);
      }
      .mk-hero-name-gap {
        display: none;
      }
      @media (max-width: 560px) and (orientation: portrait) {
        #hero > div {
          padding-top: calc(
            10px + max(var(--rail-t, 0px), var(--media-t, 0px)) + var(--sai-t)
          );
          padding-bottom: calc(
            12px + max(var(--rail-b, 0px), var(--media-b, 0px)) + var(--sai-b)
          );
          padding-left: 12px;
          padding-right: 12px;
        }
        .mk-hero-top {
          align-self: flex-start;
          max-width: 82%;
          padding: 8px 12px 9px;
          border-radius: 14px;
          background: #0505074d;
          backdrop-filter: blur(10px) saturate(130%);
          -webkit-backdrop-filter: blur(10px) saturate(130%);
          border: 1px solid rgba(255, 255, 255, 0.08);
        }
        .mk-hero-top > div:first-child {
          font-size: 9px;
          letter-spacing: 0.24em;
        }
        #hero .mk-hero-scene {
          font-size: 1.45rem;
          line-height: 1;
          margin-top: 4px;
        }
        .mk-hero-desc {
          font-size: 9.5px;
          line-height: 1.45;
          margin-top: 4px;
          display: -webkit-box;
          -webkit-line-clamp: 2;
          -webkit-box-orient: vertical;
          overflow: hidden;
        }
        .mk-hero-bottom {
          padding: 12px 14px;
          border-radius: 18px;
          background: #05050757;
          backdrop-filter: blur(12px) saturate(130%);
          -webkit-backdrop-filter: blur(12px) saturate(130%);
          border: 1px solid rgba(255, 255, 255, 0.08);
        }
        #hero .mk-hero-name {
          font-size: 2.5rem;
          line-height: 0.92;
          white-space: nowrap;
        }
        .mk-hero-name br {
          display: none;
        }
        .mk-hero-name-gap {
          display: inline;
        }
        .mk-hero-roles {
          margin-top: 6px;
          font-size: 8.5px;
          letter-spacing: 0.18em;
          -moz-column-gap: 8px;
          column-gap: 8px;
        }
        .mk-hero-nav {
          margin-top: 10px;
          flex-wrap: nowrap;
          overflow-x: auto;
          gap: 6px;
          scrollbar-width: none;
          -webkit-overflow-scrolling: touch;
        }
        .mk-hero-nav::-webkit-scrollbar {
          display: none;
        }
        .mk-hero-nav > button {
          flex: none;
          padding: 7px 11px;
          font-size: 10px;
          letter-spacing: 0.18em;
          border-radius: 10px;
        }
        .mk-hero-hint {
          display: none;
        }
        .mk-hero-top {
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: 12px;
          width: -moz-max-content;
          width: max-content;
          max-width: 100%;
          min-width: calc(var(--chip-grow, 0) * 100%);
          padding: 6px 14px 6px 12px;
          transition:
            min-width 0.45s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 1s ease,
            filter 1s ease,
            transform 1s ease;
        }
        .mk-hero-top.is-gone {
          opacity: 0;
          filter: blur(10px);
          transform: translateY(-10px) scale(0.97);
        }
        .mk-hero-top > div:first-child {
          flex: none;
          white-space: nowrap;
        }
        #hero .mk-hero-scene {
          margin: 0;
          font-size: 1.1rem;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          min-width: 0;
          text-align: right;
        }
        .mk-hero-desc {
          display: none;
        }
        .mk-hero-name--fx {
          display: block;
        }
        .mk-hero-name--fx .mk-l {
          display: inline-block;
          will-change: transform, filter, opacity;
        }
        .mk-hero-name--fx .mk-l-sp {
          display: inline-block;
          width: 0.22em;
        }
        .mk-hero-name--fx.is-off .mk-l {
          opacity: 0;
        }
      }
      .mk-hero-count {
        background: linear-gradient(
          180deg,
          #fffffff5,
          #c4c6cec7 55%,
          #9698a0b3
        );
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        filter: drop-shadow(0 1px 6px rgba(255, 255, 255, 0.12));
      }
      .mk-av {
        position: fixed;
        left: 0;
        top: 0;
        width: 100vw;
        height: 100vh;
        height: 100dvh;
        z-index: 95;
        color: #f2f2f4;
        font-family: Barlow, system-ui, sans-serif;
        background: radial-gradient(90% 70% at 50% 38%, #0b0d11, #050608 70%);
        border-radius: 0;
        transition:
          left 0.5s cubic-bezier(0.22, 1, 0.36, 1),
          top 0.5s cubic-bezier(0.22, 1, 0.36, 1),
          width 0.5s cubic-bezier(0.22, 1, 0.36, 1),
          height 0.5s cubic-bezier(0.22, 1, 0.36, 1),
          border-radius 0.5s ease,
          background-color 0.4s ease,
          opacity 0.9s ease;
      }
      .mk-av.ph-leaving {
        opacity: 0;
        pointer-events: none;
        transition-delay: 0s, 0s, 0s, 0s, 0s, 0s, 0.55s;
      }
      .mk-av-frame {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        overflow: hidden;
        border-radius: inherit;
      }
      .mk-av-canvas {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: block;
        touch-action: none;
      }
      .mk-av-eye {
        position: absolute;
        left: 0;
        top: 0;
        width: 0;
        height: 0;
        pointer-events: none;
        opacity: 0;
        mix-blend-mode: screen;
      }
      .mk-av-eye:before {
        content: "";
        position: absolute;
        left: -46px;
        top: -46px;
        width: 92px;
        height: 92px;
        border-radius: 50%;
        background: radial-gradient(
          circle,
          #ecf2ff99,
          #cddaff33 24%,
          #cddaff00 62%
        );
      }
      .mk-av-eye[data-mode="gold"]:before {
        left: -70px;
        top: -70px;
        width: 140px;
        height: 140px;
        background: radial-gradient(
          circle,
          #ffd66ef2,
          #ffaa2873 18%,
          #ff8c141f 45%,
          #ff8c1400 70%
        );
      }
      .mk-av-eye[data-mode="off"] {
        display: none;
      }
      .mk-av-head {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: calc(14px + var(--sai-t, 0px)) 14px 0 18px;
      }
      .mk-av-name {
        font-family:
          Bebas Neue,
          sans-serif;
        font-size: 24px;
        line-height: 1;
        letter-spacing: 0.02em;
      }
      .mk-av-tag {
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 9.5px;
        letter-spacing: 0.28em;
        text-transform: uppercase;
        background: linear-gradient(180deg, #fffffff2, #a0a2aabf);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
      }
      .mk-av-tools {
        margin-left: auto;
        display: flex;
        gap: 6px;
      }
      .mk-av-tools button {
        height: 38px;
        min-width: 38px;
        padding: 0 10px;
        border-radius: 12px;
        border: 1px solid rgba(255, 255, 255, 0.1);
        background: #0e0f1280;
        color: #d9d9de;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 10px;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
      }
      .mk-av-tools button:hover {
        color: #fff;
        border-color: #ffffff38;
      }
      .mk-av-gate {
        position: absolute;
        left: 0;
        right: 0;
        top: calc(42% + min(33vw, 20vh, 180px) + 26px);
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
        text-align: center;
        padding: 0 24px;
        opacity: 0;
        transform: translateY(10px);
        transition:
          opacity 0.9s ease,
          transform 0.9s cubic-bezier(0.22, 1, 0.36, 1);
        pointer-events: none;
      }
      .mk-av-gate.is-ready {
        opacity: 1;
        transform: none;
        pointer-events: auto;
      }
      .mk-av-gate p {
        margin: 0;
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 9px;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: #dcdee680;
      }
      .mk-av-logo-hit {
        position: absolute;
        left: 50%;
        top: 42%;
        width: min(66vw, 40vh, 360px);
        aspect-ratio: 1;
        transform: translate(-50%, -50%);
        border-radius: 50%;
        border: 0;
        background: transparent;
        cursor: pointer;
      }
      .mk-av-logo-hit:focus-visible {
        outline: 1px solid rgba(205, 218, 255, 0.5);
        outline-offset: 6px;
      }
      .mk-av-halo {
        position: absolute;
        left: 50%;
        top: 42%;
        width: min(80vw, 50vh, 440px);
        aspect-ratio: 1;
        transform: translate(-50%, -50%);
        border-radius: 50%;
        pointer-events: none;
        background: radial-gradient(
          circle,
          #aabeff1a,
          #aabeff0a 38%,
          #aabeff00 64%
        );
        animation: mk-av-halo 4.2s ease-in-out infinite;
      }
      @keyframes mk-av-halo {
        50% {
          transform: translate(-50%, -50%) scale(1.06);
          opacity: 0.7;
        }
      }
      .mk-av-logo-fallback {
        position: absolute;
        left: 50%;
        top: 42%;
        width: min(110vw, 66vh, 620px);
        transform: translate(-50%, -50%);
        pointer-events: none;
        opacity: 0.9;
      }
      .mk-av-enter {
        padding: 14px 38px;
        border-radius: 14px;
        border: 1px solid rgba(255, 255, 255, 0.22);
        background: #ffffff0a;
        color: #fff;
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 12px;
        letter-spacing: 0.36em;
        text-transform: uppercase;
        transition:
          box-shadow 0.3s ease,
          border-color 0.3s ease;
      }
      .mk-av-enter:hover {
        border-color: #cddaff99;
        box-shadow: 0 0 30px -6px #cddaff73;
      }
      .mk-av-link {
        background: none;
        border: 0;
        padding: 6px;
        color: #dcdee68c;
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 10px;
        letter-spacing: 0.2em;
        text-transform: uppercase;
        text-decoration: underline;
        text-underline-offset: 4px;
      }
      .mk-av-bottom {
        position: absolute;
        left: 50%;
        bottom: calc(16px + var(--sai-b, 0px));
        transform: translate(-50%);
        width: min(600px, calc(100vw - 24px));
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
      }
      .mk-av-heard {
        max-width: 100%;
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 11.5px;
        letter-spacing: 0.05em;
        color: #aacdffcc;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .mk-av-cap {
        min-height: 2.9em;
        text-align: center;
        font-size: 17px;
        line-height: 1.45;
        text-shadow: 0 2px 14px rgba(0, 0, 0, 0.9);
      }
      .mk-av-cap span {
        opacity: 0.36;
        transition:
          opacity 0.18s ease,
          color 0.18s ease;
      }
      .mk-av-cap span.on {
        opacity: 1;
      }
      .mk-av-cap span.now {
        color: #dfe8ff;
      }
      .mk-av-detail {
        position: relative;
        width: 100%;
        max-height: 30vh;
        overflow-y: auto;
        padding: 12px 38px 12px 14px;
        border-radius: 14px;
        background: #0c0d10b3;
        border: 1px solid rgba(255, 255, 255, 0.09);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        font-size: 12.5px;
        line-height: 1.55;
        color: #ebecf0e0;
        white-space: pre-wrap;
      }
      .mk-av-detail > button {
        position: absolute;
        top: 8px;
        right: 8px;
        width: 26px;
        height: 26px;
        border-radius: 8px;
        border: 0;
        background: #ffffff0f;
        color: #cfd0d6;
        display: grid;
        place-items: center;
      }
      .mk-av-choice {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        justify-content: center;
        animation: mk-media-in 0.35s ease-out;
      }
      .mk-av-btn {
        height: 50px;
        padding: 0 18px;
        border-radius: 15px;
        border: 1px solid rgba(255, 255, 255, 0.14);
        background: #0e0f129e;
        color: #fff;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 11px;
        letter-spacing: 0.2em;
        text-transform: uppercase;
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
      }
      .mk-av-btn.is-primary {
        border-color: #cddaff73;
        background: #cddaff1a;
      }
      .mk-av-btn:hover {
        border-color: #ffffff4d;
      }
      .mk-av-bar {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 4px;
        padding: 5px;
        border-radius: 17px;
        background: #0e0f129e;
        border: 1px solid rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(16px);
        -webkit-backdrop-filter: blur(16px);
        animation: mk-media-in 0.35s ease-out;
      }
      .mk-av-bar input {
        flex: 1;
        min-width: 0;
        height: 42px;
        padding: 0 8px;
        border: 0;
        outline: none;
        background: transparent;
        color: #fff;
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 16px;
      }
      .mk-av-bar input::-moz-placeholder {
        color: #dcdee661;
        font-size: 13px;
      }
      .mk-av-bar input::placeholder {
        color: #dcdee661;
        font-size: 13px;
      }
      .mk-av-bar button {
        width: 42px;
        height: 42px;
        flex: none;
        border-radius: 13px;
        border: 0;
        background: transparent;
        color: #d9d9de;
        display: grid;
        place-items: center;
      }
      .mk-av-bar button:hover {
        background: #ffffff0f;
        color: #fff;
      }
      .mk-av-mic.is-on {
        color: #fff;
        background: #e5242b2e !important;
        box-shadow:
          0 0 0 1px #e5242b8c,
          0 0 18px -4px #e5242ba6;
        animation: mk-av-pulse 1.4s ease-in-out infinite;
      }
      .mk-av-mic.is-ask {
        box-shadow: 0 0 0 1px #cddaff99;
        animation: mk-av-pulse 1.4s ease-in-out infinite;
      }
      @keyframes mk-av-pulse {
        50% {
          transform: scale(1.06);
        }
      }
      .mk-av-status {
        font-family:
          Share Tech Mono,
          monospace;
        font-size: 9.5px;
        letter-spacing: 0.2em;
        text-transform: uppercase;
        color: #dcdee68c;
      }
      .mk-av.is-mini {
        left: calc(
          100vw - 84px - 12px - var(--rail-r, 0px) - var(--sai-r, 0px)
        );
        top: calc(
          100vh - 108px - 12px - max(var(--rail-b, 0px), var(--media-b, 0px)) -
            var(--sai-b, 0px)
        );
        top: calc(
          100dvh - 108px - 12px - max(var(--rail-b, 0px), var(--media-b, 0px)) -
            var(--sai-b, 0px)
        );
        width: 84px;
        height: 108px;
        z-index: 79;
        border-radius: 22px;
        cursor: pointer;
        background: #08090cc7;
        box-shadow:
          0 14px 40px -10px #000000d9,
          inset 0 0 0 1px #ffffff1f;
      }
      .mk-av-ring {
        position: absolute;
        top: -3px;
        right: -3px;
        bottom: -3px;
        left: -3px;
        border-radius: 25px;
        pointer-events: none;
        transition: box-shadow 0.3s ease;
      }
      .mk-av-ring[data-on="true"] {
        box-shadow:
          0 0 0 1.5px #e5242bcc,
          0 0 16px -2px #e5242b99;
        animation: mk-av-pulse 1.4s ease-in-out infinite;
      }
      .mk-av-bubble {
        position: absolute;
        right: calc(100% + 10px);
        bottom: 6px;
        width: -moz-max-content;
        width: max-content;
        max-width: min(260px, 62vw);
        padding: 9px 12px;
        border-radius: 14px 14px 4px;
        background: #0c0d10d6;
        border: 1px solid rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        font-size: 12.5px;
        line-height: 1.4;
        color: #eef0f6;
        pointer-events: none;
        animation: mk-media-in 0.25s ease-out;
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-av {
          transition: opacity 0.3s ease;
        }
      }
      .mk-fseq {
        --fw: min(520px, 78vw);
        --fh: calc(var(--fw) * 0.5625);
        position: relative;
        margin-top: 34px;
        height: calc(var(--fh) + 100vh);
      }
      @supports (height: 100svh) {
        .mk-fseq {
          height: calc(var(--fh) + 100svh);
        }
      }
      .mk-fseq-slot {
        width: var(--fw);
        aspect-ratio: 16 / 9;
        margin: 0 auto;
      }
      .mk-fseq-film {
        position: fixed;
        z-index: 0;
        left: 0;
        top: 0;
        width: 0;
        height: 0;
        overflow: hidden;
        visibility: hidden;
        pointer-events: none;
        contain: strict;
        background: #050505;
        --fx: 8%;
        --fyt: 11%;
        --fyb: 11%;
        --shade: 0;
        -webkit-mask-image:
          linear-gradient(
            to right,
            transparent 0,
            #000 var(--fx),
            #000 calc(100% - var(--fx)),
            transparent 100%
          ),
          linear-gradient(
            to bottom,
            transparent 0,
            #000 var(--fyt),
            #000 calc(100% - var(--fyb)),
            transparent 100%
          );
        -webkit-mask-composite: source-in;
        mask-image:
          linear-gradient(
            to right,
            transparent 0,
            #000 var(--fx),
            #000 calc(100% - var(--fx)),
            transparent 100%
          ),
          linear-gradient(
            to bottom,
            transparent 0,
            #000 var(--fyt),
            #000 calc(100% - var(--fyb)),
            transparent 100%
          );
        -webkit-mask-composite: source-in, xor;
        mask-composite: intersect;
      }
      .mk-fseq-film.is-full {
        -webkit-mask-image: none;
        mask-image: none;
      }
      .mk-fseq-film canvas {
        position: absolute;
        display: block;
      }
      .mk-fseq-shade {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        opacity: var(--shade);
        background:
          linear-gradient(to top, #050505b8, #05050500 28%),
          radial-gradient(circle at 50% 45%, #0000, #050505bf), #05050526;
      }
      .mk-fseq-hud {
        position: fixed;
        z-index: -1;
        left: 50%;
        transform: translate(-50%);
        top: 0;
        visibility: hidden;
        pointer-events: none;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 10px;
      }
      .mk-fseq-tl {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 10px;
        font:
          9px/1 Share Tech Mono,
          ui-monospace,
          monospace;
        letter-spacing: 0.2em;
        color: #ffffff6b;
        font-variant-numeric: tabular-nums;
      }
      .mk-fseq-bar {
        position: relative;
        flex: 1;
        height: 1px;
        background: #ffffff24;
      }
      .mk-fseq-bar > span {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background: var(--theme-accent, #e60000);
        transform-origin: 0 50%;
        transform: scaleX(0);
        box-shadow: 0 0 8px var(--theme-accent, #e60000);
      }
      .mk-fseq-copy {
        font:
          10px/1.2 Share Tech Mono,
          ui-monospace,
          monospace;
        letter-spacing: 0.3em;
        color: #fff6;
        text-align: center;
        white-space: nowrap;
      }
      .mk-silk {
        position: relative;
        height: 128px;
        margin: -2px -2px 10px;
        border-radius: 12px;
        overflow: hidden;
        background: #050507;
        box-shadow: inset 0 0 0 1px #ffffff0f;
      }
      .mk-silk canvas {
        display: block;
        width: 100%;
        height: 100%;
      }
      .mk-silk canvas.is-fallback {
        background:
          radial-gradient(
            60% 70% at 40% 55%,
            rgba(90, 140, 255, 0.35),
            transparent 60%
          ),
          radial-gradient(
            50% 60% at 62% 45%,
            rgba(255, 120, 40, 0.28),
            transparent 60%
          ),
          #050507;
      }
      .mk-silk-hint {
        position: absolute;
        left: 10px;
        bottom: 8px;
        font-size: 9px;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        color: #dcdee68c;
        pointer-events: none;
      }
      @media (min-width: 761px) {
        .mk-silk {
          height: 150px;
        }
      }
      .mk-dockpick {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 188;
        touch-action: none;
        overscroll-behavior: contain;
        --pick-dim-a: rgba(4, 4, 6, 0.46);
        --pick-dim-b: rgba(4, 4, 6, 0.84);
        --pad-line: rgba(255, 255, 255, 0.32);
        font-family:
          Share Tech Mono,
          ui-monospace,
          monospace;
        color: var(--rail-fg);
      }
      [data-skin="acad-light"].mk-dockpick {
        --pick-dim-a: rgba(247, 236, 225, 0.42);
        --pick-dim-b: rgba(247, 236, 225, 0.82);
        --pad-line: rgba(25, 25, 25, 0.36);
      }
      [data-skin="acad-dark"].mk-dockpick {
        --pick-dim-a: rgba(20, 20, 20, 0.5);
        --pick-dim-b: rgba(20, 20, 20, 0.86);
        --pad-line: rgba(247, 236, 225, 0.34);
      }
      .mk-rail.is-picking {
        z-index: 189;
        border-color: var(--rail-accent);
        box-shadow:
          0 0 0 1px var(--rail-accent),
          0 0 34px -8px var(--rail-accent),
          var(--rail-shadow);
      }
      .mk-dockpick-dim {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        cursor: pointer;
        background: radial-gradient(
          110% 80% at 50% 50%,
          var(--pick-dim-a),
          var(--pick-dim-b)
        );
        -webkit-backdrop-filter: blur(6px) saturate(115%);
        backdrop-filter: blur(6px) saturate(115%);
        animation: mk-pick-fade 0.24s ease-out both;
      }
      .mk-dockpick-cap {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 7px;
        text-align: center;
        pointer-events: none;
        animation: mk-pick-fade 0.35s 0.1s ease-out both;
      }
      .mk-dockpick-cap b {
        font-weight: 400;
        font-size: 11px;
        letter-spacing: 0.4em;
        padding-left: 0.4em;
        text-transform: uppercase;
        color: var(--rail-fg-hi);
      }
      .mk-dockpick-cap p {
        margin: 0;
        font-size: 9px;
        letter-spacing: 0.26em;
        text-transform: uppercase;
        opacity: 0.62;
      }
      .mk-dockpick-cap em {
        font-style: normal;
        font-size: 9px;
        letter-spacing: 0.26em;
        text-transform: uppercase;
        color: var(--rail-accent);
      }
      .mk-dockpick-mini {
        position: relative;
        width: 58px;
        height: 38px;
        margin-bottom: 8px;
        border-radius: 9px;
        border: 1px solid var(--rail-line);
        background: var(--rail-hover);
      }
      .mk-dockpick-mini i {
        position: absolute;
        border-radius: 3px;
        background: var(--rail-line);
      }
      .mk-dockpick-mini i[data-e="top"] {
        left: 14px;
        right: 14px;
        top: 4px;
        height: 3px;
      }
      .mk-dockpick-mini i[data-e="bottom"] {
        left: 14px;
        right: 14px;
        bottom: 4px;
        height: 3px;
      }
      .mk-dockpick-mini i[data-e="left"] {
        top: 9px;
        bottom: 9px;
        left: 4px;
        width: 3px;
      }
      .mk-dockpick-mini i[data-e="right"] {
        top: 9px;
        bottom: 9px;
        right: 4px;
        width: 3px;
      }
      .mk-dockpick[data-now="top"] i[data-e="top"],
      .mk-dockpick[data-now="bottom"] i[data-e="bottom"],
      .mk-dockpick[data-now="left"] i[data-e="left"],
      .mk-dockpick[data-now="right"] i[data-e="right"] {
        background: var(--rail-accent);
        box-shadow: 0 0 8px var(--rail-accent);
      }
      .mk-dockpad {
        position: fixed;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 0;
        border-radius: 18px;
        border: 1.5px dashed var(--pad-line);
        background: var(--rail-bg);
        color: var(--rail-fg-hi);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        transition:
          border-color 0.18s ease,
          box-shadow 0.18s ease,
          transform 0.18s ease;
        animation: mk-pad-in 0.46s cubic-bezier(0.2, 0.9, 0.25, 1.08) backwards;
        animation-delay: calc(var(--k) * 60ms + 60ms);
      }
      .mk-dockpad[data-edge="top"],
      .mk-dockpad[data-edge="bottom"] {
        width: var(--len);
        height: var(--thick);
        left: 50%;
        margin-left: calc(var(--len) / -2);
      }
      .mk-dockpad[data-edge="left"],
      .mk-dockpad[data-edge="right"] {
        width: var(--thick);
        height: var(--len);
        top: 50%;
        margin-top: calc(var(--len) / -2);
      }
      .mk-dockpad[data-edge="top"] {
        top: calc(10px + var(--sai-t));
        --dx: 0px;
        --dy: -22px;
      }
      .mk-dockpad[data-edge="bottom"] {
        bottom: calc(10px + var(--sai-b));
        --dx: 0px;
        --dy: 22px;
      }
      .mk-dockpad[data-edge="left"] {
        left: calc(10px + var(--sai-l));
        --dx: -22px;
        --dy: 0px;
      }
      .mk-dockpad[data-edge="right"] {
        right: calc(10px + var(--sai-r));
        --dx: 22px;
        --dy: 0px;
      }
      .mk-dockpad-cells {
        position: absolute;
        top: 4px;
        right: 4px;
        bottom: 4px;
        left: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        overflow: hidden;
        pointer-events: none;
      }
      .mk-dockpad[data-edge="left"] .mk-dockpad-cells,
      .mk-dockpad[data-edge="right"] .mk-dockpad-cells {
        flex-direction: column;
      }
      .mk-dockpad-cells i {
        position: relative;
        flex: 0 0 auto;
        width: 38px;
        height: 38px;
        border-radius: 12px;
        border: 1px solid var(--rail-line);
        background: var(--rail-hover);
      }
      .mk-dockpad-cells i:after {
        content: "";
        position: absolute;
        top: -1px;
        right: -1px;
        bottom: -1px;
        left: -1px;
        border-radius: inherit;
        background: var(--rail-accent);
        opacity: 0;
      }
      @media (hover: none) {
        .mk-dockpad-cells {
          gap: 3px;
        }
        .mk-dockpad-cells i {
          width: 42px;
          height: 42px;
        }
      }
      .mk-dockpad-pill {
        position: relative;
        z-index: 1;
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 8px 13px;
        border-radius: 13px;
        pointer-events: none;
        background: var(--rail-pop);
        border: 1px solid var(--rail-line);
        box-shadow: 0 8px 24px #00000052;
      }
      .mk-dockpad-pill em {
        font-style: normal;
        font-size: 10px;
        letter-spacing: 0.24em;
        padding-left: 0.1em;
        text-transform: uppercase;
      }
      .mk-dockpad[data-edge="left"] .mk-dockpad-pill,
      .mk-dockpad[data-edge="right"] .mk-dockpad-pill {
        flex-direction: column;
        gap: 5px;
        padding: 9px 4px;
      }
      .mk-dockpad[data-edge="left"] .mk-dockpad-pill em,
      .mk-dockpad[data-edge="right"] .mk-dockpad-pill em {
        font-size: 8.5px;
        letter-spacing: 0.1em;
        padding: 0;
      }
      .mk-dockpad:hover,
      .mk-dockpad:focus-visible {
        outline: none;
        border-style: solid;
        border-color: var(--rail-accent);
        box-shadow:
          0 0 0 1px var(--rail-accent),
          0 0 38px -8px var(--rail-accent);
      }
      .mk-dockpad:hover .mk-dockpad-cells i:after,
      .mk-dockpad:focus-visible .mk-dockpad-cells i:after {
        animation: mk-cell-wave 1s ease-in-out infinite;
        animation-delay: calc(var(--i) * 75ms);
      }
      .mk-dockpad:active {
        transform: scale(0.985);
      }
      .mk-dockpick.is-leaving .mk-dockpick-dim {
        animation: mk-pick-out 0.26s ease-in forwards;
      }
      .mk-dockpick.is-leaving .mk-dockpick-cap {
        animation: mk-pick-out 0.16s ease-in forwards;
      }
      .mk-dockpick.is-leaving .mk-dockpad {
        animation: mk-pad-out 0.2s ease-in forwards;
        pointer-events: none;
      }
      .mk-dockpick.is-leaving .mk-dockpad.is-picked {
        animation: mk-pad-picked 0.34s ease-out forwards;
        border-style: solid;
        border-color: var(--rail-accent);
      }
      .mk-dockpick.is-leaving .mk-dockpad.is-picked .mk-dockpad-cells i:after {
        animation: mk-cell-wave 0.5s ease-out 1;
        animation-delay: calc(var(--i) * 30ms);
      }
      @keyframes mk-pick-fade {
        0% {
          opacity: 0;
        }
        to {
          opacity: 1;
        }
      }
      @keyframes mk-pick-out {
        0% {
          opacity: 1;
        }
        to {
          opacity: 0;
        }
      }
      @keyframes mk-pad-in {
        0% {
          opacity: 0;
          transform: translate(var(--dx), var(--dy)) scale(0.97);
        }
        to {
          opacity: 1;
          transform: none;
        }
      }
      @keyframes mk-pad-out {
        to {
          opacity: 0;
          transform: scale(0.98);
        }
      }
      @keyframes mk-pad-picked {
        0% {
          opacity: 1;
          transform: none;
        }
        35% {
          opacity: 1;
          transform: scale(1.02);
        }
        to {
          opacity: 0;
          transform: scale(1);
        }
      }
      @keyframes mk-cell-wave {
        0%,
        to {
          opacity: 0;
        }
        50% {
          opacity: 0.4;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-dockpad,
        .mk-dockpick-dim,
        .mk-dockpick-cap {
          animation-duration: 0.01ms !important;
          animation-delay: 0s !important;
        }
        .mk-dockpad:hover .mk-dockpad-cells i:after {
          animation: none;
        }
      }
      .mk-rail {
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
      }
      .mk-rail-btn[data-rail-btn="__dock"] {
        touch-action: none;
        cursor: grab;
      }
      .mk-rail.is-dragging {
        z-index: 189;
        cursor: grabbing;
        transition: none;
        will-change: transform;
        border-color: var(--rail-accent);
        box-shadow:
          0 0 0 1px var(--rail-accent),
          0 28px 60px #0009,
          0 0 40px -8px var(--rail-accent);
      }
      .mk-rail.is-dragging .mk-rail-btn,
      .mk-dockpick.is-drag {
        pointer-events: none;
      }
      .mk-dockpick.is-drag .mk-dockpick-dim {
        cursor: grabbing;
      }
      .mk-dockpad.is-hot {
        border-style: solid;
        border-color: var(--rail-accent);
        box-shadow:
          0 0 0 1px var(--rail-accent),
          0 0 46px -6px var(--rail-accent);
      }
      .mk-dockpad.is-hot .mk-dockpad-cells i:after {
        animation: mk-cell-wave 1s ease-in-out infinite;
        animation-delay: calc(var(--i) * 75ms);
      }
      .mk-dockpad.is-hot .mk-dockpad-pill {
        border-color: var(--rail-accent);
        color: var(--rail-accent);
      }
      .mk-media {
        transition:
          left 0.42s cubic-bezier(0.22, 1, 0.36, 1),
          top 0.42s cubic-bezier(0.22, 1, 0.36, 1),
          width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
          height 0.38s cubic-bezier(0.22, 1, 0.36, 1);
      }
      .mk-media.is-dragging {
        transition:
          width 0.26s ease,
          height 0.26s ease;
        cursor: grabbing;
      }
      .mk-media .mk-dock-bar.mk-media-bar {
        width: 100%;
        height: 100%;
        margin: 0;
      }
      .mk-media.is-dragging .mk-dock-bar {
        box-shadow:
          0 0 0 1px var(--theme-accent),
          0 22px 50px #000000a6,
          0 0 30px -8px var(--theme-accent);
      }
      .mk-media-prog-fill {
        height: 100%;
        transform-origin: 0 50%;
        transform: scaleX(var(--p, 0));
        background: var(--theme-accent);
      }
      .mk-media.is-vertical .mk-media-bar {
        flex-direction: column;
        padding: 3px 0;
      }
      .mk-media.is-vertical .mk-media-half {
        flex-direction: column;
        width: 100%;
        height: auto;
        min-height: 0;
      }
      .mk-media.is-vertical .mk-media-bar.is-pill .mk-media-half {
        justify-content: center;
      }
      .mk-media.is-vertical .mk-media-rest {
        width: calc(100% - 6px);
        height: 100%;
      }
      .mk-media.is-vertical .mk-media-sep {
        width: 46%;
        height: 1px;
      }
      .mk-media.is-vertical .mk-media-grip {
        width: 60%;
        height: 26px;
        border: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.08);
        border-bottom: 1px solid rgba(255, 255, 255, 0.08);
        padding: 0;
      }
      .mk-media.is-vertical .mk-media-grip svg {
        transform: rotate(90deg);
      }
      .mk-media.is-vertical .mk-media-prog {
        left: auto;
        right: 0;
        top: 0;
        bottom: 0;
        width: 2px;
        height: auto;
      }
      .mk-media.is-vertical[data-edge="right"] .mk-media-prog {
        right: auto;
        left: 0;
      }
      .mk-media.is-vertical .mk-media-prog-fill {
        width: 100%;
        height: 100%;
        transform-origin: 50% 0;
        transform: scaleY(var(--p, 0));
      }
      .mk-media.is-vertical .mk-media-half.is-shown {
        animation-name: mk-media-in-x;
      }
      @keyframes mk-media-in-x {
        0% {
          opacity: 0;
          transform: translate(3px);
        }
        to {
          opacity: 1;
          transform: none;
        }
      }
      .mk-media.is-vertical[data-edge="left"] .mk-chev {
        transform: rotate(90deg) !important;
      }
      .mk-media.is-vertical[data-edge="left"] .mk-chev.is-open,
      .mk-media.is-vertical[data-edge="right"] .mk-chev {
        transform: rotate(-90deg) !important;
      }
      .mk-media.is-vertical[data-edge="right"] .mk-chev.is-open {
        transform: rotate(90deg) !important;
      }
      .mk-media.is-vertical .mk-media-pop {
        width: min(300px, var(--pop-max, calc(100vw - 96px))) !important;
        max-height: calc(100vh - 24px);
        overflow-y: auto;
      }
      .mk-media.is-vertical[data-edge="left"] .mk-media-pop {
        left: calc(100% + 8px);
        right: auto;
      }
      .mk-media.is-vertical[data-edge="right"] .mk-media-pop {
        left: auto;
        right: calc(100% + 8px);
      }
      .mk-media-ghost {
        position: fixed;
        z-index: 77;
        pointer-events: none;
        border-radius: 13px;
        border: 1.5px dashed var(--theme-accent, #e60000);
        background: #08080a59;
        box-shadow: 0 0 24px -6px var(--theme-accent, #e60000);
        transition:
          left 0.2s ease,
          top 0.2s ease,
          width 0.26s ease,
          height 0.26s ease;
        animation: mk-pick-fade 0.2s ease-out both;
      }
      .mk-av.is-mini {
        background: radial-gradient(
          closest-side,
          #0506089e,
          #05060847 62%,
          #05060800
        );
        box-shadow: none;
        border-radius: 50%;
        touch-action: none;
        cursor: grab;
      }
      .mk-av.is-mini .mk-av-frame {
        border-radius: 0;
        overflow: visible;
      }
      .mk-av.is-mini.is-sliding {
        transition: none;
        cursor: grabbing;
      }
      .mk-av.is-mini .mk-av-ring {
        top: 6px;
        right: 6px;
        bottom: 6px;
        left: 6px;
        border-radius: 50%;
      }
      .mk-av.is-mini .mk-av-ring[data-on="true"] {
        box-shadow: none;
        background: radial-gradient(closest-side, #e5242b4d, #e5242b00);
      }
      .mk-av.is-mini.is-left .mk-av-bubble {
        right: auto;
        left: calc(100% + 10px);
        border-radius: 14px 14px 14px 4px;
      }
      @keyframes mk-zap {
        0% {
          filter: brightness(2.6) saturate(1.4);
          transform: scale(0.9);
        }
        40% {
          filter: brightness(1.7);
          transform: scale(1.05);
        }
        to {
          filter: none;
          transform: none;
        }
      }
      @keyframes mk-sweep {
        0% {
          background-position: 135% 0;
          opacity: 1;
        }
        to {
          background-position: -35% 0;
          opacity: 0;
        }
      }
      @keyframes mk-menu-boot {
        0% {
          opacity: 0;
          clip-path: inset(0 0 100% 0);
          border-color: var(--rail-accent);
          box-shadow: 0 0 26px -2px var(--rail-accent);
        }
        55% {
          opacity: 1;
          clip-path: inset(0 0 0 0);
          border-color: var(--rail-accent);
        }
        to {
          opacity: 1;
          clip-path: inset(0 0 0 0);
        }
      }
      @keyframes mk-item-in {
        0% {
          opacity: 0;
          transform: translate(-6px);
        }
        to {
          opacity: 1;
          transform: none;
        }
      }
      @keyframes mk-deny {
        0%,
        to {
          transform: translate(0);
        }
        20% {
          transform: translate(-3px);
        }
        40% {
          transform: translate(3px);
        }
        60% {
          transform: translate(-2px);
        }
        80% {
          transform: translate(2px);
        }
      }
      .mk-rail-btn,
      .mk-rail-menu-item,
      .mk-media-rest,
      .mk-dock-btn,
      .mk-dock-num {
        -webkit-tap-highlight-color: transparent;
      }
      .mk-rail-btn:before,
      .mk-media-rest:before,
      .mk-dock-btn:before,
      .mk-dock-num:before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-radius: inherit;
        pointer-events: none;
        opacity: 0;
        background: linear-gradient(
          105deg,
          transparent 38%,
          color-mix(
              in srgb,
              var(--rail-accent, var(--theme-accent, #e60000)) 55%,
              #fff 20%
            )
            50%,
          transparent 62%
        );
        background-size: 260% 100%;
        background-position: 135% 0;
      }
      .mk-media-rest,
      .mk-dock-btn,
      .mk-dock-num {
        position: relative;
      }
      @media (hover: hover) {
        .mk-rail-btn:hover:not(.is-active) {
          color: var(--rail-fg-hi);
          background: color-mix(
            in srgb,
            var(--rail-accent) 13%,
            var(--rail-hover)
          );
          border-color: color-mix(in srgb, var(--rail-accent) 75%, transparent);
          box-shadow:
            0 0 0 1px color-mix(in srgb, var(--rail-accent) 32%, transparent),
            0 0 16px -3px var(--rail-accent),
            inset 0 0 12px -6px var(--rail-accent);
        }
        .mk-rail-btn:hover:not(.is-active) .mk-rail-ico {
          filter: drop-shadow(0 0 5px var(--rail-accent));
        }
        .mk-rail-btn:hover:before {
          animation: mk-sweep 0.44s ease-out 1 both;
        }
        .mk-rail-btn.is-active:hover {
          box-shadow:
            0 0 0 1px var(--rail-accent),
            0 0 18px -2px var(--rail-accent);
        }
      }
      .mk-rail-btn:active:not(.is-active),
      .mk-rail-btn.is-zap:not(.is-active) {
        color: var(--rail-fg-hi);
        background: color-mix(
          in srgb,
          var(--rail-accent) 26%,
          var(--rail-hover)
        );
        border-color: var(--rail-accent);
        box-shadow:
          0 0 0 1px var(--rail-accent),
          0 0 22px -2px var(--rail-accent),
          inset 0 0 14px -4px var(--rail-accent);
      }
      .mk-rail-btn.is-zap {
        animation: mk-zap 0.28s cubic-bezier(0.2, 0.8, 0.2, 1) 1;
      }
      .mk-rail-btn.is-zap:before {
        animation: mk-sweep 0.3s ease-out 1 both;
      }
      .mk-rail-btn:focus-visible {
        outline: none;
        border-color: var(--rail-accent);
        box-shadow:
          0 0 0 1px var(--rail-accent),
          0 0 14px -2px var(--rail-accent);
      }
      .mk-rail-pop .mk-rail-menu {
        animation: mk-menu-boot 0.22s cubic-bezier(0.2, 0.9, 0.25, 1) backwards;
      }
      .mk-rail-pop .mk-rail-menu-item {
        animation: mk-item-in 0.2s ease-out backwards;
      }
      .mk-rail-pop .mk-rail-menu-item:nth-child(2) {
        animation-delay: 0.02s;
      }
      .mk-rail-pop .mk-rail-menu-item:nth-child(3) {
        animation-delay: 0.04s;
      }
      .mk-rail-pop .mk-rail-menu-item:nth-child(4) {
        animation-delay: 0.06s;
      }
      .mk-rail-pop .mk-rail-menu-item:nth-child(5) {
        animation-delay: 0.08s;
      }
      .mk-rail-pop .mk-rail-menu-item:nth-child(n + 6) {
        animation-delay: 0.1s;
      }
      .mk-rail-menu-item {
        position: relative;
        transition:
          background-color 0.12s ease,
          color 0.12s ease,
          text-shadow 0.12s ease,
          padding-left 0.12s ease;
        -webkit-tap-highlight-color: transparent;
      }
      .mk-rail-menu-item:before {
        content: "";
        position: absolute;
        left: 2px;
        top: 22%;
        bottom: 22%;
        width: 2px;
        border-radius: 2px;
        pointer-events: none;
        background: var(--rail-accent);
        box-shadow:
          0 0 8px var(--rail-accent),
          0 0 2px var(--rail-accent);
        transform: scaleY(0);
        transition: transform 0.14s ease;
      }
      @media (hover: hover) {
        .mk-rail-menu-item:hover {
          color: var(--rail-fg-hi);
          padding-left: 13px;
          text-shadow: 0 0 9px var(--rail-accent);
          background: linear-gradient(
            90deg,
            color-mix(in srgb, var(--rail-accent) 18%, transparent),
            color-mix(in srgb, var(--rail-accent) 3%, transparent)
          );
        }
        .mk-rail-menu-item:hover:before {
          transform: scaleY(1);
        }
      }
      .mk-rail-menu-item:active,
      .mk-rail-menu-item.is-zap {
        color: var(--rail-fg-hi);
        padding-left: 13px;
        text-shadow: 0 0 10px var(--rail-accent);
        background: linear-gradient(
          90deg,
          color-mix(in srgb, var(--rail-accent) 34%, transparent),
          color-mix(in srgb, var(--rail-accent) 6%, transparent)
        );
      }
      .mk-rail-menu-item:active:before,
      .mk-rail-menu-item.is-zap:before,
      .mk-rail-menu-item.is-on:before {
        transform: scaleY(1);
      }
      .mk-rail-menu-item.is-zap {
        animation: mk-zap 0.26s cubic-bezier(0.2, 0.8, 0.2, 1) 1;
      }
      .mk-rail-menu-item.is-on {
        text-shadow: 0 0 10px var(--rail-accent);
      }
      .mk-rail-menu-item:focus-visible {
        outline: none;
        background: color-mix(in srgb, var(--rail-accent) 14%, transparent);
      }
      .mk-rail-menu-item:focus-visible:before {
        transform: scaleY(1);
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-rail-pop .mk-rail-menu,
        .mk-rail-pop .mk-rail-menu-item,
        .mk-rail-btn.is-zap,
        .mk-rail-menu-item.is-zap {
          animation: none;
        }
        .mk-rail-btn:hover:before {
          animation: none;
        }
      }
      .mk-media-rest {
        cursor: pointer;
      }
      @media (hover: hover) {
        .mk-media-bar.is-pill:hover {
          border-color: color-mix(
            in srgb,
            var(--theme-accent, #e60000) 70%,
            transparent
          );
          box-shadow:
            0 0 0 1px
              color-mix(in srgb, var(--theme-accent, #e60000) 30%, transparent),
            0 0 20px -4px var(--theme-accent, #e60000),
            0 10px 30px #0000008c;
        }
        .mk-media-rest:hover {
          color: #fff;
          background: color-mix(
            in srgb,
            var(--theme-accent, #e60000) 16%,
            rgba(255, 255, 255, 0.04)
          );
          box-shadow: inset 0 0 12px -5px var(--theme-accent, #e60000);
        }
        .mk-media-rest:hover .mk-media-ico {
          color: #fff;
          filter: drop-shadow(0 0 6px var(--theme-accent, #e60000));
        }
        .mk-media-rest:hover:before {
          animation: mk-sweep 0.44s ease-out 1 both;
        }
        .mk-dock-btn:not(:disabled):hover,
        .mk-dock-num:hover {
          color: #fff;
          border-color: var(--theme-accent, #e60000);
          box-shadow:
            0 0 12px -2px var(--theme-accent, #e60000),
            inset 0 0 8px -4px var(--theme-accent, #e60000);
        }
        .mk-dock-btn:not(:disabled):hover:before,
        .mk-dock-num:hover:before {
          animation: mk-sweep 0.4s ease-out 1 both;
        }
      }
      .mk-media-rest:active,
      .mk-media-rest.is-zap {
        color: #fff;
        background: color-mix(
          in srgb,
          var(--theme-accent, #e60000) 30%,
          rgba(255, 255, 255, 0.04)
        );
        box-shadow:
          inset 0 0 14px -3px var(--theme-accent, #e60000),
          0 0 16px -2px var(--theme-accent, #e60000);
      }
      .mk-media-rest:active .mk-media-ico,
      .mk-media-rest.is-zap .mk-media-ico {
        color: #fff;
        filter: drop-shadow(0 0 8px var(--theme-accent, #e60000));
      }
      .mk-dock-btn:not(:disabled):active,
      .mk-dock-num:active,
      .mk-dock-btn.is-zap,
      .mk-dock-num.is-zap {
        color: #fff;
        border-color: var(--theme-accent, #e60000);
        background: color-mix(
          in srgb,
          var(--theme-accent, #e60000) 28%,
          rgba(255, 255, 255, 0.05)
        );
        box-shadow: 0 0 16px -2px var(--theme-accent, #e60000);
      }
      .mk-media-rest.is-zap,
      .mk-dock-btn.is-zap,
      .mk-dock-num.is-zap {
        animation: mk-zap 0.26s cubic-bezier(0.2, 0.8, 0.2, 1) 1;
      }
      .mk-media-rest:focus-visible {
        outline: none;
        box-shadow:
          inset 0 0 0 1px var(--theme-accent, #e60000),
          0 0 12px -2px var(--theme-accent, #e60000);
      }
      .mk-dockpad.is-locked {
        cursor: not-allowed;
        border-style: dotted;
        background: color-mix(in srgb, var(--rail-bg) 70%, transparent);
        opacity: 0.62;
        filter: saturate(0.4);
      }
      .mk-dockpad.is-locked .mk-dockpad-pill {
        color: var(--rail-fg);
      }
      .mk-dockpad.is-locked .mk-dockpad-cells {
        opacity: 0.4;
      }
      .mk-dockpad.is-locked:hover,
      .mk-dockpad.is-locked:focus-visible {
        border-style: dotted;
        border-color: var(--pad-line);
        box-shadow: none;
      }
      .mk-dockpad.is-locked:hover .mk-dockpad-cells i:after {
        animation: none;
      }
      .mk-dockpad.is-locked:active {
        transform: none;
      }
      .mk-dockpad.is-denied {
        opacity: 0.9;
        filter: none;
        border-style: solid;
        border-color: #ff2a55;
        box-shadow:
          0 0 0 1px #ff2a55,
          0 0 34px -6px #ff2a55;
        animation: mk-deny 0.32s linear infinite;
      }
      .mk-dockpad.is-denied .mk-dockpad-pill {
        color: #ff6b88;
        border-color: #ff2a55;
      }
      .mk-dockpad.is-zap:not(.is-locked) {
        animation: mk-zap 0.26s cubic-bezier(0.2, 0.8, 0.2, 1) 1;
      }
      .mk-media.is-merged {
        transition:
          left 0.42s cubic-bezier(0.22, 1, 0.36, 1),
          top 0.42s cubic-bezier(0.22, 1, 0.36, 1),
          width 0.38s cubic-bezier(0.22, 1, 0.36, 1),
          height 0.38s cubic-bezier(0.22, 1, 0.36, 1),
          opacity 0.22s ease;
      }
      html[data-rail-drag] .mk-media.is-merged {
        opacity: 0;
        pointer-events: none !important;
      }
      html[data-rail-drag] .mk-media.is-merged * {
        pointer-events: none !important;
      }
      .mk-media.is-merged .mk-dock-bar.mk-media-bar {
        border-radius: 10px;
        padding: 0 3px;
      }
      .mk-media.is-merged.is-vertical .mk-dock-bar.mk-media-bar {
        padding: 3px 0;
      }
      .mk-media.is-merged .mk-media-bar.is-pill .mk-media-rest {
        height: calc(100% - 2px);
        border-radius: 7px;
      }
      .mk-media.is-merged.is-vertical .mk-media-bar.is-pill .mk-media-rest {
        width: calc(100% - 2px);
        height: 100%;
      }
      .mk-media.is-merged .mk-media-bar.is-pill .mk-media-ico {
        width: 16px;
        height: 16px;
        border-radius: 6px;
      }
      .mk-media.is-merged .mk-media-bar.is-pill .mk-media-ico svg {
        width: 12px;
        height: 12px;
      }
      .mk-media.is-merged .mk-media-bar.is-pill .mk-media-prog {
        height: 1.5px;
      }
      .mk-media.is-detached .mk-dock-bar {
        border-color: color-mix(
          in srgb,
          var(--theme-accent, #e60000) 55%,
          rgba(255, 255, 255, 0.12)
        );
        box-shadow:
          0 0 16px -6px var(--theme-accent, #e60000),
          0 10px 30px #0000008c;
        cursor: grab;
      }
      .mk-media.is-detached.is-dragging .mk-dock-bar {
        cursor: grabbing;
      }
      @keyframes mk-detach-a {
        0% {
          filter: brightness(2.2);
          box-shadow:
            0 0 0 2px var(--theme-accent, #e60000),
            0 0 40px 2px var(--theme-accent, #e60000);
        }
        to {
          filter: none;
        }
      }
      @keyframes mk-detach-b {
        0% {
          filter: brightness(2.2);
          box-shadow:
            0 0 0 2px var(--theme-accent, #e60000),
            0 0 40px 2px var(--theme-accent, #e60000);
        }
        to {
          filter: none;
        }
      }
      .mk-media.is-flash-a .mk-dock-bar {
        animation: mk-detach-a 0.7s ease-out 1;
      }
      .mk-media.is-flash-b .mk-dock-bar {
        animation: mk-detach-b 0.7s ease-out 1;
      }
      .mk-media-note {
        position: absolute;
        z-index: 3;
        white-space: nowrap;
        pointer-events: none;
        padding: 5px 10px;
        border-radius: 9px;
        font:
          9px/1.3 Share Tech Mono,
          ui-monospace,
          monospace;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: #fff;
        background: #08080aeb;
        border: 1px solid var(--theme-accent, #e60000);
        box-shadow: 0 0 18px -4px var(--theme-accent, #e60000);
        animation: mk-item-in 0.2s ease-out both;
        max-width: calc(100vw - 24px);
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .mk-media-note.is-up {
        bottom: calc(100% + 8px);
        left: 50%;
        translate: -50% 0;
      }
      .mk-media-note.is-down {
        top: calc(100% + 8px);
        left: 50%;
        translate: -50% 0;
      }
      .mk-media-note.is-right {
        left: calc(100% + 8px);
        top: 50%;
        translate: 0 -50%;
        white-space: normal;
        width: 150px;
      }
      .mk-media-note.is-left {
        right: calc(100% + 8px);
        top: 50%;
        translate: 0 -50%;
        white-space: normal;
        width: 150px;
      }
      @media (max-width: 1480px) {
        html[data-dock="right"] body {
          padding-right: max(var(--rail-r, 0px), var(--media-r, 0px));
        }
        html[data-dock="left"] body {
          padding-left: max(var(--rail-l, 0px), var(--media-l, 0px));
        }
      }
      .mk-av-gate {
        transform: none !important;
        gap: 14px;
      }
      .mk-av-dbtn {
        position: relative;
        width: min(280px, 66vw);
        border: 0;
        padding: 0;
        background: transparent;
        border-radius: 14px;
        cursor: pointer;
        -webkit-tap-highlight-color: transparent;
        outline: none;
      }
      .mk-av-dbtn:focus-visible {
        box-shadow:
          0 0 0 1px #cddaff73,
          0 0 26px -8px #cddaff80;
      }
      .mk-av-dword {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        display: flex;
        align-items: baseline;
        justify-content: center;
        gap: 0.32em;
        color: transparent;
        font-family:
          Oxanium,
          Bebas Neue,
          sans-serif;
        font-weight: 700;
        font-size: clamp(26px, 7.4vw, 40px);
        letter-spacing: 0.12em;
        line-height: 1;
        padding-top: 0.18em;
      }
      .mk-av-dword small {
        font-size: 0.6em;
        font-weight: 500;
        letter-spacing: 0.04em;
      }
      .mk-av-gate.is-plain .mk-av-dword {
        color: #d6deff;
        text-shadow: 0 0 14px rgba(205, 218, 255, 0.35);
      }
      .mk-av-gate.is-plain .mk-av-dbtn:hover .mk-av-dword {
        color: #fff;
        text-shadow: 0 0 18px rgba(205, 218, 255, 0.7);
      }
      .mk-av.is-gather {
        background: transparent !important;
        pointer-events: none;
      }
      .mk-av.ph-leaving.is-gather {
        opacity: 1;
      }
      .mk-av.is-gather:before {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        pointer-events: none;
        background: radial-gradient(90% 70% at 50% 38%, #0b0d11, #050608 70%);
        animation: mk-av-unveil 0.9s ease forwards;
      }
      .mk-av.is-gather .mk-av-head,
      .mk-av.is-gather .mk-av-bottom {
        opacity: 0;
        transition: opacity 0.25s ease;
      }
      @keyframes mk-av-unveil {
        to {
          opacity: 0;
        }
      }
      .mk-badge {
        position: fixed;
        z-index: 76;
        padding: 0;
        border: 0;
        background: transparent;
        border-radius: 50%;
        cursor: pointer;
        opacity: 0;
        pointer-events: none;
        transform: scale(0.86);
        -webkit-tap-highlight-color: transparent;
        outline: none;
        transition:
          opacity 0.45s ease,
          transform 0.55s cubic-bezier(0.22, 1.4, 0.36, 1),
          left 0.55s cubic-bezier(0.3, 1.45, 0.5, 1),
          top 0.55s cubic-bezier(0.3, 1.45, 0.5, 1),
          width 0.55s cubic-bezier(0.3, 1.45, 0.5, 1),
          height 0.55s cubic-bezier(0.3, 1.45, 0.5, 1);
      }
      .mk-badge.is-shown {
        opacity: 1;
        pointer-events: auto;
        transform: none;
      }
      .mk-badge-disc {
        position: absolute;
        top: -1px;
        right: -1px;
        bottom: -1px;
        left: -1px;
        border-radius: 50%;
        background: #010001;
        box-shadow: 0 6px 18px -6px #000000b3;
        transition: box-shadow 0.35s ease;
      }
      .mk-badge-ring,
      .mk-badge-12 {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: block;
        pointer-events: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        -webkit-user-drag: none;
        transition:
          filter 0.3s ease,
          opacity 0.4s ease,
          transform 0.5s cubic-bezier(0.3, 1.4, 0.5, 1);
      }
      .mk-badge-ring {
        filter: brightness(1.35);
      }
      .mk-badge-12 {
        transform: scale(1.2);
        filter: brightness(1.2) contrast(1.1);
      }
      .mk-badge.is-occupied .mk-badge-12 {
        opacity: 0;
        transform: scale(1.5);
      }
      .mk-badge-sheen {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        border-radius: 50%;
        overflow: hidden;
        pointer-events: none;
        mix-blend-mode: screen;
      }
      .mk-badge-sheen:after {
        content: "";
        position: absolute;
        top: -20%;
        bottom: -20%;
        width: 34%;
        left: -50%;
        background: linear-gradient(100deg, #cddaff00, #cddaff61, #cddaff00);
        transform: skew(-18deg);
        animation: mk-badge-sheen 4.4s ease-in-out 1.2s infinite;
      }
      @keyframes mk-badge-sheen {
        0% {
          left: -50%;
        }
        32%,
        to {
          left: 130%;
        }
      }
      .mk-badge.is-occupied .mk-badge-sheen {
        display: none;
      }
      @media (hover: hover) {
        .mk-badge.is-shown:hover .mk-badge-ring {
          filter: brightness(1.9) drop-shadow(0 0 6px rgba(205, 218, 255, 0.5));
        }
        .mk-badge.is-shown:hover .mk-badge-12 {
          filter: brightness(1.55) contrast(1.1);
        }
      }
      .mk-badge:focus-visible .mk-badge-disc {
        box-shadow: 0 0 0 1px #cddaff80;
      }
      .mk-badge.is-near .mk-badge-disc {
        box-shadow: 0 0 22px -2px #cddaff8c;
      }
      .mk-badge.is-near .mk-badge-ring {
        filter: brightness(2);
      }
      .mk-badge.is-jelly {
        animation: mk-jelly 0.7s cubic-bezier(0.3, 1.4, 0.5, 1) 1;
      }
      .mk-mark-cover {
        position: fixed;
        z-index: 5;
        pointer-events: none;
        border-radius: 50%;
        background: radial-gradient(
          closest-side,
          #06070af5,
          #06070ae6 52%,
          #06070a00
        );
      }
      @keyframes mk-jelly {
        0% {
          transform: scale(1);
        }
        22% {
          transform: scale(1.09, 0.92);
        }
        44% {
          transform: scale(0.95, 1.06);
        }
        64% {
          transform: scale(1.03, 0.98);
        }
        82% {
          transform: scale(0.99, 1.01);
        }
        to {
          transform: scale(1);
        }
      }
      .mk-av.is-mini.is-docked {
        border-radius: 50%;
        background: radial-gradient(
          closest-side,
          #080a0ee6,
          #080a0e8c 80%,
          #080a0e00
        );
      }
      .mk-av.is-mini.is-docked .mk-av-frame {
        border-radius: 50%;
        overflow: hidden;
      }
      .mk-av.is-mini.is-docked .mk-av-ring {
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
      }
      .mk-av.is-mini.is-jelly {
        animation: mk-jelly 0.68s cubic-bezier(0.3, 1.4, 0.5, 1) 1;
      }
      .mk-av.is-mini.is-sliding {
        transition:
          width 0.28s cubic-bezier(0.22, 1, 0.36, 1),
          height 0.28s cubic-bezier(0.22, 1, 0.36, 1),
          top 0.28s cubic-bezier(0.22, 1, 0.36, 1),
          border-radius 0.28s ease;
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-badge.is-jelly,
        .mk-av.is-mini.is-jelly {
          animation: none;
        }
      }
      .mk-media-half.mk-media-mini {
        flex: 0 0 34px;
      }
      @media (hover: none) {
        .mk-media-half.mk-media-mini {
          flex-basis: 40px;
        }
      }
      .mk-media.is-vertical .mk-media-half.mk-media-mini {
        flex: 0 0 34px;
        width: 100%;
      }
      .mk-media-mini .mk-media-rest {
        width: 100%;
      }
      .mk-accent-dot {
        width: 9px;
        height: 9px;
        border-radius: 50%;
        display: block;
        transition: transform 0.2s ease;
      }
      .mk-media .mk-media-ico {
        transition:
          transform 0.2s cubic-bezier(0.22, 1.4, 0.36, 1),
          color 0.2s ease,
          filter 0.2s ease;
      }
      @media (hover: hover) {
        .mk-media-rest:hover .mk-media-ico {
          transform: scale(1.18);
        }
      }
      .mk-media-rest:active .mk-media-ico,
      .mk-media-rest.is-zap .mk-media-ico {
        transform: scale(1.24);
      }
      .mk-media-rest.is-on .mk-media-ico {
        color: #fff;
        filter: drop-shadow(0 0 6px var(--theme-accent, #e60000));
      }
      .mk-media-rest.is-on {
        background: color-mix(
          in srgb,
          var(--theme-accent, #e60000) 14%,
          rgba(255, 255, 255, 0.04)
        );
      }
      .mk-media-pop.mk-accent-pop {
        width: 272px !important;
        max-width: calc(100vw - 16px);
      }
      .mk-media:not(.is-vertical) .mk-media-pop.mk-accent-pop {
        left: 50%;
        transform: translate(-50%);
      }
      .mk-accent-grid {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 6px;
      }
      .mk-accent-sw {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 5px;
        padding: 7px 2px 6px;
        border-radius: 10px;
        border: 1px solid rgba(255, 255, 255, 0.06);
        background: #ffffff05;
        color: #9a9aa2;
        font-size: 7px;
        letter-spacing: 0.1em;
        min-width: 0;
        overflow: hidden;
        text-transform: uppercase;
        cursor: pointer;
        transition:
          border-color 0.2s ease,
          box-shadow 0.2s ease,
          color 0.2s ease,
          transform 0.2s cubic-bezier(0.22, 1.4, 0.36, 1);
      }
      .mk-accent-chip {
        width: 16px;
        height: 16px;
        border-radius: 50%;
        background: var(--sw);
        box-shadow: 0 0 10px -2px var(--sw);
      }
      .mk-accent-name {
        white-space: nowrap;
      }
      .mk-accent-sw:hover {
        color: #fff;
        border-color: var(--sw);
        box-shadow: 0 0 14px -4px var(--sw);
        transform: translateY(-1px);
      }
      .mk-accent-sw.is-on {
        color: #fff;
        border-color: var(--sw);
        background: color-mix(in srgb, var(--sw) 14%, transparent);
      }
      .mk-term-chip {
        position: fixed;
        z-index: 79;
        padding: 0;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        cursor: pointer;
        color: var(--term-accent, #5eead4);
        border-radius: 24px;
        background: #060708e0;
        backdrop-filter: blur(14px) saturate(120%);
        -webkit-backdrop-filter: blur(14px) saturate(120%);
        border: 1px solid
          color-mix(in srgb, var(--term-accent, #5eead4) 55%, transparent);
        box-shadow:
          0 10px 26px -8px #000000d9,
          0 0 18px -6px var(--term-accent, #5eead4);
        -webkit-tap-highlight-color: transparent;
        outline: none;
        animation: mk-chip-in 0.4s cubic-bezier(0.3, 1.5, 0.5, 1) both;
        transition:
          left 0.35s ease,
          top 0.35s ease,
          transform 0.2s ease,
          box-shadow 0.2s ease;
      }
      .mk-term-chip:hover {
        transform: scale(1.08);
        box-shadow:
          0 10px 26px -8px #000000d9,
          0 0 22px -2px var(--term-accent, #5eead4);
      }
      .mk-term-chip:active {
        transform: scale(0.94);
      }
      .mk-term-chip:focus-visible {
        box-shadow: 0 0 0 2px
          color-mix(in srgb, var(--term-accent, #5eead4) 70%, transparent);
      }
      .mk-term-chip-ico {
        display: flex;
        align-items: flex-end;
        gap: 2px;
      }
      .mk-term-chip-cur {
        width: 9px;
        height: 2.5px;
        margin-bottom: 4px;
        background: currentColor;
        animation: mk-chip-blink 1.05s steps(2, jump-none) infinite;
      }
      .mk-term-chip-lbl {
        font:
          8px/1 Share Tech Mono,
          ui-monospace,
          monospace;
        letter-spacing: 0.26em;
        text-transform: uppercase;
        color: color-mix(in srgb, var(--term-accent, #5eead4) 70%, #fff 0%);
        opacity: 0.8;
      }
      .mk-term-chip-dot {
        position: absolute;
        top: 9px;
        right: 9px;
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--theme-accent, #e5242b);
        box-shadow: 0 0 8px var(--theme-accent, #e5242b);
        animation: mk-chip-pulse 1.4s ease-in-out infinite;
      }
      @keyframes mk-chip-in {
        0% {
          opacity: 0;
          transform: scale(0.4);
        }
        to {
          opacity: 1;
          transform: scale(1);
        }
      }
      @keyframes mk-chip-blink {
        50% {
          opacity: 0;
        }
      }
      @keyframes mk-chip-pulse {
        50% {
          transform: scale(1.35);
        }
      }
      .mk-jd {
        position: fixed;
        z-index: 62;
        padding: 0;
        border: 0;
        background: transparent;
        cursor: pointer;
        outline: none;
        overflow: visible;
        -webkit-tap-highlight-color: transparent;
        touch-action: manipulation;
        opacity: 0;
        pointer-events: none;
        transform: translateY(-14px) scale(0.7);
        transition:
          opacity 0.35s ease,
          transform 0.5s cubic-bezier(0.2, 1.5, 0.4, 1),
          left 0.35s ease,
          top 0.35s ease;
      }
      .mk-jd.is-on {
        opacity: 1;
        pointer-events: auto;
        transform: none;
      }
      .mk-jd-glow {
        position: absolute;
        top: -4px;
        right: -2px;
        bottom: -4px;
        left: -2px;
        border-radius: 22px;
        pointer-events: none;
        background: radial-gradient(closest-side, #0000008c, #0000);
      }
      .mk-jd img {
        position: absolute;
        left: 50%;
        width: 32px;
        height: 32px;
        margin-left: -16px;
        display: block;
        pointer-events: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        user-select: none;
        transform: rotate(-90deg);
        opacity: 0.22;
        filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.55));
        animation: mk-jd-fall 1.6s ease-in-out infinite;
      }
      .mk-jd img:nth-of-type(1) {
        top: 0;
        animation-delay: 0s;
      }
      .mk-jd img:nth-of-type(2) {
        top: 16px;
        animation-delay: 0.2s;
      }
      .mk-jd img:nth-of-type(3) {
        top: 32px;
        animation-delay: 0.4s;
      }
      @keyframes mk-jd-fall {
        0%,
        to {
          opacity: 0.34;
          transform: translateY(-4px) rotate(-90deg);
          filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.55));
        }
        45% {
          opacity: 1;
          transform: translateY(3px) rotate(-90deg);
          filter: drop-shadow(
              0 0 5px
                color-mix(
                  in srgb,
                  var(--theme-accent, #e5242b) 70%,
                  transparent
                )
            )
            drop-shadow(0 2px 4px rgba(0, 0, 0, 0.55));
        }
      }
      @media (hover: hover) {
        .mk-jd.is-on:hover img {
          filter: drop-shadow(0 0 7px var(--theme-accent, #e5242b))
            drop-shadow(0 2px 4px rgba(0, 0, 0, 0.55));
        }
        .mk-jd.is-on:hover {
          transform: scale(1.1);
        }
      }
      .mk-jd:active {
        transform: scale(0.92);
      }
      .mk-jd:focus-visible .mk-jd-glow {
        box-shadow: 0 0 0 2px
          color-mix(in srgb, var(--theme-accent, #e5242b) 70%, transparent);
      }
      .mk-jd.is-go img {
        animation: mk-jd-go 0.8s cubic-bezier(0.5, 0, 0.9, 0.4) forwards;
        filter: drop-shadow(0 0 9px var(--theme-accent, #e5242b));
      }
      .mk-jd.is-go img:nth-of-type(2) {
        animation-delay: 0.08s;
      }
      .mk-jd.is-go img:nth-of-type(3) {
        animation-delay: 0.16s;
      }
      @keyframes mk-jd-go {
        0% {
          opacity: 1;
          transform: translateY(0) rotate(-90deg);
        }
        to {
          opacity: 0;
          transform: translateY(70px) rotate(-90deg);
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-jd img {
          animation: none;
          opacity: 0.9;
        }
        .mk-term-chip,
        .mk-term-chip-cur,
        .mk-term-chip-dot {
          animation: none;
        }
      }
      .mk-reel {
        position: absolute;
        left: 0;
        right: 0;
        z-index: 0;
        pointer-events: none;
        opacity: 0;
        -webkit-mask-image: linear-gradient(
          90deg,
          transparent 0,
          #000 2.5%,
          #000 50%,
          transparent 68%
        );
        mask-image: linear-gradient(
          90deg,
          transparent 0,
          #000 2.5%,
          #000 50%,
          transparent 68%
        );
      }
      .mk-reel-band {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        transform-origin: 50% 50%;
        will-change: transform;
      }
      .mk-reel-rail {
        position: absolute;
        left: 0;
        right: 0;
        height: 9px;
        background-image: linear-gradient(
          90deg,
          rgba(232, 236, 245, 0.3) 0 10px,
          transparent 10px 24px
        );
        background-size: 24px 5px;
        background-repeat: repeat-x;
        background-position-y: center;
      }
      .mk-reel-rail.is-top {
        top: 0;
        border-top: 1px solid rgba(255, 255, 255, 0.14);
      }
      .mk-reel-rail.is-bot {
        bottom: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.14);
      }
      .mk-reel-track {
        position: absolute;
        left: 0;
        top: 15px;
        bottom: 15px;
        will-change: transform;
      }
      .mk-reel-frame {
        position: absolute;
        top: 0;
        bottom: 0;
        border-radius: 3px;
        background: #00000042;
        box-shadow: inset 0 0 0 1px #ffffff12;
        transition: box-shadow 0.5s ease;
      }
      .mk-reel-frame svg {
        position: absolute;
        top: 6px;
        right: 6px;
        bottom: 6px;
        left: 6px;
        width: calc(100% - 12px);
        height: calc(100% - 12px);
        overflow: visible;
      }
      .mk-reel-frame.is-lit {
        box-shadow:
          inset 0 0 0 1px #ffffff1f,
          0 0 28px -10px
            color-mix(in srgb, var(--theme-accent, #fff) 55%, transparent);
      }
      .mk-reel-no {
        position: absolute;
        right: 6px;
        bottom: 3px;
        font:
          8px/1 Share Tech Mono,
          ui-monospace,
          monospace;
        letter-spacing: 0.28em;
        color: #e1e6f06b;
      }
      .mk-reel-gate {
        position: absolute;
        top: -12px;
        bottom: -12px;
        width: 2px;
        margin-left: -1px;
        opacity: 0.3;
        background: linear-gradient(#fff0, #fffffff2 16%, #fffffff2 84%, #fff0);
        box-shadow:
          0 0 10px 1px var(--theme-accent, #e60000),
          0 0 34px 6px
            color-mix(in srgb, var(--theme-accent, #e60000) 38%, transparent);
      }
      .mk-reel-line {
        position: absolute;
        left: 0;
        right: 0;
        top: 50%;
        height: 2px;
        margin-top: -1px;
        opacity: 0;
        background: #fff;
        box-shadow:
          0 0 8px 1px var(--theme-accent, #e60000),
          0 0 26px 5px
            color-mix(in srgb, var(--theme-accent, #e60000) 50%, transparent);
      }
      .mk-hero-name--d {
        opacity: 0;
        transition: opacity 0.3s ease;
      }
      .mk-hero-name--d.is-done {
        opacity: 1;
        transition: none;
      }
      .mk-strike {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 6;
        pointer-events: none;
      }
      .mk-strike-sparks {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
      }
      .mk-strike-l {
        position: absolute;
        display: block;
        color: #fff;
        white-space: pre;
        margin: 0;
        padding: 0;
        will-change: transform, filter, opacity;
      }
      .mk-strike-beam {
        position: absolute;
        height: 2px;
        border-radius: 2px;
        --hx: 0%;
        background: linear-gradient(
          90deg,
          color-mix(in srgb, var(--theme-accent, #e60000) 26%, transparent) 0%,
          color-mix(in srgb, var(--theme-accent, #e60000) 40%, transparent)
            calc(var(--hx) - 12%),
          #fff var(--hx),
          color-mix(in srgb, var(--theme-accent, #e60000) 70%, transparent)
            calc(var(--hx) + 0.6%),
          color-mix(in srgb, var(--theme-accent, #e60000) 22%, transparent) 100%
        );
        box-shadow:
          0 0 6px 1px var(--theme-accent, #e60000),
          0 0 22px 3px
            color-mix(in srgb, var(--theme-accent, #e60000) 55%, transparent);
      }
      .mk-strike-head {
        position: absolute;
        width: 190px;
        height: 24px;
        margin: -12px 0 0 -95px;
        border-radius: 50%;
        pointer-events: none;
        background: radial-gradient(
          closest-side,
          #fffffff2,
          color-mix(in srgb, var(--theme-accent, #e60000) 55%, transparent) 30%,
          #0000
        );
        mix-blend-mode: screen;
      }
      .mk-strike-head:after {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 30px;
        height: 30px;
        margin: -15px 0 0 -15px;
        border-radius: 50%;
        background: radial-gradient(
          closest-side,
          #fff 25%,
          color-mix(in srgb, var(--theme-accent, #e60000) 70%, transparent) 55%,
          #0000
        );
      }
      .mk-strike-flash {
        position: absolute;
        border-radius: 24px;
        opacity: 0;
        pointer-events: none;
        mix-blend-mode: screen;
        background: radial-gradient(
          closest-side,
          #fff9,
          color-mix(in srgb, var(--theme-accent, #e60000) 25%, transparent) 60%,
          #0000
        );
      }
      @media (max-width: 560px) and (orientation: portrait) {
        .mk-hero-top {
          position: relative;
          min-height: calc(30px + var(--chip-tall, 0) * 34px);
          transition:
            min-width 0.45s cubic-bezier(0.22, 1, 0.36, 1),
            min-height 0.5s cubic-bezier(0.22, 1, 0.36, 1),
            opacity 1s ease,
            filter 1s ease,
            transform 1s ease;
        }
        .mk-hero-top > div:first-child,
        #hero .mk-hero-scene {
          opacity: var(--mk-words, 1);
        }
        .mk-chipreel {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          border-radius: inherit;
          overflow: hidden;
          pointer-events: none;
          -webkit-mask-image: linear-gradient(
            90deg,
            transparent 0,
            #000 7%,
            #000 93%,
            transparent 100%
          );
          mask-image: linear-gradient(
            90deg,
            transparent 0,
            #000 7%,
            #000 93%,
            transparent 100%
          );
        }
        .mk-chipreel-rail {
          position: absolute;
          left: 0;
          right: 0;
          height: 3px;
          background-image: linear-gradient(
            90deg,
            rgba(232, 236, 245, 0.34) 0 6px,
            transparent 6px 14px
          );
          background-size: 14px 3px;
          background-repeat: repeat-x;
        }
        .mk-chipreel-rail.is-top {
          top: 3px;
        }
        .mk-chipreel-rail.is-bot {
          bottom: 3px;
        }
        .mk-chipreel-track {
          position: absolute;
          left: 0;
          top: 8px;
          bottom: 8px;
          will-change: transform, opacity, filter;
        }
        .mk-chipreel-frame {
          position: absolute;
          top: 0;
          bottom: 0;
          border-radius: 3px;
          background: #0000004d;
          box-shadow: inset 0 0 0 1px #ffffff14;
          transition: box-shadow 0.4s ease;
        }
        .mk-chipreel-frame svg {
          position: absolute;
          top: 4px;
          right: 4px;
          bottom: 4px;
          left: 4px;
          width: calc(100% - 8px);
          height: calc(100% - 8px);
          overflow: visible;
        }
        .mk-chipreel-frame.is-lit {
          box-shadow:
            inset 0 0 0 1px #ffffff24,
            0 0 16px -6px
              color-mix(in srgb, var(--theme-accent, #fff) 60%, transparent);
        }
        .mk-chipreel-gate {
          position: absolute;
          top: 3px;
          bottom: 3px;
          width: 1px;
          margin-left: -0.5px;
          opacity: 0.3;
          background: linear-gradient(
            #fff0,
            #ffffffe6 20%,
            #ffffffe6 80%,
            #fff0
          );
          box-shadow: 0 0 8px 1px var(--theme-accent, #e60000);
        }
        .mk-chipreel-ark {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 0.08em;
          font:
            400 2.15rem/1 Bebas Neue,
            Oxanium,
            sans-serif;
          letter-spacing: 0.1em;
          color: #fff;
        }
        .mk-chipreel-ark span {
          display: inline-block;
          will-change: transform, filter;
        }
      }
      .mk-mahd-out {
        display: inline-block;
        animation: mk-mahd-out 0.56s linear forwards;
        will-change: transform, opacity, clip-path;
      }
      @keyframes mk-mahd-out {
        0% {
          opacity: 1;
          transform: none;
          text-shadow: none;
          clip-path: inset(0 0 0 0);
          filter: none;
        }
        8% {
          transform: translate(1px) skew(-5deg);
          text-shadow:
            -2px 0 rgba(255, 40, 70, 0.85),
            2px 0 rgba(0, 220, 255, 0.85);
          clip-path: inset(0 0 55% 0);
        }
        14% {
          transform: translate(-2px);
          clip-path: inset(42% 0 0 0);
        }
        20% {
          transform: none;
          clip-path: inset(0 0 0 0);
          text-shadow:
            -3px 0 rgba(255, 40, 70, 0.7),
            3px 0 rgba(0, 220, 255, 0.7);
        }
        34% {
          opacity: 0.78;
          clip-path: inset(22% 0 31% 0);
          transform: translate(2px);
        }
        40% {
          clip-path: inset(0 0 0 0);
          transform: none;
        }
        60% {
          opacity: 0.42;
          text-shadow:
            -4px 0 rgba(255, 40, 70, 0.45),
            4px 0 rgba(0, 220, 255, 0.45);
          filter: blur(0.4px);
        }
        to {
          opacity: 0;
          text-shadow:
            -6px 0 rgba(255, 40, 70, 0),
            6px 0 rgba(0, 220, 255, 0);
          filter: blur(1.4px);
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-mahd-out {
          animation: none;
          opacity: 0;
          transition: opacity 0.4s ease;
        }
      }
      .mk-av-dbtn {
        width: var(--gate-w, min(280px, 66vw));
      }
      .mk-av-dbtn:before {
        content: "";
        position: absolute;
        top: -9px;
        right: -8px;
        bottom: -9px;
        left: -8px;
      }
      .mk-av-gate p span {
        display: inline-block;
      }
      .mk-av.is-mini.is-sliding {
        transition:
          width 0.28s cubic-bezier(0.22, 1, 0.36, 1),
          height 0.28s cubic-bezier(0.22, 1, 0.36, 1),
          border-radius 0.28s ease;
      }
      .mk-av.is-mini.is-in-chip {
        z-index: 80;
        pointer-events: none;
      }
      .mk-av.is-mini.is-in-term {
        z-index: 81;
        box-shadow:
          0 0 0 1px
            color-mix(in srgb, var(--term-accent, #5eead4) 55%, transparent),
          0 8px 22px -8px #000c;
      }
      .mk-av.is-mini.is-carried {
        transition: none;
      }
      .mk-av.is-mini.is-compact .mk-av-bubble {
        max-width: min(220px, 60vw);
        font-size: 11px;
      }
      .mk-av.is-mini.is-compact .mk-av-bubble,
      .mk-av.is-mini.is-compact.is-left .mk-av-bubble {
        right: 0;
        left: auto;
        bottom: calc(100% + 10px);
        border-radius: 14px 14px 4px;
      }
      .mk-term-chip {
        touch-action: none;
        transition:
          left 0.55s cubic-bezier(0.3, 1.35, 0.5, 1),
          top 0.55s cubic-bezier(0.3, 1.35, 0.5, 1),
          width 0.4s ease,
          height 0.4s ease,
          transform 0.2s ease,
          box-shadow 0.2s ease,
          border-radius 0.3s ease;
      }
      .mk-term-chip.is-dragging {
        transition:
          transform 0.2s ease,
          box-shadow 0.2s ease;
        cursor: grabbing;
        transform: scale(1.06);
      }
      .mk-term-chip.is-holding {
        justify-content: flex-end;
        padding-bottom: 4px;
      }
      .mk-term-chip.is-holding .mk-term-chip-lbl {
        display: none;
      }
      .mk-term-chip.is-holding .mk-term-chip-ico {
        transform: scale(0.48);
        transform-origin: 50% 100%;
        margin-bottom: -3px;
      }
      .mk-term-chip.is-near {
        transform: scale(1.1);
        box-shadow:
          0 0 0 2px var(--term-accent, #5eead4),
          0 0 30px -2px var(--term-accent, #5eead4);
      }
      .terminal-container.is-near .mk-term {
        box-shadow:
          0 0 0 2px var(--term-accent, #5eead4),
          0 0 44px -6px var(--term-accent, #5eead4);
      }
      .mk-term-chip.is-compact {
        border-radius: 14px;
        gap: 2px;
      }
      .mk-term-chip.is-compact .mk-term-chip-lbl {
        display: none;
      }
      .mk-term-chip.is-compact .mk-term-chip-ico svg {
        width: 16px;
        height: 16px;
      }
      .mk-term-chip.is-compact .mk-term-chip-cur {
        width: 6px;
        height: 2px;
        margin-bottom: 3px;
      }
      .mk-term-chip.is-compact .mk-term-chip-dot {
        top: 4px;
        right: 4px;
        width: 6px;
        height: 6px;
      }
      .mk-badge.is-compact .mk-badge-sheen {
        display: none;
      }
      .mk-term-chip.is-morph {
        animation: mk-morph-chip 0.86s cubic-bezier(0.3, 1.2, 0.4, 1) 1;
      }
      @keyframes mk-morph-chip {
        0% {
          border-radius: 24px;
          transform: none;
          filter: none;
        }
        40% {
          border-radius: 50%;
          transform: scale(0.8) rotate(10deg);
          filter: blur(1px) brightness(1.6)
            drop-shadow(3px 0 0 rgba(255, 40, 70, 0.75))
            drop-shadow(-3px 0 0 rgba(0, 220, 255, 0.75));
        }
        70% {
          transform: scale(1.06) rotate(-3deg);
          filter: none;
        }
        to {
          border-radius: 24px;
          transform: none;
        }
      }
      .mk-badge.is-morph {
        animation: mk-morph-badge 0.86s cubic-bezier(0.3, 1.2, 0.4, 1) 1;
      }
      .mk-badge.is-morph .mk-badge-disc {
        animation: mk-morph-disc 0.86s ease 1;
      }
      @keyframes mk-morph-badge {
        0% {
          transform: none;
          filter: none;
        }
        40% {
          transform: scale(0.8) rotate(-10deg);
          filter: blur(1px) brightness(1.7)
            drop-shadow(3px 0 0 rgba(255, 40, 70, 0.75))
            drop-shadow(-3px 0 0 rgba(0, 220, 255, 0.75));
        }
        70% {
          transform: scale(1.06) rotate(3deg);
          filter: none;
        }
        to {
          transform: none;
        }
      }
      @keyframes mk-morph-disc {
        0%,
        to {
          border-radius: 50%;
        }
        40% {
          border-radius: 26%;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-term-chip.is-morph,
        .mk-badge.is-morph,
        .mk-badge.is-morph .mk-badge-disc {
          animation: none;
        }
      }
      .mk-av-gate {
        top: calc(42% + var(--gate-ls, min(66vw, 40vh, 360px)) / 2 + 22px);
      }
      .mk-av-logo-hit {
        width: var(--gate-ls, min(66vw, 40vh, 360px));
      }
      .mk-av-halo {
        width: calc(var(--gate-ls, min(66vw, 40vh, 360px)) * 1.25);
      }
      .mk-fseq-tri {
        position: absolute;
        left: 0;
        top: 0;
        pointer-events: none;
        visibility: hidden;
        will-change: transform;
      }
      .mk-box {
        margin-top: 2px;
      }
      .mk-box-tabs {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 6px;
      }
      .mk-box-tab {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-width: 0;
        padding: 9px 2px 7px;
        border-radius: 12px;
        border: 1px solid rgba(255, 255, 255, 0.08);
        background: #ffffff08;
        color: #9a9aa2;
        font-size: 7.5px;
        letter-spacing: 0.16em;
        cursor: pointer;
        transition:
          border-color 0.2s ease,
          box-shadow 0.2s ease,
          color 0.2s ease,
          background 0.2s ease,
          transform 0.2s cubic-bezier(0.22, 1.4, 0.36, 1);
      }
      .mk-box-tab:hover {
        color: #fff;
        border-color: color-mix(
          in srgb,
          var(--theme-accent, #fff) 45%,
          transparent
        );
        box-shadow: 0 0 14px -6px var(--theme-accent, #fff);
        transform: translateY(-1px);
      }
      .mk-box-tab.is-on {
        color: #fff;
        border-color: var(--theme-accent, #fff);
        background: color-mix(
          in srgb,
          var(--theme-accent, #fff) 12%,
          rgba(255, 255, 255, 0.03)
        );
        box-shadow: 0 0 16px -6px var(--theme-accent, #fff);
      }
      .mk-box-tab.is-on .mk-box-ico {
        filter: drop-shadow(0 0 6px var(--theme-accent, #fff));
      }
      .mk-box-ico {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 18px;
      }
      .mk-box-lbl {
        white-space: nowrap;
      }
      .mk-box-dot {
        display: block;
        width: 15px;
        height: 15px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, 0.35);
      }
      .mk-box-pane {
        margin-top: 8px;
        padding: 9px 8px 8px;
        border-radius: 12px;
        background: #ffffff06;
        border: 1px solid rgba(255, 255, 255, 0.06);
        animation: mk-box-in 0.24s cubic-bezier(0.22, 1, 0.36, 1);
      }
      @keyframes mk-box-in {
        0% {
          opacity: 0;
          transform: translateY(-4px);
        }
        to {
          opacity: 1;
          transform: none;
        }
      }
      .mk-box-head {
        font-size: 9px;
        letter-spacing: 0.2em;
        color: #737373;
        margin-bottom: 7px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .mk-box-note {
        color: #555;
      }
      .mk-box-theme {
        display: flex;
        align-items: center;
        gap: 7px;
        min-width: 0;
        padding: 8px;
        border-radius: 10px;
        border: 1px solid rgba(255, 255, 255, 0.07);
        background: #ffffff05;
        color: #a3a3a3;
        font-size: 9.5px;
        letter-spacing: 0.05em;
        text-align: left;
        cursor: pointer;
        transition:
          border-color 0.2s ease,
          color 0.2s ease,
          background 0.2s ease;
      }
      .mk-box-theme span {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .mk-box-theme:hover {
        color: #fff;
        border-color: #ffffff38;
      }
      .mk-box-theme.is-on {
        color: #fff;
        border-color: var(--theme-accent, #fff);
        background: color-mix(
          in srgb,
          var(--theme-accent, #fff) 12%,
          transparent
        );
      }
      .mk-box-arts {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 5px;
        margin-bottom: 9px;
      }
      .mk-box-art {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 3px;
        min-width: 0;
        padding: 6px 2px 5px;
        border-radius: 10px;
        border: 1px solid rgba(255, 255, 255, 0.07);
        background: #ffffff05;
        color: #8a8a8a;
        font-size: 6.5px;
        letter-spacing: 0.1em;
        cursor: pointer;
        transition:
          border-color 0.2s ease,
          color 0.2s ease,
          background 0.2s ease,
          transform 0.2s cubic-bezier(0.22, 1.4, 0.36, 1);
      }
      .mk-box-art:hover {
        color: #fff;
        border-color: #ffffff3d;
        transform: translateY(-1px);
      }
      .mk-box-art.is-on {
        color: #fff;
        border-color: var(--theme-accent, #fff);
        background: color-mix(
          in srgb,
          var(--theme-accent, #fff) 12%,
          transparent
        );
      }
      .mk-box-art-pic {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 26px;
        height: 26px;
        color: #d4d4d4;
      }
      .mk-box-art-pic img {
        width: 100%;
        height: 100%;
        -o-object-fit: contain;
        object-fit: contain;
        pointer-events: none;
      }
      .mk-box-art-name {
        white-space: nowrap;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .mk-box-slider {
        display: flex;
        align-items: center;
        gap: 8px;
        font-size: 10px;
        color: #a3a3a3;
      }
      .mk-box-slider input:disabled {
        opacity: 0.35;
      }
      .mk-box-trails {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 4px;
        margin-bottom: 9px;
      }
      .mk-box-chip {
        padding: 7px 0;
        border-radius: 8px;
        border: 1px solid rgba(255, 255, 255, 0.07);
        background: #ffffff05;
        color: #8a8a8a;
        font-size: 7.5px;
        letter-spacing: 0.12em;
        cursor: pointer;
        transition:
          border-color 0.2s ease,
          color 0.2s ease,
          background 0.2s ease;
      }
      .mk-box-chip:hover {
        color: #fff;
        border-color: #ffffff38;
      }
      .mk-box-chip.is-on {
        color: #fff;
        border-color: var(--theme-accent, #fff);
        background: color-mix(
          in srgb,
          var(--theme-accent, #fff) 12%,
          transparent
        );
      }
      @media (prefers-reduced-motion: reduce) {
        .mk-box-pane {
          animation: none;
        }
        .mk-box-tab,
        .mk-box-art {
          transition: none;
        }
      }
      @property --pa {
        syntax: "<angle>";
        inherits: false;
        initial-value: -45deg;
      }
      @property --ps {
        syntax: "<angle>";
        inherits: false;
        initial-value: 30deg;
      }
      html[data-theme="crystal"] body {
        background:
          radial-gradient(130% 80% at 50% -12%, #2a2e39, #14161c, #090a0d) fixed,
          #090a0d;
      }
      html[data-theme="crystal"] ::-webkit-scrollbar-track {
        background: #090a0d;
      }
      html[data-theme="crystal"] ::-webkit-scrollbar-thumb {
        background: #e2e8f84d;
      }
      html[data-theme="crystal"] *,
      html[data-theme="crystal"] *:before,
      html[data-theme="crystal"] *:after {
        border-radius: 0 !important;
      }
      .acad[data-tone="crystal"] {
        --a-ink: #f6f8ff;
        --a-body: rgba(236, 240, 252, 0.86);
        --a-muted: rgba(208, 216, 234, 0.62);
        --a-accent: #ffffff;
        --a-accent-text: #e2e8f8;
        --a-line: rgba(255, 255, 255, 0.16);
        --a-sheet: rgba(4, 5, 8, 0.34);
        --a-sheet-edge: rgba(255, 255, 255, 0.14);
        --a-box: linear-gradient(
          150deg,
          rgba(246, 248, 254, 0.95) 0%,
          rgba(214, 221, 238, 0.92) 100%
        );
        --a-box-line: rgba(255, 255, 255, 0.8);
        --a-box-shadow:
          inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(10, 12, 17, 0.14),
          0 0 0 1px rgba(0, 0, 0, 0.55), 0 22px 44px -20px rgba(0, 0, 0, 0.9);
        --a-ink-box: linear-gradient(
          150deg,
          rgba(6, 7, 10, 0.94) 0%,
          rgba(16, 18, 24, 0.92) 100%
        );
        --a-ink-box-fg: #f2f5ff;
        --a-chip: rgba(10, 12, 17, 0.06);
        --a-chip-line: rgba(10, 12, 17, 0.5);
        --a-chip-fg: #0a0c11;
        --a-chipbox: rgba(10, 12, 17, 0.05);
        --a-btn-bg: #f2f5ff;
        --a-btn-fg: #07080b;
      }
      .acad[data-tone="crystal"] ::-moz-selection {
        background: #f2f5ff;
        color: #07080b;
      }
      .acad[data-tone="crystal"] ::selection {
        background: #f2f5ff;
        color: #07080b;
      }
      .acad[data-tone="crystal"] .acad-sheet {
        background: var(--a-sheet);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
        border-left: 1px solid var(--a-sheet-edge);
        border-right: 1px solid var(--a-sheet-edge);
      }
      @media (max-width: 1180px) {
        .acad[data-tone="crystal"] .acad-sheet {
          border-left: 0;
          border-right: 0;
        }
      }
      .acad[data-tone="crystal"] .acad-sheet {
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
      }
      .acad[data-tone="crystal"] .acad-box,
      .acad[data-tone="crystal"] .acad-btn {
        text-shadow: none;
      }
      .acad-sheen {
        position: fixed;
        top: -20%;
        right: -40%;
        bottom: -20%;
        left: -40%;
        z-index: 0;
        pointer-events: none;
        mix-blend-mode: screen;
        will-change: transform;
        background: linear-gradient(
          105deg,
          transparent 38%,
          rgba(214, 226, 255, 0.035) 46%,
          rgba(255, 255, 255, 0.075) 50%,
          rgba(214, 226, 255, 0.035) 54%,
          transparent 62%
        );
        animation: acad-sheen 18s ease-in-out infinite alternate;
      }
      @keyframes acad-sheen {
        0% {
          transform: translate(-26%);
        }
        to {
          transform: translate(26%);
        }
      }
      .acad[data-tone="crystal"] .acad-box {
        position: relative;
        isolation: isolate;
        --a-ink: #0a0c11;
        --a-body: rgba(10, 12, 17, 0.86);
        --a-muted: rgba(10, 12, 17, 0.6);
        --a-accent-text: #0a0c11;
        --a-line: rgba(10, 12, 17, 0.2);
        background: var(--a-box);
        border: 1px solid var(--a-box-line);
        box-shadow: var(--a-box-shadow);
        backdrop-filter: blur(8px) saturate(140%);
        -webkit-backdrop-filter: blur(8px) saturate(140%);
        outline: 1px solid rgba(10, 12, 17, 0.15);
        outline-offset: -7px;
        background:
          linear-gradient(
              105deg,
              transparent 38%,
              rgba(255, 255, 255, 0.75) 50%,
              transparent 62%
            ) -160%
            0 / 260% 100% no-repeat,
          var(--a-box);
      }
      .acad[data-tone="crystal"] .acad-box--ink {
        --a-ink: #f2f5ff;
        --a-body: rgba(242, 245, 255, 0.86);
        --a-muted: rgba(220, 228, 246, 0.6);
        --a-accent-text: #f2f5ff;
        --a-line: rgba(255, 255, 255, 0.18);
        background:
          linear-gradient(
              105deg,
              transparent 38%,
              rgba(255, 255, 255, 0.2) 50%,
              transparent 62%
            ) -160%
            0 / 260% 100% no-repeat,
          var(--a-ink-box);
        border-color: #ffffff6b;
        outline-color: #ffffff24;
      }
      .acad[data-tone="crystal"] .acad-box--ink .acad-accent {
        color: #f2f5ff;
      }
      .acad[data-tone="crystal"] .acad-box-hover:hover {
        border-color: #fff;
      }
      .acad[data-tone="crystal"] .acad-chip {
        background: var(--a-chip);
        border: 1px solid var(--a-chip-line);
        color: var(--a-chip-fg) !important;
      }
      .acad[data-tone="crystal"] .acad-chipbox {
        background: var(--a-chipbox);
        border: 1px solid rgba(10, 12, 17, 0.3);
        color: var(--a-body);
      }
      .acad[data-tone="crystal"] .acad-btn {
        background: var(--a-btn-bg);
        color: var(--a-btn-fg);
        border: 1px solid #ffffff;
      }
      .acad[data-tone="crystal"] .acad-btn:hover {
        background: #07080b;
        color: #f2f5ff;
        border-color: #fff;
      }
      .acad[data-tone="crystal"] .acad-box:before,
      .acad[data-tone="crystal"] .acad-box:after {
        content: "";
        position: absolute;
        top: -1px;
        right: -1px;
        bottom: -1px;
        left: -1px;
        padding: 2px;
        pointer-events: none;
        z-index: 2;
        background: conic-gradient(
          from var(--pa),
          #ff4646 0deg,
          #ffa028 calc(var(--ps) * 0.17),
          #ffeb3c calc(var(--ps) * 0.33),
          #3cff82 calc(var(--ps) * 0.5),
          #28d7ff calc(var(--ps) * 0.67),
          #5a6eff calc(var(--ps) * 0.83),
          #c846ff calc(var(--ps) * 0.94),
          #ff4646 var(--ps),
          transparent var(--ps)
        );
        -webkit-mask:
          linear-gradient(#000 0 0) content-box,
          linear-gradient(#000 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        opacity: 0;
        transition:
          opacity 0.7s ease,
          --ps 1.4s cubic-bezier(0.22, 0.8, 0.2, 1);
        animation: crystal-pa 7s linear infinite paused;
      }
      .acad[data-tone="crystal"] .acad-box:after {
        top: -3px;
        right: -3px;
        bottom: -3px;
        left: -3px;
        padding: 5px;
        filter: blur(9px);
        z-index: -1;
      }
      .acad[data-tone="crystal"] .acad-box.is-prism:before,
      .acad[data-tone="crystal"] .acad-box:hover:before {
        opacity: 1;
        --ps: 360deg;
        animation-play-state: running;
      }
      .acad[data-tone="crystal"] .acad-box.is-prism:after,
      .acad[data-tone="crystal"] .acad-box:hover:after {
        opacity: 0.5;
        --ps: 360deg;
        animation-play-state: running;
      }
      @keyframes crystal-pa {
        0% {
          --pa: -45deg;
        }
        to {
          --pa: 315deg;
        }
      }
      .acad[data-tone="crystal"] .acad-box.is-prism {
        animation: crystal-sweep 1.5s cubic-bezier(0.3, 0.6, 0.2, 1) both;
      }
      @keyframes crystal-sweep {
        0% {
          background-position:
            -160% 0,
            0 0;
        }
        to {
          background-position:
            160% 0,
            0 0;
        }
      }
      @media (prefers-reduced-motion: reduce) {
        .acad[data-tone="crystal"] .acad-box:before,
        .acad[data-tone="crystal"] .acad-box:after {
          animation: none;
          transition: opacity 0.01ms;
        }
        .acad[data-tone="crystal"] .acad-box.is-prism {
          animation: none;
        }
        .acad[data-tone="crystal"] .acad-box.is-prism:before,
        .acad[data-tone="crystal"] .acad-box.is-prism:after {
          --ps: 360deg;
        }
        .acad-sheen {
          animation: none;
        }
      }
      [data-skin="acad-crystal"].mk-rail,
      [data-skin="acad-crystal"].mk-rail-tip,
      [data-skin="acad-crystal"].mk-rail-pop,
      [data-skin="acad-crystal"].mk-dockpick {
        --rail-bg: rgba(238, 241, 250, 0.9);
        --rail-pop: rgba(242, 245, 252, 0.97);
        --rail-line: rgba(10, 12, 17, 0.55);
        --rail-fg: #12141b;
        --rail-fg-hi: #000000;
        --rail-hover: rgba(10, 12, 17, 0.09);
        --rail-act-bg: #07080b;
        --rail-act-fg: #f2f5ff;
        --rail-accent: #07080b;
        --rail-shadow: 0 14px 40px rgba(0, 0, 0, 0.6), inset 0 1px 0 #ffffff;
      }
      [data-skin="acad-crystal"].mk-dockpick {
        --pick-dim-a: rgba(238, 241, 250, 0.4);
        --pick-dim-b: rgba(238, 241, 250, 0.84);
        --pad-line: rgba(10, 12, 17, 0.5);
      }
      .mk-box-theme.is-wide {
        grid-column: 1 / -1;
      }
      html[data-crystal="dark"] {
        --glass-fill: rgba(8, 9, 13, 0.38);
        --glass-fill-deep: rgba(4, 5, 8, 0.7);
        --glass-gloss:
          linear-gradient(
            180deg,
            rgba(255, 255, 255, 0.09) 0%,
            rgba(255, 255, 255, 0) 16%
          ),
          linear-gradient(
            135deg,
            rgba(255, 255, 255, 0.2) 0%,
            rgba(255, 255, 255, 0.06) 22%,
            rgba(255, 255, 255, 0) 46%,
            rgba(255, 255, 255, 0) 70%,
            rgba(255, 255, 255, 0.07) 100%
          );
        --glass-edge: rgba(255, 255, 255, 0.22);
        --glass-rim:
          inset 1px 1px 0 rgba(255, 255, 255, 0.36),
          inset -1px -1px 0 rgba(255, 255, 255, 0.1),
          inset 0 0 28px rgba(255, 255, 255, 0.03);
        --glass-blur: blur(14px) saturate(170%);
        --glass-drop: 0 22px 50px -18px rgba(0, 0, 0, 0.9);
      }
      html[data-theme="crystal"][data-crystal="dark"] body {
        background:
          radial-gradient(120% 75% at 50% -14%, #171a22, #0a0b0f 48%, #040507)
            fixed,
          #040507;
      }
      html[data-theme="crystal"][data-crystal="dark"]
        ::-webkit-scrollbar-track {
        background: #040507;
      }
      .acad-glow {
        position: fixed;
        top: -25%;
        right: -25%;
        bottom: -25%;
        left: -25%;
        z-index: 0;
        pointer-events: none;
        will-change: transform;
        background:
          radial-gradient(38% 34% at 22% 20%, #4e6cd642, #4e6cd600),
          radial-gradient(34% 32% at 82% 72%, #8a54d030, #8a54d000),
          radial-gradient(26% 24% at 58% 46%, #3cb4c81f, #3cb4c800);
        animation:
          acad-glow-in 1.4s ease both,
          acad-glow-drift 42s ease-in-out infinite alternate;
      }
      @keyframes acad-glow-in {
        0% {
          opacity: 0;
        }
        to {
          opacity: 1;
        }
      }
      @keyframes acad-glow-drift {
        0% {
          transform: translate3d(-4%, -3%, 0) scale(1);
        }
        to {
          transform: translate3d(4%, 3%, 0) scale(1.08);
        }
      }
      html[data-crystal="dark"] .acad-sheen {
        background: linear-gradient(
          105deg,
          transparent 38%,
          rgba(190, 210, 255, 0.05) 46%,
          rgba(255, 255, 255, 0.11) 50%,
          rgba(190, 210, 255, 0.05) 54%,
          transparent 62%
        );
      }
      .acad[data-tone="crystal"][data-glass="dark"] {
        --a-sheet: rgba(3, 4, 6, 0.1);
        --a-sheet-edge: rgba(255, 255, 255, 0.1);
      }
      .acad[data-tone="crystal"][data-glass="dark"] .acad-box {
        --a-ink: #f6f8ff;
        --a-body: rgba(236, 240, 252, 0.9);
        --a-muted: rgba(208, 216, 234, 0.68);
        --a-accent-text: #e2e8f8;
        --a-line: rgba(255, 255, 255, 0.16);
        --a-chip: rgba(255, 255, 255, 0.07);
        --a-chip-line: rgba(255, 255, 255, 0.34);
        --a-chip-fg: #eef2ff;
        --a-chipbox: rgba(255, 255, 255, 0.05);
        background:
          linear-gradient(
              105deg,
              transparent 38%,
              rgba(255, 255, 255, 0.22) 50%,
              transparent 62%
            ) -160%
            0 / 260% 100% no-repeat,
          var(--glass-gloss),
          var(--glass-fill);
        border: 1px solid var(--glass-edge);
        box-shadow: var(--glass-rim), var(--glass-drop);
        backdrop-filter: var(--glass-blur);
        -webkit-backdrop-filter: var(--glass-blur);
        outline: 1px solid rgba(255, 255, 255, 0.06);
        outline-offset: -7px;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
      }
      .acad[data-tone="crystal"][data-glass="dark"] .acad-box--ink {
        background:
          linear-gradient(
              105deg,
              transparent 38%,
              rgba(255, 255, 255, 0.22) 50%,
              transparent 62%
            ) -160%
            0 / 260% 100% no-repeat,
          var(--glass-gloss),
          var(--glass-fill-deep);
        border-color: #ffffff61;
      }
      .acad[data-tone="crystal"][data-glass="dark"] .acad-chipbox {
        border: 1px solid rgba(255, 255, 255, 0.2);
      }
      .acad[data-tone="crystal"][data-glass="dark"] .acad-box-hover:hover {
        border-color: #ffffffb3;
      }
      @keyframes crystal-sweep-3 {
        0% {
          background-position:
            -160% 0,
            0 0,
            0 0;
        }
        to {
          background-position:
            160% 0,
            0 0,
            0 0;
        }
      }
      .acad[data-tone="crystal"][data-glass="dark"] .acad-box.is-prism {
        animation-name: crystal-sweep-3;
      }
      @media (prefers-reduced-motion: reduce) {
        .acad[data-tone="crystal"][data-glass="dark"] .acad-box.is-prism,
        .acad-glow {
          animation: none;
        }
      }
      [data-skin="acad-crystal-dark"].mk-rail,
      [data-skin="acad-crystal-dark"].mk-rail-tip,
      [data-skin="acad-crystal-dark"].mk-rail-pop,
      [data-skin="acad-crystal-dark"].mk-dockpick {
        --rail-bg: var(--glass-fill);
        --rail-pop: rgba(8, 9, 13, 0.64);
        --rail-line: rgba(255, 255, 255, 0.22);
        --rail-fg: #dfe4f2;
        --rail-fg-hi: #ffffff;
        --rail-hover: rgba(255, 255, 255, 0.11);
        --rail-act-bg: rgba(244, 247, 255, 0.92);
        --rail-act-fg: #07080b;
        --rail-accent: #ffffff;
        --rail-shadow: var(--glass-rim), var(--glass-drop);
      }
      [data-skin="acad-crystal-dark"].mk-rail {
        background: var(--glass-gloss), var(--rail-bg);
        backdrop-filter: var(--glass-blur);
        -webkit-backdrop-filter: var(--glass-blur);
      }
      [data-skin="acad-crystal-dark"].mk-rail-tip,
      [data-skin="acad-crystal-dark"] .mk-rail-menu {
        background: var(--glass-gloss), var(--rail-pop);
      }
      [data-skin="acad-crystal-dark"].mk-dockpick {
        --pick-dim-a: rgba(4, 5, 8, 0.4);
        --pick-dim-b: rgba(4, 5, 8, 0.8);
        --pad-line: rgba(255, 255, 255, 0.4);
      }
      @media (max-width: 760px) {
        html[data-crystal="dark"] {
          --glass-blur: blur(10px) saturate(150%);
        }
      }
      html[data-theme="crystal"][data-crystal="clear"] body {
        background:
          radial-gradient(130% 80% at 50% -12%, #fff, #eef1f8 46%, #d3d9e7)
            fixed,
          #d3d9e7;
      }
      html[data-theme="crystal"][data-crystal="clear"]
        ::-webkit-scrollbar-track {
        background: #dde2ee;
      }
      html[data-theme="crystal"][data-crystal="clear"]
        ::-webkit-scrollbar-thumb {
        background: #1e2a486b;
      }
      html[data-crystal="clear"] .acad-sheen {
        display: none;
      }
      .acad[data-paper="white"] {
        --a-ink: #0a0c11;
        --a-body: rgba(10, 12, 17, 0.86);
        --a-muted: rgba(10, 12, 17, 0.68);
        --a-accent: #07080b;
        --a-accent-text: #0a0c11;
        --a-line: rgba(10, 12, 17, 0.2);
        --a-sheet: rgba(255, 255, 255, 0.36);
        --a-sheet-edge: rgba(10, 12, 17, 0.16);
        --a-box: linear-gradient(
          150deg,
          rgba(251, 252, 255, 0.97) 0%,
          rgba(222, 228, 242, 0.95) 100%
        );
        --a-box-shadow:
          inset 0 1px 0 #ffffff, inset 0 -1px 0 rgba(10, 12, 17, 0.12),
          0 0 0 1px rgba(10, 14, 26, 0.64),
          0 20px 40px -22px rgba(26, 38, 70, 0.62);
        --a-btn-bg: #07080b;
        --a-btn-fg: #f2f5ff;
      }
      .acad[data-paper="white"] ::-moz-selection {
        background: #07080b;
        color: #f2f5ff;
      }
      .acad[data-paper="white"] ::selection {
        background: #07080b;
        color: #f2f5ff;
      }
      .acad[data-paper="white"] .acad-sheet {
        text-shadow:
          0 0 1px rgba(255, 255, 255, 0.95),
          0 0 4px rgba(255, 255, 255, 0.8);
      }
      .acad[data-paper="white"] .acad-box,
      .acad[data-paper="white"] .acad-btn {
        text-shadow: none;
      }
      .acad[data-paper="white"] .acad-btn {
        border: 1px solid #07080b;
      }
      .acad[data-paper="white"] .acad-btn:hover {
        background: #fff;
        color: #07080b;
        border-color: #07080b;
      }
      .acad[data-paper="white"] .acad-box--ink .acad-btn {
        background: #f2f5ff;
        color: #07080b;
        border-color: #fff;
      }
      .acad[data-paper="white"] .acad-box--ink .acad-btn:hover {
        background: #07080b;
        color: #f2f5ff;
        border-color: #fff;
      }
      .acad[data-paper="white"] .acad-box--ink {
        border-color: #0a0e1ae6;
      }
      .acad[data-paper="white"] .acad-box-hover:hover {
        border-color: #07080b;
      }
      .acad[data-paper="white"] .acad-box:before,
      .acad[data-paper="white"] .acad-box:after {
        background: conic-gradient(
          from var(--pa),
          #ff3b4e 0deg,
          #ff8a1e calc(var(--ps) * 0.17),
          #f0b400 calc(var(--ps) * 0.33),
          #12c07a calc(var(--ps) * 0.5),
          #0fa8e8 calc(var(--ps) * 0.67),
          #4a5cff calc(var(--ps) * 0.83),
          #b83dff calc(var(--ps) * 0.94),
          #ff3b4e var(--ps),
          transparent var(--ps)
        );
      }
      [data-skin="acad-crystal"].mk-rail,
      [data-skin="acad-crystal"].mk-rail-tip,
      [data-skin="acad-crystal"].mk-rail-pop,
      [data-skin="acad-crystal"].mk-dockpick {
        --rail-shadow:
          0 12px 30px -8px rgba(26, 38, 70, 0.5), inset 0 1px 0 #ffffff;
      }
      .selection\:bg-cyan-500\/30 *::-moz-selection {
        background-color: #06b6d44d;
      }
      .selection\:bg-cyan-500\/30 *::selection {
        background-color: #06b6d44d;
      }
      .selection\:text-cyan-200 *::-moz-selection {
        --tw-text-opacity: 1;
        color: rgb(165 243 252 / var(--tw-text-opacity, 1));
      }
      .selection\:text-cyan-200 *::selection {
        --tw-text-opacity: 1;
        color: rgb(165 243 252 / var(--tw-text-opacity, 1));
      }
      .selection\:bg-cyan-500\/30::-moz-selection {
        background-color: #06b6d44d;
      }
      .selection\:bg-cyan-500\/30::selection {
        background-color: #06b6d44d;
      }
      .selection\:text-cyan-200::-moz-selection {
        --tw-text-opacity: 1;
        color: rgb(165 243 252 / var(--tw-text-opacity, 1));
      }
      .selection\:text-cyan-200::selection {
        --tw-text-opacity: 1;
        color: rgb(165 243 252 / var(--tw-text-opacity, 1));
      }
      .placeholder\:text-neutral-600::-moz-placeholder {
        --tw-text-opacity: 1;
        color: rgb(82 82 82 / var(--tw-text-opacity, 1));
      }
      .placeholder\:text-neutral-600::placeholder {
        --tw-text-opacity: 1;
        color: rgb(82 82 82 / var(--tw-text-opacity, 1));
      }
      .hover\:-translate-y-1:hover {
        --tw-translate-y: -0.25rem;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .hover\:scale-105:hover {
        --tw-scale-x: 1.05;
        --tw-scale-y: 1.05;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .hover\:border-\[var\(--theme-accent\)\]:hover {
        border-color: var(--theme-accent);
      }
      .hover\:border-white\/10:hover {
        border-color: #ffffff1a;
      }
      .hover\:border-white\/15:hover {
        border-color: #ffffff26;
      }
      .hover\:border-white\/20:hover {
        border-color: #fff3;
      }
      .hover\:border-white\/30:hover {
        border-color: #ffffff4d;
      }
      .hover\:border-white\/40:hover {
        border-color: #fff6;
      }
      .hover\:bg-black\/80:hover {
        background-color: #000c;
      }
      .hover\:bg-cyan-500\/10:hover {
        background-color: #06b6d41a;
      }
      .hover\:bg-cyan-500\/20:hover {
        background-color: #06b6d433;
      }
      .hover\:bg-cyan-500\/30:hover {
        background-color: #06b6d44d;
      }
      .hover\:bg-green-500\/20:hover {
        background-color: #22c55e33;
      }
      .hover\:bg-red-500\/20:hover {
        background-color: #ef444433;
      }
      .hover\:bg-white\/10:hover {
        background-color: #ffffff1a;
      }
      .hover\:bg-white\/20:hover {
        background-color: #fff3;
      }
      .hover\:bg-white\/5:hover {
        background-color: #ffffff0d;
      }
      .hover\:bg-white\/\[0\.02\]:hover {
        background-color: #ffffff05;
      }
      .hover\:bg-white\/\[0\.03\]:hover {
        background-color: #ffffff08;
      }
      .hover\:text-\[var\(--theme-accent\)\]:hover {
        color: var(--theme-accent);
      }
      .hover\:text-white:hover {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
      }
      .hover\:underline:hover {
        text-decoration-line: underline;
      }
      .focus\:border-cyan-400:focus {
        --tw-border-opacity: 1;
        border-color: rgb(34 211 238 / var(--tw-border-opacity, 1));
      }
      .focus\:border-green-500:focus {
        --tw-border-opacity: 1;
        border-color: rgb(34 197 94 / var(--tw-border-opacity, 1));
      }
      .focus\:outline-none:focus {
        outline: 2px solid transparent;
        outline-offset: 2px;
      }
      .group:hover .group-hover\:scale-105 {
        --tw-scale-x: 1.05;
        --tw-scale-y: 1.05;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .group:hover .group-hover\:scale-110 {
        --tw-scale-x: 1.1;
        --tw-scale-y: 1.1;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .group:hover .group-hover\:scale-125 {
        --tw-scale-x: 1.25;
        --tw-scale-y: 1.25;
        transform: translate(var(--tw-translate-x), var(--tw-translate-y))
          rotate(var(--tw-rotate)) skew(var(--tw-skew-x))
          skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x))
          scaleY(var(--tw-scale-y));
      }
      .group:hover .group-hover\:text-cyan-300 {
        --tw-text-opacity: 1;
        color: rgb(103 232 249 / var(--tw-text-opacity, 1));
      }
      .group:hover .group-hover\:text-white {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
      }
      .group:hover .group-hover\:opacity-100 {
        opacity: 1;
      }
      @media (min-width: 640px) {
        .sm\:inset-6 {
          top: 1.5rem;
          right: 1.5rem;
          bottom: 1.5rem;
          left: 1.5rem;
        }
        .sm\:-left-\[39px\] {
          left: -39px;
        }
        .sm\:left-4 {
          left: 1rem;
        }
        .sm\:left-\[15px\] {
          left: 15px;
        }
        .sm\:right-4 {
          right: 1rem;
        }
        .sm\:mb-14 {
          margin-bottom: 3.5rem;
        }
        .sm\:ml-6 {
          margin-left: 1.5rem;
        }
        .sm\:inline {
          display: inline;
        }
        .sm\:flex {
          display: flex;
        }
        .sm\:h-24 {
          height: 6rem;
        }
        .sm\:h-\[31px\] {
          height: 31px;
        }
        .sm\:w-24 {
          width: 6rem;
        }
        .sm\:w-36 {
          width: 9rem;
        }
        .sm\:w-96 {
          width: 24rem;
        }
        .sm\:w-\[31px\] {
          width: 31px;
        }
        .sm\:w-\[480px\] {
          width: 480px;
        }
        .sm\:w-\[720px\] {
          width: 720px;
        }
        .sm\:grid-cols-2 {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .sm\:grid-cols-3 {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .sm\:grid-cols-4 {
          grid-template-columns: repeat(4, minmax(0, 1fr));
        }
        .sm\:grid-cols-6 {
          grid-template-columns: repeat(6, minmax(0, 1fr));
        }
        .sm\:justify-start {
          justify-content: flex-start;
        }
        .sm\:\!p-12 {
          padding: 3rem !important;
        }
        .sm\:p-10 {
          padding: 2.5rem;
        }
        .sm\:p-3 {
          padding: 0.75rem;
        }
        .sm\:p-6 {
          padding: 1.5rem;
        }
        .sm\:p-7 {
          padding: 1.75rem;
        }
        .sm\:p-8 {
          padding: 2rem;
        }
        .sm\:px-12 {
          padding-left: 3rem;
          padding-right: 3rem;
        }
        .sm\:px-6 {
          padding-left: 1.5rem;
          padding-right: 1.5rem;
        }
        .sm\:pl-14 {
          padding-left: 3.5rem;
        }
        .sm\:pl-8 {
          padding-left: 2rem;
        }
        .sm\:pt-32 {
          padding-top: 8rem;
        }
        .sm\:text-left {
          text-align: left;
        }
        .sm\:text-3xl {
          font-size: 1.875rem;
          line-height: 2.25rem;
        }
        .sm\:text-4xl {
          font-size: 2.25rem;
          line-height: 2.5rem;
        }
        .sm\:text-5xl {
          font-size: 3rem;
          line-height: 1;
        }
        .sm\:text-6xl {
          font-size: 3.75rem;
          line-height: 1;
        }
        .sm\:text-7xl {
          font-size: 4.5rem;
          line-height: 1;
        }
        .sm\:text-8xl {
          font-size: 6rem;
          line-height: 1;
        }
        .sm\:text-base {
          font-size: 1rem;
          line-height: 1.5rem;
        }
        .sm\:text-sm {
          font-size: 0.875rem;
          line-height: 1.25rem;
        }
        .sm\:text-xl {
          font-size: 1.25rem;
          line-height: 1.75rem;
        }
        .sm\:text-xs {
          font-size: 0.75rem;
          line-height: 1rem;
        }
      }
      @media (min-width: 768px) {
        .md\:mt-0 {
          margin-top: 0;
        }
        .md\:flex {
          display: flex;
        }
        .md\:max-h-none {
          max-height: none;
        }
        .md\:w-\[450px\] {
          width: 450px;
        }
        .md\:columns-3 {
          -moz-columns: 3;
          columns: 3;
        }
        .md\:grid-cols-2 {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .md\:grid-cols-3 {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .md\:grid-cols-\[260px_1fr\] {
          grid-template-columns: 260px 1fr;
        }
        .md\:flex-row {
          flex-direction: row;
        }
        .md\:items-end {
          align-items: flex-end;
        }
        .md\:border-b-0 {
          border-bottom-width: 0px;
        }
        .md\:border-r {
          border-right-width: 1px;
        }
      }
      @media (min-width: 1024px) {
        .lg\:col-span-1 {
          grid-column: span 1 / span 1;
        }
        .lg\:col-span-2 {
          grid-column: span 2 / span 2;
        }
        .lg\:flex {
          display: flex;
        }
        .lg\:aspect-auto {
          aspect-ratio: auto;
        }
        .lg\:grid-cols-2 {
          grid-template-columns: repeat(2, minmax(0, 1fr));
        }
        .lg\:grid-cols-3 {
          grid-template-columns: repeat(3, minmax(0, 1fr));
        }
        .lg\:grid-cols-4 {
          grid-template-columns: repeat(4, minmax(0, 1fr));
        }
        .lg\:grid-cols-5 {
          grid-template-columns: repeat(5, minmax(0, 1fr));
        }
        .lg\:grid-cols-\[1fr_minmax\(220px\,300px\)\] {
          grid-template-columns: 1fr minmax(220px, 300px);
        }
        .lg\:border-b-0 {
          border-bottom-width: 0px;
        }
        .lg\:border-r {
          border-right-width: 1px;
        }
        .lg\:px-8 {
          padding-left: 2rem;
          padding-right: 2rem;
        }
        .lg\:text-8xl {
          font-size: 6rem;
          line-height: 1;
        }
        .lg\:text-9xl {
          font-size: 8rem;
          line-height: 1;
        }
        .lg\:text-\[9rem\] {
          font-size: 9rem;
        }
      }
      @media (min-width: 1280px) {
        .xl\:columns-4 {
          -moz-columns: 4;
          columns: 4;
        }
      }