{"version":3,"sources":["styles.scss"],"names":[],"mappings":"AACA,WACE,kBAAqB,CACrB,4GAA+G,CAC/G,iBAAkB,CAGpB,KACE,QAAS,CACT,sCAAyC,CAC1C,WAGC,YAAa,CACb,cAAe,CACf,KAAM,CACN,QAAS,CACT,MAAO,CACP,OAAQ,CACT,WAGC,WAAY,CACZ,qBAAsB,CAEtB,YAAa,CACb,eAAgB,CALlB,cAQI,aAAqB,CARzB,uBAYI,YAAa,CACb,6BAA8B,CAblC,6BAgBM,QAAS,CAhBf,wBAqBI,YAAa,CACb,qBAAsB,CACvB,MAID,iBAAkB,CADpB,wBAII,iBAAkB,CAClB,SAAU,CACV,OAAQ,CACR,QAAS,CAPb,kCAYM,qBAAsB,CAEtB,UAAW,CACX,WAAY,CAEZ,YAAa,CACb,sBAAuB,CACvB,kBAAmB,CAEnB,iBAAkB,CArBxB,sCAwBQ,UAAW,CAxBnB,wCA4BM,wBAAyB,CA5B/B,0CA+BM,wBAAyB,CA/B/B,wCAkCM,4BAA+B,CAChC,MAKH,gBAAiB,CADnB,WAGI,oBAAqB,CACtB,mBAID,UAAW,CACZ,kBAGC,UAAW,CACZ,MAGC,gBAAiB,CADnB,YAKI,4BAA+B,CAChC,mBAFC,mBAWkB,CATnB,OAID,qBAAsB,CACtB,qBAAsB,CACtB,iBAAkB,CAClB,YAAa,CACb,WACoB,CANtB,aASI,4BAA+B,CATnC,aAaI,wBAAyB,CACzB,oBAAqB,CAdzB,cAkBI,wBAAyB,CACzB,oBAAqB,CAnBzB,gBAuBI,kBAAmB","file":"main.4b4142f8.chunk.css","sourcesContent":["/* http://www.eaglefonts.com/fg-virgil-ttf-131249.htm */\n@font-face {\n  font-family: \"Virgil\";\n  src: url(\"https://uploads.codesandbox.io/uploads/user/ed077012-e728-4a42-8395-cbd299149d62/AflB-FG_Virgil.ttf\");\n  font-display: swap;\n}\n\nbody {\n  margin: 0;\n  font-family: Arial, Helvetica, sans-serif;\n}\n\n.container {\n  display: flex;\n  position: fixed;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n}\n\n.sidePanel {\n  width: 230px;\n  background-color: #eee;\n\n  padding: 10px;\n  overflow-y: auto;\n\n  h4 {\n    margin: 10px 0 10px 0;\n  }\n\n  .panelTools {\n    display: flex;\n    justify-content: space-between;\n\n    label {\n      margin: 0;\n    }\n  }\n\n  .panelColumn {\n    display: flex;\n    flex-direction: column;\n  }\n}\n\n.tool {\n  position: relative;\n\n  input[type=\"radio\"] {\n    position: absolute;\n    opacity: 0;\n    width: 0;\n    height: 0;\n  }\n\n  input[type=\"radio\"] {\n    & + .toolIcon {\n      background-color: #ddd;\n\n      width: 41px;\n      height: 41px;\n\n      display: flex;\n      justify-content: center;\n      align-items: center;\n\n      border-radius: 3px;\n\n      svg {\n        height: 1em;\n      }\n    }\n    &:hover + .toolIcon {\n      background-color: #e7e5e5;\n    }\n    &:checked + .toolIcon {\n      background-color: #bdbebc;\n    }\n    &:focus + .toolIcon {\n      box-shadow: 0 0 0 2px steelblue;\n    }\n  }\n}\n\nlabel {\n  margin-right: 6px;\n  span {\n    display: inline-block;\n  }\n}\n\ninput[type=\"number\"] {\n  width: 30px;\n}\n\ninput[type=\"color\"] {\n  margin: 2px;\n}\n\ninput {\n  margin-right: 5px;\n\n  &:focus {\n    outline: transparent;\n    box-shadow: 0 0 0 2px steelblue;\n  }\n}\n\nbutton {\n  background-color: #ddd;\n  border: 1px solid #ccc;\n  border-radius: 4px;\n  margin: 2px 0;\n  padding: 5px;\n  outline: transparent;\n\n  &:focus {\n    box-shadow: 0 0 0 2px steelblue;\n  }\n\n  &:hover {\n    background-color: #e7e5e5;\n    border-color: #d6d4d4;\n  }\n\n  &:active {\n    background-color: #bdbebc;\n    border-color: #bdbebc;\n  }\n\n  &:disabled {\n    cursor: not-allowed;\n  }\n}\n"]}