@import"https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap";.appGridContainer{display:grid;width:100vw;height:100vh;grid-template-rows:60px 1fr;overflow:hidden;background:var(--accent-color-real-white)}.appHeader{display:flex;padding-right:20px;flex-direction:row}.headerLogo{margin:auto auto auto 50vw;transform:translate(-50%);height:50px}.friend-request-list{margin:10px;display:grid;grid-template:60px /60px 1fr 40px;background:var(--accent-color-real-white);padding:10px;border-radius:99px;width:300px;grid-template-areas:"a b c"}.headerGridItem{padding:10px}.headerGridItem button{margin:0}.settingIcon{width:40px;height:40px;border-radius:99px}.dialog{position:absolute;margin-top:10px;right:30px;box-shadow:var(--accent-color-white) 0 0 25px;background:#fff;border-radius:10px;border:solid 1px var(--accent-color-tint);padding:15px;z-index:var(--layor-level-card)}.accountDialog{width:250px;display:grid;grid-template-columns:60px 1fr;grid-template-rows:60px 40px 40px}.accountDialog .accountIcon{width:50px;display:block;height:50px;margin:5px}.accountDialog .logoutButtonArea{position:relative;grid-row:3/4;grid-column:1/3;text-align:left;padding:3px 0 3px 10px}.accountDialog .logoutButtonArea .logoutButton{height:30px;line-height:30px;vertical-align:center}.accountDialog .editProfileButtonArea{position:relative;text-align:left;padding:3px 0 3px 10px;grid-row:2/3;grid-column:1/3}.accountDialog .editProfileButtonArea .editProfileButton{height:30px;line-height:20px;vertical-align:middle}.accountDialog .editProfileButtonArea .editProfileButton .buttonIcon{font-size:1.4em}.buttonText{position:relative;bottom:25%;display:inline-block;margin-left:10px}.accountDialog-username{text-align:left;padding-left:10px;font-size:1.1em;font-weight:700}.accountDialog-id{text-align:left;padding-left:10px;font-size:1em}.settingIcon .material-symbols-outlined{font-size:30px}.accountIcon{width:40px;height:40px;border-radius:99px;border:solid 1px #838383;position:relative;background:#fff}.mainGridContainer{display:grid;width:100%;grid-template-columns:250px 4fr;padding:10px 30px 30px 0;grid-template-rows:calc(100vh - 105px)}.chatRoomGridContainer{padding:10px;border-radius:30px;background:#fff;display:grid;grid-template-columns:9fr 1fr}.chatRoom{overflow-x:hidden;overflow-y:hidden;height:100%;padding:0 20px;position:relative}@font-face{src:url(/assets/Inter.var-85f08b5f.woff2) format("woff2-variations");font-family:InterVar;font-weight:100 1000;font-stretch:25% 151%}.says{background:var(--accent-color-white);width:fit-content;display:inline-block;padding:6px 15px}.right .says{border-radius:20px 20px 0;text-align:left}.left .says{border-radius:20px 20px 20px 0;text-align:left}.says p{max-width:25vw;font-size:.9em}.right .tokki{display:inline-block;background:#bde0ff;width:10px;height:10px;position:absolute;bottom:0}.left .tokki{display:inline-block;background:#bde0ff;width:10px;height:10px;position:absolute;bottom:0;left:-10px}.balloon.right{position:relative;margin:10px 10px 10px auto;width:fit-content}.balloon.left{position:relative;margin:10px auto 10px 10px;width:fit-content}.right .katanuki{width:20px;height:20px;position:absolute;bottom:0;border-radius:999px;background:#fff;right:-20px;z-index:4}.left .katanuki{width:20px;height:20px;position:absolute;bottom:0;border-radius:999px;background:#fff;left:-20px;z-index:4}.timeStamp{font-family:InterVar,sans-serif;font-size:.8em}.left .timeStamp{position:absolute;right:-32px;bottom:0}.right .timeStamp{position:absolute;left:-32px;bottom:0}.balloonArea{height:calc(100% - 150px);overflow-y:hidden;overflow-x:hidden}.balloonArea:hover{overflow-y:scroll}.balloonArea:hover .right{margin:10px 5px 10px auto}.inputArea{margin-top:10px;display:grid;grid-template-columns:1fr 40px;height:40px;width:100%;position:absolute;bottom:0;left:0;right:0}.inputArea textarea{border-radius:20px;width:100%;resize:none;padding:5px 10px;display:inline-block}.inputArea .buttonSend{display:inline-block;position:relative;background:none;margin:2px;width:36px;height:36px}.modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.37);z-index:var(--layor-level-modal-back)}.modal-user-profile__window{z-index:100;position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;height:70vh;width:450px;background:#fff;border-radius:20px;display:grid;grid-template:70px 170px 1fr 70px/ 50% 50%;grid-template-areas:"a a" "b b" "c d" "e e"}.modal-user-profile__window__title{margin:auto;font-weight:700;font-size:1.7em;grid-area:a}.modal-user-profile__window__action-control{grid-area:e;border-radius:0 0 20px 20px;background:var(--accent-color-white);text-align:right;padding:15px 10px}.modal-user-profile__window__action-control button{margin-right:5px}.modal-user-profile__window__avatar{grid-area:b;height:80%;aspect-ratio:1 / 1;border-radius:999px;border:solid 1px #000;margin:auto}.modal-user-profile__window__avatar label{display:block;width:100%;height:100%;border-radius:999px}.modal-user-profile__window__userdata-left{text-align:left;margin-left:30px;margin-right:6px;grid-area:c}.modal-user-profile__window__userdata-right{grid-area:d;margin-left:12px;margin-right:30px;text-align:left}.modal-user-profile__window__userdata-right textarea{width:100%;height:170px;background:#fff}.modal-image-crop{z-index:50;background:none;margin:auto;width:fit-content;height:100vh;position:fixed;top:0;right:0;bottom:0;left:0}.modal-image-crop div{margin:20px 0 0}.buttonCloseCropModal{background:var(--accent-color-white);margin:15px 0 0;line-height:40px;height:40px;width:50px}.buttonCloseCropModal.left{border-radius:20px 0 0 20px;border-right:solid 1px var(--accent-color)}.buttonCloseCropModal.right{border-radius:0 20px 20px 0}.buttonCloseCropModal:hover{background:var(--accent-color);color:#fff}.crop-back{background:rgba(0,0,0,.3);position:fixed;top:0;right:0;bottom:0;left:0}.profile-form{position:relative}.profile-form-input{position:absolute;top:0;left:0;z-index:20}.profile-form-label p{position:relative;font-size:1.5em;font-weight:700;z-index:10;top:-4px;left:8px;display:inline-block}.profile-form-input input{width:calc(100% - 45px);line-height:40px;height:40px;margin:0;position:relative;top:-5px;font-weight:700;background:var(--accent-color-real-white)}.profile-form-label button{width:35px;height:35px;border-radius:999px;line-height:35px}.profile-form-input button{position:relative;width:35px;height:35px;border-radius:999px;line-height:35px;margin:0 4px}.profile-item{height:fit-content;margin-bottom:20px;border-radius:15px;padding:6px;background:var(--accent-color-real-white)}.profile-item.bio{height:calc(100% - 20px)}.imagecrop{z-index:150}.friendListGrid{display:grid;grid-template:40px 1fr/1fr;grid-template-areas:"a" "b";height:100%;padding:10px 15px 10px 20px}.friend-list-control{grid-area:a;border-radius:10px;background:var(--accent-color-real-white)}.friend-request{border:solid 1px red}.friend-grid{border-radius:20px;margin-top:7px;display:grid;height:70px;grid-template:70px/70px 1fr;background:var(--accent-color-white);grid-template-areas:"a b"}.friend-grid:hover{border:solid 3px var(--accent-color)}.friend-grid.active{background:var(--accent-color-tint2)}.friend-text-area{margin-top:25%;transform:translateY(-55%);height:fit-content}.friend-grid .accountIcon{grid-area:a;width:42px;height:42px;margin:14px}.friend-name{font-weight:700;text-align:left}.friend-last-talk{text-align:left;line-height:15px;font-size:.9em}.modal-add-friend{background:#fff;border-radius:20px;height:70vh;width:450px;margin:auto;position:fixed;top:0;right:0;bottom:0;left:0;padding:30px}.searched-friend-grid{margin:20px;display:grid;grid-template:60px /60px 1fr 40px;background:var(--accent-color-real-white);padding:10px;border-radius:99px;grid-template-areas:"a b c"}.searched-friend-grid--username{padding-left:10px;text-align:left;grid-area:b}.searched-friend-grid--avatar{width:50px;height:50px;margin:5px;grid-area:a}.searched-friend-grid--area-add-button{grid-area:c}.searched-friend-grid--area-add-button button{margin:0}.mainBar h1{font-weight:800;font-size:6em;display:inline-block;margin-right:20px;line-height:1}.logoSection{display:inline-block}.mainLogoText{width:500px}.loginButton{display:inline-block;transform:translateY(-50%)}.mainBar{text-align:center;position:absolute;top:45%;right:0;left:50%;transform:translateY(-50%) translate(-50%);height:fit-content;width:fit-content}body{text-align:center}.loadingScreen{position:fixed;top:0;bottom:0;left:0;right:0;z-index:var(--layor-level-modal-back);background:rgba(255,255,255,.66)}.loadingScreen .loadingCircle{fill:none;stroke:var(--accent-color-pure);stroke-width:10;margin:calc(50vh - 50px) calc(50vw - 25px);animation:expand-stroke 1.4s infinite cubic-bezier(.4,0,.3,1),rotate-stroke 1.2s infinite linear;stroke-linecap:round;stroke-dasharray:230 230}@keyframes expand-stroke{0%{stroke-dashoffset:230}to{stroke-dashoffset:-230}}@keyframes rotate-stroke{0%{transform:none}to{transform:rotate(360deg)}}*,*:before,*:after{box-sizing:border-box}*{margin:0}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{display:block;max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#root,#__next{isolation:isolate}@font-face{src:url(/assets/NotoSansCJKjp-Light-d343a053.woff2) format("woff2");font-family:NotoSans;font-weight:300}@font-face{src:url(/assets/NotoSansCJKjp-Regular-82838d7a.woff2) format("woff2");font-family:NotoSans;font-weight:400}@font-face{src:url(/assets/NotoSansCJKjp-Medium-2f81b5b5.woff2) format("woff2");font-family:NotoSans;font-weight:500}@font-face{src:url(/assets/NotoSansCJKjp-Bold-9704bf7d.woff2) format("woff2");font-family:NotoSans;font-weight:700}@font-face{src:url(/assets/Inter.var-85f08b5f.woff2) format("woff2-variations");font-family:InterVar;font-weight:100 1000;font-stretch:25% 151%}*,body{font-family:InterVar,"Noto Color Emoji",NotoSans,sans-serif;font-weight:400;--layor-level-modal-back: 30;--layor-level-modal-window: 40;--layor-level-base: 0;--layor-level-card: 10}textarea{resize:none;outline:none;border-radius:10px;background:#fff;padding:5px;border:3px solid var(--accent-color-tint)}textarea:focus{border:3px solid var(--accent-color);background:#fff}input{resize:none;outline:none;border-radius:10px;padding:5px;border:2px solid #444}input{border:3px solid var(--accent-color-tint)}input:focus{border:3px solid var(--accent-color)}.bold{font-weight:600}button{background:none;outline:none;border:none;padding:5px;border-radius:99px;color:var(--accent-color);margin:0 10px;transition:.2s}button:hover{background:var(--accent-color-white);color:var(--accent-color)}button.darken:hover{background:var(--accent-color-tint)}button.colored{background:var(--accent-color);color:#fff}button.colored:hover{box-sizing:border-box;color:#fff;background:var(--accent-color-pure);box-shadow:var(--accent-color-tint) 0 0 25px}button.medium{width:100px;font-size:1.2em;font-weight:600}.overflowEllipsis{text-overflow:ellipsis}button.large{width:150px;font-size:2em;font-weight:700}.inlineBlock{display:inline-block}*::-webkit-scrollbar{width:5px;height:5px}*::-webkit-scrollbar-thumb{border-radius:5px;background:rgba(164,164,164,.55)}*::-webkit-scrollbar-thumb:hover{width:24px;background:rgba(75,75,75,.55)}.hide{display:none}.modal-layer{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--layor-level-modal-back);background:rgba(0,0,0,.37)}.notice-area{position:fixed;top:0;right:0;bottom:0;left:0;width:400px;height:fit-content;margin:0 auto auto;z-index:60}.notice{width:400px;margin:10px auto;background:#ff0b53;color:#fff;border-radius:10px;box-shadow:#ffb0b0 0 0 10px;transition:.5s}.notice.alert-green{background-color:#54eb43;box-shadow:#aeffa5 0 0 10px}.notice.hide{opacity:0;transition:.5s}.notice p{display:inline-flex;align-items:center;line-height:2.2em}.notice p span{margin-right:5px}