* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

@media (hover: hover) and (pointer: fine) {

    html,
    body,
    *,
    *::before,
    *::after {
        cursor: url('/common/assets/Mouse/light/5355742bfec39c352cd8.cur'), auto !important;
    }

    a,
    a *,
    button,
    button *,
    [role="button"],
    [role="button"] *,
    .ww-select,
    .ww-select *,
    .ww-select-trigger,
    .ww-select-trigger *,
    .ww-select-option,
    .ww-select-option *,
    .ww-select-menu,
    .ww-select-menu *,
    .role-select-trigger,
    .role-select-trigger *,
    .ww-btn-primary,
    .ww-btn-primary *,
    .ww-btn-secondary,
    .ww-btn-secondary *,
    .ww-btn-action,
    .ww-btn-action *,
    .ww-btn-guide,
    .ww-btn-guide *,
    .selection-tile,
    .selection-tile *,
    .ww-modal-close,
    .ww-modal-close *,
    .ww-back-top,
    .ww-back-top *,
    .ww-binding-check,
    .ww-binding-check *,
    .ww-binding-options label,
    .ww-binding-options label *,
    input[type="checkbox"],
    input[type="radio"],
    select,
    select *,
    .refinement-select,
    .refinement-select *,
    #btn-calculate,
    #btn-calculate *,
    #btn-import-from-text,
    #btn-import-from-text *,
    #btn-feedback-open,
    #btn-feedback-open *,
    #btn-guide-open,
    #btn-guide-open *,
    #close-modal,
    #close-modal *,
    #close-guide,
    #close-guide *,
    #close-text-import,
    #close-text-import *,
    #close-feedback,
    #close-feedback *,
    #error-dialog-ok,
    #error-dialog-ok *,
    #error-dialog-close,
    #error-dialog-close *,
    #cancel-feedback,
    #cancel-feedback *,
    #submit-feedback,
    #submit-feedback *,
    #btn-valuation-feedback,
    #btn-valuation-feedback *,
    #close-valuation-feedback,
    #close-valuation-feedback *,
    #valuation-feedback-submit,
    #valuation-feedback-submit *,
    #confirm-text-import,
    #confirm-text-import *,
    #cancel-text-import,
    #cancel-text-import *,
    #reset-selection,
    #reset-selection *,
    #confirm-selection,
    #confirm-selection *,
    .ww-rec-avatar-trigger,
    .ww-rec-avatar-trigger *,
    input[type="submit"],
    input[type="submit"] *,
    input[type="button"],
    input[type="button"] * {
        cursor: url('/common/assets/Mouse/light/70731e7446cbdd3269bf.cur'), pointer !important;
    }

    a i,
    a svg,
    button i,
    button svg,
    [role="button"] i,
    [role="button"] svg,
    .ww-select-trigger i,
    .role-select-trigger i {
        pointer-events: none;
    }

    input[type="text"],
    input[type="number"],
    input[type="email"],
    input[type="search"],
    input[type="tel"],
    input[type="url"],
    input[type="password"],
    textarea,
    [contenteditable="true"] {
        cursor: url('/common/assets/Mouse/light/4e01298cdf8ce45f3df9.cur'), text !important;
    }

    .ww-draw-canvas {
        cursor: url('/common/assets/Mouse/light/ee93e2af549a10794772.cur'), crosshair !important;
    }
}

@media (hover: hover) and (pointer: fine) {

    .ww-cursor-dot,
    .ww-cursor-outline {
        position: fixed;
        top: 0;
        left: 0;
        pointer-events: none;
        z-index: 9999;
        border-radius: 50%;
        opacity: 0;
        transform: translate(-50%, -50%) scale(0);
        transition: opacity 0.2s ease, transform 0.2s ease;
    }

    .ww-cursor-dot {
        width: 8px;
        height: 8px;
        background: #1a1a1a;
    }

    .ww-cursor-outline {
        width: 40px;
        height: 40px;
        border: 1.5px solid #1a1a1a;
    }

    .ww-long-pressing .ww-cursor-dot,
    .ww-long-pressing .ww-cursor-outline {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1);
    }

    .ww-long-pressing .ww-cursor-outline {
        animation: ww-long-press-shrink 0.45s linear forwards;
    }

    @keyframes ww-long-press-shrink {
        from {
            transform: translate(-50%, -50%) scale(1.2);
            opacity: 0.8;
        }

        to {
            transform: translate(-50%, -50%) scale(0.2);
            opacity: 1;
        }
    }
}

body,
.ww-body {
    scroll-behavior: smooth;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}





.ww-grid-overlay {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(0, 0, 0, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(0, 0, 0, 0.04) 1px, transparent 1px);
    background-size: 28px 28px;
    opacity: 0.7;
}

@media (hover: hover) and (pointer: fine) {
    .ww-draw-canvas {
        position: fixed;
        inset: 0;
        z-index: 9998;
        pointer-events: none;
    }

    .ww-draw-canvas.ww-draw-mode {
        pointer-events: auto;
        cursor: crosshair;
    }

    body.ww-draw-mode {
        cursor: crosshair;
    }
}

@media (max-width: 768px) {
    .ww-draw-canvas {
        display: none !important;
    }
}

@media (max-width: 1024px) {

    .ww-cursor-dot,
    .ww-cursor-outline {
        display: none !important;
    }
}


@media (max-width: 1024px) {

    .ww-ripple-layer,
    .ww-mouse-ripple {
        display: none !important;
    }
}


.ww-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
    background: rgba(250, 249, 245, 0.75);
    backdrop-filter: saturate(180%) blur(20px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.ww-nav-inner {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 1.5rem;
    height: 4rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media (min-width: 768px) {
    .ww-nav-inner {
        padding: 0 2.5rem;
    }
}

.ww-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #1a1a1a;
    transition: opacity 0.2s ease;
}

.ww-logo:hover {
    opacity: 0.8;
}

.ww-logo-icon {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 0.75rem;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.08);
    flex-shrink: 0;
}

.ww-logo-icon img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ww-logo-text {
    margin-left: 0.75rem;
    font-size: 1.25rem;
    font-weight: 700;
}


.ww-nav-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

@media (max-width: 1024px) {
    .ww-nav-inner {
        padding: 0 1rem;
        height: 3.5rem;
    }

    .ww-btn-primary {
        padding: 0 1rem;
        height: 2rem;
        font-size: 0.8rem !important;
    }

    .ww-nav-actions {
        gap: 0.5rem;
    }

    .ww-logo-icon {
        width: 2rem;
        height: 2rem;
        border-radius: 0.5rem;
    }

    .ww-logo-text {
        font-size: 1.1rem;
        margin-left: 0.5rem;
    }
}

