body{font-family:IBM Plex Mono,monospace}.convert-box{height:3em}.convert-box,.mini-unit-box{width:3rem;background-color:#000}.mini-unit-box{height:3rem}.spacing-scale{display:flex;align-items:flex-end;list-style:none;margin:0;padding:0}.fixed-spacing-scale-1{width:.125rem;height:.125rem}.fixed-spacing-scale-1,.fixed-spacing-scale-2{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fixed-spacing-scale-2{width:.25rem;height:.25rem}.fixed-spacing-scale-3{width:.5rem;height:.5rem}.fixed-spacing-scale-3,.fixed-spacing-scale-4{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fixed-spacing-scale-4{width:.75rem;height:.75rem}.fixed-spacing-scale-5{width:1rem;height:1rem}.fixed-spacing-scale-5,.fixed-spacing-scale-6{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fixed-spacing-scale-6{width:1.5rem;height:1.5rem}.fixed-spacing-scale-7{width:2rem;height:2rem}.fixed-spacing-scale-7,.fixed-spacing-scale-8{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fixed-spacing-scale-8{width:2.5rem;height:2.5rem}.fixed-spacing-scale-9{width:3rem;height:3rem}.fixed-spacing-scale-9,.fixed-spacing-scale-10{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fixed-spacing-scale-10{width:4rem;height:4rem}.fixed-spacing-scale-11{width:5rem;height:5rem}.fixed-spacing-scale-11,.fixed-spacing-scale-12{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fixed-spacing-scale-12{width:6rem;height:6rem}.fluid-spacing-scale-1{width:0;height:0}.fluid-spacing-scale-1,.fluid-spacing-scale-2{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fluid-spacing-scale-2{width:2vw;height:2vw}.fluid-spacing-scale-3{width:5vw;height:5vw}.fluid-spacing-scale-3,.fluid-spacing-scale-4{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.fluid-spacing-scale-4{width:10vw;height:10vw}.key-heights{display:flex;align-items:flex-end;list-style:none;margin:0;padding:0;flex-wrap:wrap}.key-height-1{width:5rem;height:5rem}.key-height-1,.key-height-2{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-2{width:10rem;height:10rem}.key-height-3{width:15rem;height:15rem}.key-height-3,.key-height-4{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-4{width:20rem;height:20rem}.key-height-5{width:25rem;height:25rem}.key-height-5,.key-height-6{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-6{width:30rem;height:30rem}@media (min-width:42rem){.key-height-1{width:5rem;height:5rem}.key-height-1,.key-height-2{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-2{width:10rem;height:10rem}.key-height-3{width:15rem;height:15rem}.key-height-3,.key-height-4{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-4{width:20rem;height:20rem}.key-height-5{width:25rem;height:25rem}.key-height-5,.key-height-6{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-6{width:30rem;height:30rem}}@media (min-width:66rem){.key-height-1{width:4rem;height:4rem}.key-height-1,.key-height-2{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-2{width:8rem;height:8rem}.key-height-3{width:12rem;height:12rem}.key-height-3,.key-height-4{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-4{width:16rem;height:16rem}.key-height-5{width:20rem;height:20rem}.key-height-5,.key-height-6{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-6{width:24rem;height:24rem}.key-height-7{width:28rem;height:28rem}.key-height-7,.key-height-8{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-8{width:32rem;height:32rem}}@media (min-width:82rem){.key-height-1{width:5rem;height:5rem}.key-height-1,.key-height-2{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-2{width:10rem;height:10rem}.key-height-3{width:15rem;height:15rem}.key-height-3,.key-height-4{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-4{width:20rem;height:20rem}.key-height-5{width:25rem;height:25rem}.key-height-5,.key-height-6{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-6{width:30rem;height:30rem}.key-height-7{width:35rem;height:35rem}.key-height-7,.key-height-8{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-8{width:40rem;height:40rem}}@media (min-width:99rem){.key-height-1{width:6rem;height:6rem}.key-height-1,.key-height-2{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-2{width:12rem;height:12rem}.key-height-3{width:18rem;height:18rem}.key-height-3,.key-height-4{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-4{width:24rem;height:24rem}.key-height-5{width:30rem;height:30rem}.key-height-5,.key-height-6{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-6{width:36rem;height:36rem}.key-height-7{width:42rem;height:42rem}.key-height-7,.key-height-8{background-color:#000;margin-right:1.5rem;margin-bottom:1.5rem}.key-height-8{width:48rem;height:48rem}}
/*# sourceMappingURL=/layout/examples/preview/styles.0ded3457.css.map */