.tooltip-section{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.user-info{align-items:center;display:flex}.user-avatar{object-fit:cover;border-radius:50%;width:30px;height:30px;margin-right:15px}.user-info h4{margin:0 0 5px}.user-info p{margin:0}.multiple-targets-demo{background-color:#f5f5f5;border-radius:4px;padding:15px;line-height:1.6}.sf-dark-mode .multiple-targets-demo{background-color:#2d2438}.sf-dark-mode .feature-heading,.sf-dark-mode .feature-description{color:#e6e1e5}.sf-dark-mode .sf-tooltip .user path{fill:#e6e1e5}.sf-dark-mode .feature-item{background-color:#352c46}.highlight-tooltip{color:#0d6efd;cursor:pointer;font-weight:700;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.feature-showcase{background:linear-gradient(90deg,#f9f9f9,#f0f0f0);border-radius:8px;margin:20px 0;padding:24px;box-shadow:0 2px 12px #0000000d}.feature-heading{color:#333;text-align:center;margin-top:0;margin-bottom:20px;font-size:1.2rem;font-weight:600}.feature-list{margin:0;padding:0;list-style-type:none}.feature-item{background-color:#fff;border-radius:6px;align-items:center;margin-bottom:16px;padding:12px 16px;transition:transform .2s,box-shadow .2s;display:flex}.feature-icon{justify-content:center;align-items:center;min-width:40px;margin-right:15px;font-size:24px;display:flex}.feature-content{flex:1}.highlight-tooltip{color:#2c7be5;cursor:pointer;-webkit-user-select:none;user-select:none;border-bottom:1px dotted #2c7be5;font-weight:600;text-decoration:none;transition:color .2s}.highlight-tooltip:hover{color:#1a5cbf}.feature-description{color:#555;margin-left:6px}.card{border:1px solid rgb(var(--sf-color-white));border-radius:var(--sf-radius-8);width:200px;height:300px;box-shadow:0 4px 8px rgba(var(--sf-color-black),.1);margin:var(--sf-spacing-20);overflow:hidden}.sf-dark-mode .card{border:1px solid rgb(var(--sf-color-black))}.card-image{width:200px;height:200px}.card-title{padding:var(--sf-spacing-6);text-align:center}
.positioned.component-section{max-width:600px}.tooltip-grid{flex-direction:column;align-items:center;max-width:800px;margin:0 auto;display:flex}.tooltip-grid .sf-btn{width:100%}.tooltip-row{justify-content:space-around;display:flex}.tooltip-row.mid-row{justify-content:space-between;gap:350px;display:flex}#positioned-tooltip .left-col,#positioned-tooltip .right-col{flex-direction:column;gap:5px;display:flex}@media screen and (max-width:900px){.tooltip-grid{gap:20px}.tooltip-grid .sf-btn:last-child{white-space:normal}#positioned-tooltip .left-col,#positioned-tooltip .right-col{gap:20px}.tooltip-grid .sf-btn{min-width:80px;font-size:13px}.tooltip-row.mid-row{justify-content:center;gap:0}.tooltip-row{gap:0}.positioned.component-section{max-width:300px}}
.image-editor-container{background-color:#f8f9fa;border-radius:10px;margin:0 auto;padding:20px;box-shadow:0 5px 15px #00000014}.editor-header{justify-content:center;align-items:center;margin-bottom:20px;display:flex}.image-editor-container .editor-title{font-size:16px;font-weight:700}.image-editor-container h2{color:#333;margin:0;font-size:24px}.image-container{background-color:#f5f5f5;border:1px solid #ddd;border-radius:6px;justify-content:center;width:100%;margin-bottom:15px;display:flex;position:relative;overflow:hidden}.image-canvas{cursor:crosshair;background-color:#fff;max-width:100%;height:auto;display:block}.current-pixel{background-color:#fff;border-radius:8px;align-items:center;gap:12px;margin-top:15px;padding:12px;display:flex;box-shadow:0 2px 8px #0000000d}.color-swatch{border:1px solid #0000001a;border-radius:6px;width:30px;height:30px}.pixel-details{color:#555;font-size:14px}.pixel-tooltip{border-radius:6px;min-width:180px;padding:12px;display:flex}.color-preview{border:2px solid #fff3;border-radius:4px;width:40px;height:40px;margin-right:12px}.pixel-coord{opacity:.8;gap:10px;margin-bottom:5px;font-size:13px;display:flex}.pixel-color{font-size:14px;font-weight:700}.pixel-brightness{opacity:.8;font-size:13px}.sf-dark-mode .image-editor-container{background-color:#2d2438}.sf-dark-mode .image-editor-container h2,.sf-dark-mode .image-editor-container .pixel-details{color:#e6e1e5}.sf-dark-mode .current-pixel{background-color:#352c46}