.card{padding:2em}.read-the-docs{color:#888}.image-canvas{position:relative}.comment-bubble{display:flex;align-items:center;justify-content:center;position:absolute;width:40px;height:40px;background-color:#0c0c0380;border:2px solid #f4f4f4;border-radius:30px 30px 30px 0;padding:.4em;transition:all .25s;animation:fadeIn .5s}.comment-bubble__image{border:2px solid #f4f4f4;border-radius:50%;cursor:pointer;align-self:center;width:100%}.comment-bubble:hover{background-color:#000c}.comment-form{position:absolute;display:flex;flex-direction:column;gap:10px;top:10px;left:10px;background:#0c0c0380;border:2px solid #333;color:#f4f4f4;border-radius:30px 30px 30px 0;padding:2em;width:300px;word-wrap:break-word;word-break:break-all;z-index:9999}.comment-form__close{position:absolute;top:10px;right:10px;background:none;border:none;color:#f4f4f4;cursor:pointer;padding:.4em;width:30px;align-self:flex-end}.comment-form__close:hover{background:none}.comment-form__footer{display:flex;gap:5px}.comment-history{margin-left:20px;background-color:#f4f4f4;border:2px solid #333;border-radius:15px;padding:2em;height:500px;width:300px;overflow-y:auto}.comment-item{display:flex;flex-direction:column;gap:10px;margin-bottom:15px;padding:10px;border:1px solid #3333;border-radius:20px;text-align:left;word-wrap:break-word;word-break:break-all}.comment-item p{margin:0}.comment-item__user{display:flex;align-items:center;gap:8px}.comment-item__user img{width:30px;height:30px;border-radius:50%;border:2px solid #333}.comment-item__user span{font-weight:700}.image-canvas__image-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.image-canvas__image{width:700px;border-radius:12px;border:2px solid #333}.comment-item__image{width:100%;border-radius:12px}.comment-item__voice-note{background:#d612e5;border-radius:30px}.comment-inspect{position:absolute;left:0;bottom:0;background:#0c0c0380;color:#f4f4f4;border:1px solid #f4f4f4;border-radius:30px 30px 30px 0;padding:.5em;width:275px;text-align:left;margin-top:5px;animation:fadeIn .5s;word-wrap:break-word;word-break:break-all;z-index:9999}.comment-inspect__header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #f4f4f4}.comment-inspect__header h4{margin:0}.comment-inspect__header button{background:none;border:none;color:#f4f4f4;cursor:pointer;font-size:1.2em}.comment-inspect__header button:hover{background:none}.comment-inspect__header button:focus{outline:none}.comment-inspect__body{display:flex;gap:10px;align-items:center;padding-top:.4em}.comment-inspect__user{display:flex;align-items:center;gap:10px}.comment-inspect__user img{width:40px;height:40px;border-radius:50%;border:2px solid #f4f4f4}.comment-inspect__image{width:100px;border-radius:12px;background:#f4f4f4}.comment-inspect__comment{width:100%;max-height:140px;text-align:left;overflow-y:auto}.comment-inspect__add-sub-comment{display:flex;gap:10px;align-items:center}.comment-inspect__sub-comments{display:flex;flex-direction:column;gap:10px;padding:.5em;border-top:1px solid #f4f4f4;max-height:100px;overflow-y:auto}.comment-inspect__sub-comments h4{margin:0}@media screen and (max-width: 768px){.comment-history{width:600px}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;padding:20px}.project-card{background-color:#fff;border:1px solid #ddd;border-radius:8px;box-shadow:0 4px 6px #0000001a;padding:20px;text-align:center;transition:transform .2s ease-in-out}.project-card:hover{transform:scale(1.05)}.project-image{max-width:100%;height:auto;border-radius:8px}.project-card h3{font-size:1.5rem;margin:15px 0 10px}.project-card p{color:#666;font-size:1rem}.close-button{position:absolute;top:2rem;left:2rem}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}.content{display:flex;align-items:center;gap:2rem;justify-content:center}.comments-input{display:flex;align-items:center;gap:1rem;width:100%}.comments-input input{width:100%;padding:10px 70px 10px 10px;box-sizing:border-box}.comments-input__buttons{position:absolute;right:95px;display:flex;gap:5px}.comments-input__buttons button{background:none;border:none;color:#f4f4f4;cursor:pointer;padding:.4em;display:flex;align-items:center}@media screen and (max-width: 768px){.content{flex-direction:column}.comments-input{position:relative}.comments-input input{width:100%;padding-right:0}.comments-input__buttons{position:relative;right:0;margin-top:1rem}}:root{font-family:SUSE,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#333;background-color:#f4f4f4;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:30px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#7800b8;cursor:pointer;transition:all .25s}button:hover{background-color:#b140ed}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}input{border-radius:30px;border:1px solid #333;color:#f4f4f4;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit}textarea{border-radius:30px;background-color:#f4f4f4;color:#333;border:1px solid #333;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}