/* abcss compact bundle */
.a { min-height: 100vh; }
.a { min-height: 100dvh; }
.a, .c, .d, .e, .o, .p, .s { margin: 0; }
.a { background: #000; }
.a, .h, .j, .k { color: #fff; }
.a { font-family: Geist, system-ui, sans-serif; }
.a { letter-spacing: -0.03em; }
.b { width: min(36rem, calc(100% - 2.5rem)); }
.b { margin: 0 auto; }
.b { padding: 18vh 0 4rem; }
.b, .f, .n, .q, .u, .t, .w { display: flex; }
.b, .f, .q, .w { flex-direction: column; }
.b { gap: 1.25rem; }
.c { font-size: 0.78rem; }
.c { letter-spacing: 0.18em; }
.c, .g { text-transform: uppercase; }
.c, .g, .p { color: #8a8a8a; }
.d { font-size: clamp(2.1rem, 6vw, 3.4rem); }
.d, .j, .k { font-weight: 600; }
.d { line-height: 1.05; }
.e { font-size: 1.15rem; }
.e { line-height: 1.45; }
.e { color: #d8d8d8; }
.f { gap: 0.4rem; }
.g { font-size: 0.72rem; }
.g { letter-spacing: 0.08em; }
.h { width: 100%; }
.h { box-sizing: border-box; }
.h, .m { background: #111; }
.h { border: 1px solid #2a2a2a; }
.h { border-radius: 0; }
.h, .j, .k { font: inherit; }
.h, .m { font-size: 1.05rem; }
.h { padding: 0.85rem 0.9rem; }
.i { border: 1px dashed #444; }
.i { padding: 1.4rem 1rem; }
.i, .v { text-align: center; }
.i, .l { color: #cfcfcf; }
.i, .j, .k { cursor: pointer; }
.j, .k { appearance: none; }
.j { border: 0; }
.j { background: #5c5c5c; }
.j { font-size: 1rem; }
.j, .k { padding: 0.85rem 1.2rem; }
.k, .l { border: 1px solid #3a3a3a; }
.k { background: transparent; }
.l { padding: 0.9rem 1rem; }
.l, .p { font-size: 0.95rem; }
.l { line-height: 1.4; }
.m { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.m { letter-spacing: 0; }
.m { border: 1px solid #333; }
.m { padding: 1rem; }
.m { word-break: break-all; }
.n { gap: 0.7rem; }
.n, .u, .t, .w { align-items: center; }
.n, .t { flex-wrap: wrap; }
.n { margin-top: 0.5rem; }
.o { color: #ff6b6b; }
.o { min-height: 1.2em; }
.q { gap: 1.1rem; }
.r { font-family: "Material Symbols Outlined"; }
.r { font-weight: 400; }
.r { font-style: normal; }
.r { font-size: 1.35rem; }
.r { line-height: 1; }
.r { vertical-align: middle; }
.r { font-feature-settings: "liga"; }
.r { -webkit-font-smoothing: antialiased; }
.u { justify-content: flex-start; }
.u { min-height: 2.6rem; }
.u .r { font-size: 2.4rem; }
.u .r { display: inline-block; }
.u .r { animation: ks-spin 0.9s linear infinite; }
.s { font-size: 1.2rem; }
.t, .w { gap: 0.65rem; }
.v { display: grid; }
.v { place-items: center; }
.v { padding: 2rem; }
.h:focus { outline: 1px solid #fff; }
.j:hover { background: #6e6e6e; }
.j:disabled { opacity: 0.4; }
.j:disabled { cursor: not-allowed; }
.k:hover { border-color: #888; }

@media (max-width: 640px) {
  .b { padding-top: 12vh; }
  .d { font-size: 2rem; }
}

@media (prefers-reduced-motion: reduce) {
  .u .r { animation: none; }
}

html, body {
  margin: 0;
  background: #000;
  color: #fff;
}
a { color: #fff; }
.fwd-enter-active,
.fwd-leave-active,
.back-enter-active,
.back-leave-active {
  transition: opacity 0.32s ease, transform 0.32s ease;
}
.fwd-enter-from { opacity: 0; transform: translateX(2.2rem); }
.fwd-leave-to { opacity: 0; transform: translateX(-2.2rem); }
.back-enter-from { opacity: 0; transform: translateX(-2.2rem); }
.back-leave-to { opacity: 0; transform: translateX(2.2rem); }
.fwd-leave-active,
.back-leave-active {
  position: absolute;
  width: min(36rem, calc(100% - 2.5rem));
}

@keyframes ks-spin {
  to { transform: rotate(360deg); }
}