{"version":3,"sources":["style.scss"],"names":[],"mappings":"AAAA,kBACE,oBAIE,gCAAqC,CACrC,gCAAqC,CAFrC,cAAgB,CAFhB,iBAAkB,CAClB,SAIF,CACA,4DAME,2BAA4B,CAD5B,+BAAoC,CADpC,eAAgB,CADhB,cAAe,CADf,iBAKF,CACA,gBACE,YAAa,CACb,gBAAiB,CACjB,kBACF,CACA,6BACE,qBAAuB,CAKvB,YAAa,CAFb,MAAO,CAFP,cAAe,CACf,KAAM,CAEN,UAAW,CAEX,YACF,CACA,qBAKE,kBAAmB,CAFnB,SAAW,CACX,wBAAyB,CAFzB,mBAAqB,CADrB,yBAKF,CACA,0BACE,kBACF,CACA,SAEE,yBAA2B,CAC3B,yBAA2B,CAF3B,YAIF,CACA,uBAFE,0BAIF,CACA,iDAEE,sBAAuB,CADvB,mBAEF,CACA,oCACE,iDAEE,uBAAwB,CADxB,oBAEF,CACF,CACA,aAEE,gBAAiB,CADjB,8BAEF,CACA,yBACE,gBAAiB,CACjB,UACF,CACA,0CAIE,uEAA0E,CAH1E,eAAgB,CAChB,kBAAmB,CACnB,cAEF,CACA,+DACE,0CACF,CACA,qBACE,aAAc,CACd,gBACF,CACA,4BACE,UACF,CACA,sBAIE,0CAA2C,CAF3C,QAAS,CACT,aAAc,CAFd,UAIF,CACA,eAEE,mBAAoB,CACpB,cAAe,CAFf,iBAGF,CACA,wCAIE,kBAAmB,CAHnB,cAAe,CAEf,kBAAmB,CAGnB,eACF,CACA,wFANE,mBAAoB,CAGpB,wBAMF,CACA,oFAGE,eAAiB,CAEjB,eAAgB,CAChB,sBAAuB,CAJvB,wBAAyB,CAEzB,kBAGF,CACA,qCACE,yBAA2B,CAC3B,iBACF,CACA,aAEE,yBAA2B,CAD3B,eAAgB,CAEhB,YACF,CACA,2BACE,aAAc,CACd,eAAgB,CAChB,SACF,CACA,SACE,iBACF,CACA,gBAIE,gDAAiD,CADjD,4BAA8B,CAD9B,yBAA2B,CAD3B,yBAIF,CACA,yBACE,iDAAkD,CAClD,+BACF,CACA,UAEE,oBAAqB,CADrB,cAAe,CAEf,wBACF,CACA,aACE,wBACF,CACA,eACE,cACF,CACF","file":"style.css","sourcesContent":["@layer components {\n  .preview-grid .grid {\n    position: relative;\n    z-index: 0;\n    padding: 0.5em 0;\n    background-color: rgba(0, 0, 0, 0.08);\n    border: 1px solid rgba(0, 0, 0, 0.15);\n  }\n  .preview-grid .grid__col,\n  .preview-grid *[class*=grid__col--] {\n    position: relative;\n    min-height: 1em;\n    line-height: 1.5;\n    background-color: rgba(0, 0, 0, 0.1);\n    background-clip: content-box;\n  }\n  .previewWrapper {\n    display: flex;\n    flex-flow: column;\n    margin-bottom: 2rem;\n  }\n  .previewWrapper.isFullscreen {\n    background-color: white;\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100vh;\n    z-index: 9999;\n  }\n  .previewWrapper > .bar {\n    margin-top: 1rem !important;\n    margin-bottom: 0.5rem;\n    gap: 0.5rem;\n    justify-content: flex-end;\n    align-items: center;\n  }\n  .previewWrapper > .bar .btn {\n    margin: 0 !important;\n  }\n  .preview {\n    padding: 24px;\n    border-radius: 0 !important;\n    margin-bottom: 0 !important;\n    overflow: visible !important;\n  }\n  .card.preview {\n    overflow: visible !important;\n  }\n  .card.preview--preserve-divider-spacing .divider {\n    padding-top: 1.25rem;\n    padding-bottom: 1.25rem;\n  }\n  @media screen and (min-width: 768px) {\n    .card.preview--preserve-divider-spacing .divider {\n      padding-top: 1.875rem;\n      padding-bottom: 1.875rem;\n    }\n  }\n  .previewLive {\n    transition: all 200ms ease-in-out;\n    overflow: visible;\n  }\n  .previewLiveViewportArea {\n    overflow: visible;\n    width: 100%;\n  }\n  .previewLiveViewportArea.hasFixedViewport {\n    overflow-x: auto;\n    overflow-y: visible;\n    padding: 1rem 0;\n    background: color-mix(in srgb, var(--color-text-default), transparent 96%);\n  }\n  .previewLiveViewportArea.hasFixedViewport .previewLiveViewport {\n    background: var(--color-background-primary);\n  }\n  .previewLiveViewport {\n    margin: 0 auto;\n    overflow: visible;\n  }\n  .previewLiveViewport.isAuto {\n    width: 100%;\n  }\n  .previewViewportFrame {\n    width: 100%;\n    border: 0;\n    display: block;\n    background: var(--color-background-primary);\n  }\n  .selectWrapper {\n    position: relative;\n    font-family: inherit;\n    font-size: 14px;\n  }\n  .selectWrapper .select .select__control {\n    cursor: pointer;\n    display: inline-flex;\n    flex-direction: row;\n    align-items: center;\n    justify-content: flex-end;\n    min-width: 130px;\n  }\n  .selectWrapper .select .select__value-container {\n    display: inline-flex;\n    justify-content: flex-end;\n  }\n  .selectWrapper .select .select__single-value,\n  .selectWrapper .select .select__option {\n    text-transform: uppercase;\n    font-weight: bold;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n  .selectWrapper .select .select__menu {\n    border-radius: 0 !important;\n    text-align: center;\n  }\n  .codeExample {\n    margin-bottom: 0;\n    border-radius: 0 !important;\n    padding: 24px;\n  }\n  .isFullscreen .codeExample {\n    flex: 1 1 auto;\n    margin-bottom: 0;\n    padding: 0;\n  }\n  .wrapper {\n    position: relative;\n  }\n  .codeTypeToggle {\n    margin-bottom: 0 !important;\n    border-radius: 0 !important;\n    border-bottom: none !important;\n    background-color: var(--color-background-primary);\n  }\n  .codeTypeToggle.isActive {\n    background-color: var(--color-background-contrast);\n    color: var(--color-text-inverse);\n  }\n  .triangle {\n    font-size: 18px;\n    display: inline-block;\n    transition: transform 0.3s;\n  }\n  .triangle.up {\n    transform: rotate(180deg);\n  }\n  .triangle.down {\n    transform: none;\n  }\n}"]}