*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:62.5%}html h1{font-size:5rem}html button,html h2,html h3,html h4,html h5,html h6,html input,html p,html span,html textarea{color:#353535;font-size:1.6rem;font-weight:400}body,html button,html h2,html h3,html h4,html h5,html h6,html input,html p,html span,html textarea{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{background-color:#fff}.App,.App .main{display:flex;justify-content:center}.App .main{flex-direction:column;gap:2rem;max-width:50rem;padding:2rem;width:50rem}.App .main form.create{grid-row-gap:1rem;grid-column-gap:1rem;border:1px solid #353535;border-radius:5px;-webkit-column-gap:1rem;column-gap:1rem;display:grid;grid-template-areas:"title user user" "message message message" "submit submit tips";grid-template-columns:2fr 1fr auto;grid-template-rows:auto auto auto;padding:1rem;row-gap:1rem;width:100%}@media screen and (max-width:600px){.App .main form.create{grid-template-areas:"user user" "title title" "message message" "submit tips";grid-template-columns:1fr auto;grid-template-rows:auto auto auto auto}}.App .main form.create input,.App .main form.create textarea{border:1px solid #353535;border-radius:5px;padding:0 .5rem}.App .main form.create input.title{grid-area:title}.App .main form.create input.user{grid-area:user}.App .main form.create textarea.body{grid-area:message;height:7rem;resize:none}.App .main form.create button.tips{background:#ebebeb;border:1px solid #353535;border-radius:5px;grid-area:tips;padding:.6rem 1rem}.App .main form.create button.tips:hover{background:#e6e6e6}.App .main form.create button.tips:active{background:#dedede}.App .main form.create button.submit{background:#ebebeb;border:1px solid #353535;border-radius:5px;grid-area:submit;padding:.6rem 1rem}.App .main form.create button.submit:hover{background:#e6e6e6}.App .main form.create button.submit:active{background:#dedede}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}.messages{border:1px solid #353535;border-radius:5px;max-width:100%;padding:0 1rem}.messages.loading h2{font-weight:400;margin:0 auto;padding:2rem;text-align:center}.messages .message{display:grid;grid-template-areas:"title user" "message message";grid-template-columns:1fr auto;grid-template-rows:auto auto;max-width:100%;overflow:hidden;padding:1rem 0}.messages .message:not(:last-child){border-bottom:1px solid #353535}.messages .message>div{word-wrap:break-word;overflow:hidden}.messages .message h3{font-weight:700}.messages .message .title{grid-area:title}.messages .message .user{grid-area:user;text-align:right}.messages .message .body{grid-area:message}.messages .message p .red{color:#f10000;font-weight:700}.messages .message p .blue{color:#0c83e4;font-weight:700}.messages .message p .rainbow{-webkit-text-fill-color:transparent;-webkit-animation:move 6s linear infinite;animation:move 6s linear infinite;-webkit-background-clip:text;background-image:linear-gradient(90deg,#ce0000,#cf8700,#ddcf0b,#008b00,#0000c5,indigo,#c958c9);font-weight:700}@-webkit-keyframes move{to{background-position:100vh}}@keyframes move{to{background-position:100vh}}
/*# sourceMappingURL=main.ff59d0be.css.map*/