.lonav,.lonav-widget{--burg:#881119;--gold:#BF9B30;--black:#1A1A1A;--ivory:#F5F5F7}.lonav,.lonav *,.lonav-widget,.lonav-widget *{box-sizing:border-box}.lonav{container-type:inline-size;width:min(1040px,100%);margin:0 auto;padding:clamp(20px,2.5vw,32px);overflow:hidden;background:radial-gradient(circle at 17% 45%,rgba(191,155,48,.07),transparent 25%),radial-gradient(circle at 82% 35%,rgba(136,17,25,.045),transparent 28%),#fbfaf7;color:#1a1a1a;scroll-margin-top:84px}.lonav-head{text-align:center;max-width:850px;margin:0 auto 18px}.lonav-eyebrow{display:flex;align-items:center;justify-content:center;gap:12px;color:#9d7821;font:700 12px/1.2 sans-serif;letter-spacing:.28em}.lonav-eyebrow span{width:100px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}.lonav-eyebrow span:last-child{background:linear-gradient(90deg,var(--gold),transparent)}.lonav-head h2{margin:12px 0 6px!important;color:#111!important;font-size:clamp(28px,3.7vw,42px)!important;line-height:1.05!important}.lonav-head p{margin:0!important;font-size:clamp(16px,1.8vw,19px)!important}.lonav-rule{width:90px;height:1px;background:var(--gold);margin:15px auto 10px;position:relative}.lonav-rule:after{content:"";position:absolute;width:7px;height:7px;border-radius:50%;background:var(--gold);left:41px;top:-3px}.lonav-head small{font-size:14px;color:#555}.lonav-workspace{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;align-items:center}.lonav-map{min-width:0}.lonav-stage{position:relative;width:100%;height:510px;max-width:720px;margin:auto}.lonav-compass{position:absolute;z-index:2;left:50%;top:50%;width:min(330px,48%);aspect-ratio:1;transform:translate(-50%,-50%);filter:drop-shadow(0 14px 20px rgba(0,0,0,.18))}.lonav-compass>img{display:block;width:100%;height:100%;object-fit:contain}.lonav-dial-mask{position:absolute;z-index:6;left:50%;top:50%;width:52%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle,#fbf6e8 0 58%,#efe0b8 72%,#b98c32 74%,#6d3c12 77%,#d8ad4b 81%,#f5dc91 85%,#6e3c12 89%,transparent 90%);box-shadow:inset 0 0 0 1px rgba(100,55,10,.28),0 2px 7px rgba(0,0,0,.12);pointer-events:none}.lonav-dial-mask:after{content:"";position:absolute;left:50%;top:50%;width:17%;aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%);background:radial-gradient(circle at 35% 30%,#fff4b7 0 8%,#d9a52c 28%,#8b5412 55%,#3c2108 72%,#d6a238 76%,#f2d06c 88%);box-shadow:0 1px 5px rgba(0,0,0,.35)}.lonav-pointer{--lonav-angle:0deg;position:absolute;z-index:8;left:50%;top:50%;width:18%;aspect-ratio:1;transform:translate(-50%,-50%) rotate(var(--lonav-angle));transform-origin:50% 50%;transition:transform 0.72s cubic-bezier(.22,.8,.24,1);pointer-events:none;filter:drop-shadow(0 3px 5px rgba(0,0,0,.2))}.lonav-pointer img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none}.lonav-pointer:before{content:none}.lonav-pointer span{display:none}.lonav-hub{display:none}.lonav-choices{position:absolute;inset:0;z-index:5}.lonav-choice{position:absolute!important;display:flex!important;align-items:center!important;gap:8px!important;width:176px!important;min-width:176px!important;max-width:176px!important;min-height:68px!important;height:68px!important;margin:0!important;padding:9px 11px!important;border:1px solid rgba(191,155,48,.62)!important;border-radius:14px!important;background:rgba(255,255,255,.96)!important;color:#111!important;box-shadow:0 6px 14px rgba(0,0,0,.07)!important;text-align:left!important;font:700 12.5px/1.2 sans-serif!important;letter-spacing:0!important;text-transform:none!important;white-space:normal!important;overflow:hidden!important;cursor:pointer;transition:transform 0.72s,background .22s,color .22s,box-shadow .22s,border-color .22s}.lonav-choice:hover,.lonav-choice:focus-visible{transform:translateY(-2px);box-shadow:0 10px 20px rgba(0,0,0,.11)!important;outline:0}.lonav-choice.is-active{background:linear-gradient(145deg,#99131d,#69080e)!important;color:#fff!important;border-color:#e3bd50!important;box-shadow:0 0 0 2px rgba(191,155,48,.16),0 9px 22px rgba(136,17,25,.2)!important}.lonav-icon{flex:0 0 30px}.lonav-icon svg{display:block;width:28px;height:28px;fill:none;stroke:var(--gold);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.lonav-label{display:block;min-width:0}.lonav-choice-0{left:0;top:1%}.lonav-choice-1{right:0;top:1%}.lonav-choice-2{left:0;top:20%}.lonav-choice-3{right:0;top:20%}.lonav-choice-4{left:0;top:39%}.lonav-choice-5{right:0;top:39%}.lonav-choice-6{left:0;top:58%}.lonav-choice-7{right:0;top:58%}.lonav-choice-8{left:0;top:77%}.lonav-choice-9{right:0;top:77%}.lonav-result{min-width:0;min-height:370px;padding:22px 19px;border:1px solid var(--gold)!important;border-radius:19px!important;background:radial-gradient(circle at 20% 10%,rgba(136,17,25,.72),transparent 52%),linear-gradient(150deg,#381014,#100b0c 76%)!important;color:#fff!important;box-shadow:0 14px 30px rgba(0,0,0,.2)!important;overflow:hidden;scroll-margin-top:105px}.lonav-result-kicker{color:#e5c35f;font-size:12px}.lonav-result-rule{width:58px;height:1px;background:var(--gold);margin:13px 0 17px}.lonav-result h3{margin:0 0 11px!important;color:#e9c55b!important;font-size:clamp(23px,2.4vw,30px)!important;line-height:1.04!important;letter-spacing:.02em;overflow-wrap:anywhere}.lonav-result p{color:#fff!important;font-size:14px!important;line-height:1.45!important;overflow-wrap:anywhere}.lonav-result-detail{opacity:.82}.lonav-primary,.lonav-secondary,.lonav-back{display:flex!important;align-items:center!important;justify-content:space-between!important;width:100%!important;min-height:47px!important;margin:9px 0 0!important;padding:10px 13px!important;border:1px solid var(--gold)!important;border-radius:9px!important;text-decoration:none!important;font:800 13px/1.2 sans-serif!important;white-space:normal!important}.lonav-primary{background:linear-gradient(135deg,#f2d477,#bf9b30)!important;color:#17120a!important}.lonav-secondary{background:transparent!important;color:#e8c965!important}.lonav-back{background:transparent!important;color:#d9d9d9!important;border-color:rgba(255,255,255,.28)!important;justify-content:flex-start!important;cursor:pointer}.lonav-result.is-changing h3,.lonav-result.is-changing p{animation:lonav-fade .38s ease}.lonav-widget{display:inline-flex;align-items:center;gap:10px;max-width:100%;padding:7px 12px 7px 7px;border:1px solid var(--gold);border-radius:999px;background:#111;color:#fff!important;text-decoration:none!important;box-shadow:0 8px 24px rgba(0,0,0,.24);transition:transform 0.72s,box-shadow .2s}.lonav-widget img{width:48px;height:48px;object-fit:contain;border-radius:50%;animation:lonav-pulse 2.8s ease-in-out infinite}.lonav-widget span{font:800 12px/1.2 sans-serif}.lonav-widget b{color:var(--gold);font-size:18px}.lonav-widget:hover{transform:translateY(-2px);box-shadow:0 0 0 3px rgba(191,155,48,.18),0 10px 28px rgba(0,0,0,.3)}
html.loborient-navigator-visible .las-mini-wrap,body.loborient-navigator-visible .las-mini-wrap,html.loborient-navigator-visible .lq-companion,body.loborient-navigator-visible .lq-companion,html.loborient-navigator-visible .lq-companion-wrap,body.loborient-navigator-visible .lq-companion-wrap,html.loborient-navigator-visible .lobius-widget,body.loborient-navigator-visible .lobius-widget,html.loborient-navigator-visible .labirintus-widget,body.loborient-navigator-visible .labirintus-widget,html.loborient-navigator-visible [data-loborient-floating],body.loborient-navigator-visible [data-loborient-floating],.lonav-external-hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:scale(.86)!important}
@keyframes lonav-fade{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:none}}@keyframes lonav-pulse{50%{filter:drop-shadow(0 0 8px #d8b247);transform:scale(1.04)}}
@container (max-width:900px){.lonav-workspace{grid-template-columns:1fr}.lonav-stage{max-width:720px}.lonav-result{width:min(580px,100%);min-height:0;margin:0 auto}.lonav-result h3{font-size:28px!important}}
@container (max-width:720px){.lonav-stage{height:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:300px}.lonav-compass{top:140px;width:285px}.lonav-choices{position:static;display:contents}.lonav-choice{position:static!important;width:100%!important;min-width:0!important;max-width:none!important;min-height:66px!important;height:auto!important}.lonav-choice-0,.lonav-choice-1,.lonav-choice-2,.lonav-choice-3,.lonav-choice-4,.lonav-choice-5,.lonav-choice-6,.lonav-choice-7,.lonav-choice-8,.lonav-choice-9{inset:auto}}
@container (max-width:480px){.lonav{padding:18px 10px}.lonav-eyebrow span{width:28px}.lonav-stage{grid-template-columns:1fr;padding-top:255px}.lonav-compass{top:120px;width:min(245px,78vw)}.lonav-choice{min-height:60px!important}.lonav-result{padding:20px 16px}.lonav-widget img{width:40px;height:40px}.lonav-widget span{font-size:11px}}
@media(prefers-reduced-motion:reduce){.lonav-pointer,.lonav-choice,.lonav-widget,.lonav-widget img,.lonav-result *{transition:none!important;animation:none!important}}

.lonav-force-hidden{display:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important}

.lonav-force-hidden{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important}

/* 2.1.1: dial mask removed */
.lonav .lonav-dial-mask{display:none !important;background:none !important;box-shadow:none !important;}


/* 2.1.2 — pointer geometry correction */
.lonav .lonav-compass {
    position: relative !important;
}
.lonav .lonav-pointer {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: 46% !important;
    height: 46% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform-origin: 0 0 !important;
    transform: rotate(var(--lonav-angle, 0deg)) !important;
    transition: transform 0.55s cubic-bezier(.22,.8,.25,1) !important;
    pointer-events: none !important;
    z-index: 5 !important;
}
.lonav .lonav-pointer img {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    left: -50% !important;
    top: -50% !important;
    object-fit: contain !important;
    transform: none !important;
}


/* 2.1.3 — exact needle hub alignment */
.lonav .lonav-pointer {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: 58% !important;
    height: 58% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform-origin: 0 0 !important;
    transform: rotate(var(--lonav-angle, 0deg)) !important;
    transition: transform 0.48s cubic-bezier(.22,.8,.25,1) !important;
    pointer-events: none !important;
    z-index: 5 !important;
}
.lonav .lonav-pointer img {
    position: absolute !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    left: -49.553% !important;
    top: -48.905% !important;
    object-fit: contain !important;
    transform: none !important;
}


/* 2.1.4 — simple compact red pointer */
.lonav .lonav-pointer {
    position: absolute !important;
    left: 50% !important;
    top: 50% !important;
    right: auto !important;
    bottom: auto !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform-origin: 0 0 !important;
    transform: rotate(var(--lonav-angle, 0deg)) !important;
    transition: transform 0.36s cubic-bezier(.22,.8,.25,1) !important;
    z-index: 6 !important;
    pointer-events: none !important;
}
.lonav .lonav-pointer img {
    display: none !important;
}
.lonav .lonav-pointer::before {
    content: "" !important;
    position: absolute !important;
    left: -4px !important;
    bottom: 0 !important;
    width: 8px !important;
    height: 82px !important;
    background: linear-gradient(to top, #881119 0%, #a3131d 72%, #c61b27 100%) !important;
    clip-path: polygon(50% 0, 100% 100%, 0 100%) !important;
    transform: translateY(0) !important;
    transform-origin: 50% 100% !important;
    filter: drop-shadow(0 1px 1px rgba(0,0,0,.28)) !important;
}
.lonav .lonav-pointer::after {
    content: "" !important;
    position: absolute !important;
    width: 14px !important;
    height: 14px !important;
    left: -7px !important;
    top: -7px !important;
    border-radius: 50% !important;
    background: #BF9B30 !important;
    border: 2px solid #881119 !important;
    box-sizing: border-box !important;
}


/* 2.1.7 — approved eye instrument + ONE gold pointer */
.lonav .lonav-dial-mask { display:none !important; }
.lonav .lonav-compass { position:relative !important; overflow:visible !important; }
.lonav .lonav-compass-face {
    display:block !important;
    width:100% !important;
    height:auto !important;
    object-fit:contain !important;
}

.lonav .lonav-pointer {
    position:absolute !important;
    left:50% !important;
    top:50% !important;
    right:auto !important;
    bottom:auto !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
    transform-origin:0 0 !important;
    transform:rotate(var(--lonav-angle, 0deg)) !important;
    transition:transform .30s cubic-bezier(.22,.8,.25,1) !important;
    z-index:20 !important;
    pointer-events:none !important;
}
.lonav .lonav-pointer img { display:none !important; }

/* Only visible pointer: compact gold needle, starts exactly at center */
.lonav .lonav-pointer::before {
    content:"" !important;
    position:absolute !important;
    left:-4px !important;
    bottom:0 !important;
    width:8px !important;
    height:82px !important;
    background:linear-gradient(to right,#9a6a12 0%,#f1d16a 48%,#b17b17 100%) !important;
    clip-path:polygon(50% 0,100% 100%,0 100%) !important;
    transform-origin:50% 100% !important;
    filter:drop-shadow(0 1px 1px rgba(0,0,0,.28)) !important;
}
.lonav .lonav-pointer::after {
    content:"" !important;
    position:absolute !important;
    left:-8px !important;
    top:-8px !important;
    width:16px !important;
    height:16px !important;
    border-radius:50% !important;
    background:radial-gradient(circle at 35% 30%,#fff0a0 0%,#d9ad36 35%,#9b6710 100%) !important;
    border:1px solid #6f4707 !important;
    box-sizing:border-box !important;
    box-shadow:0 1px 3px rgba(0,0,0,.35) !important;
}


/* 2.1.8 — mobile navigator correction */
@container (max-width:720px){
    .lonav-stage{
        height:520px !important;
        display:block !important;
        padding-top:0 !important;
    }
    .lonav-compass{
        left:50% !important;
        top:50% !important;
        width:min(250px,48%) !important;
        transform:translate(-50%,-50%) !important;
    }
    .lonav-choices{
        position:absolute !important;
        inset:0 !important;
        display:block !important;
    }
    .lonav-choice{
        position:absolute !important;
        width:155px !important;
        min-width:155px !important;
        max-width:155px !important;
        min-height:62px !important;
        height:62px !important;
        padding:8px 9px !important;
        font-size:11.5px !important;
    }
    .lonav-choice-0{left:0 !important;top:0 !important}
    .lonav-choice-1{right:0 !important;top:0 !important}
    .lonav-choice-2{left:0 !important;top:21% !important}
    .lonav-choice-3{right:0 !important;top:21% !important}
    .lonav-choice-4{left:0 !important;top:42% !important}
    .lonav-choice-5{right:0 !important;top:42% !important}
    .lonav-choice-6{left:0 !important;top:63% !important}
    .lonav-choice-7{right:0 !important;top:63% !important}
    .lonav-choice-8{left:0 !important;top:84% !important}
    .lonav-choice-9{right:0 !important;top:84% !important}

    .lonav .lonav-pointer::before{
        width:8px !important;
        height:88px !important;
        left:-4px !important;
        background:linear-gradient(to right,#8c5c0a 0%,#ffe28a 48%,#a66e0c 100%) !important;
        filter:drop-shadow(0 1px 2px rgba(0,0,0,.42)) !important;
    }
    .lonav .lonav-pointer::after{
        width:18px !important;
        height:18px !important;
        left:-9px !important;
        top:-9px !important;
    }
}

@container (max-width:480px){
    .lonav-stage{
        height:720px !important;
        display:block !important;
        padding-top:0 !important;
    }
    .lonav-compass{
        top:50% !important;
        width:min(270px,76vw) !important;
    }
    .lonav-choice{
        width:145px !important;
        min-width:145px !important;
        max-width:145px !important;
        min-height:58px !important;
        height:58px !important;
        font-size:11px !important;
    }
    .lonav-choice-0{left:0 !important;top:0 !important}
    .lonav-choice-1{right:0 !important;top:0 !important}
    .lonav-choice-2{left:0 !important;top:18% !important}
    .lonav-choice-3{right:0 !important;top:18% !important}
    .lonav-choice-4{left:0 !important;top:36% !important}
    .lonav-choice-5{right:0 !important;top:36% !important}
    .lonav-choice-6{left:0 !important;top:64% !important}
    .lonav-choice-7{right:0 !important;top:64% !important}
    .lonav-choice-8{left:0 !important;top:82% !important}
    .lonav-choice-9{right:0 !important;top:82% !important}
}

/* Very narrow phones: cards remain readable; needle still points using live geometry. */
@container (max-width:350px){
    .lonav-stage{height:760px !important}
    .lonav-compass{width:min(235px,72vw) !important}
    .lonav-choice{
        width:132px !important;
        min-width:132px !important;
        max-width:132px !important;
        font-size:10.5px !important;
    }
}


/* 2.1.9 — MOBILE: heading -> compass -> cards */
@container (max-width:720px) {
    .lonav-stage {
        height:auto !important;
        min-height:0 !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        gap:22px !important;
        padding:8px 14px 20px !important;
        overflow:visible !important;
    }

    .lonav-compass {
        position:relative !important;
        left:auto !important;
        top:auto !important;
        right:auto !important;
        bottom:auto !important;
        transform:none !important;
        order:1 !important;
        width:min(300px, 78vw) !important;
        margin:0 auto 4px !important;
        flex:0 0 auto !important;
    }

    .lonav-choices {
        position:relative !important;
        inset:auto !important;
        order:2 !important;
        width:100% !important;
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        gap:12px !important;
    }

    .lonav-choice,
    .lonav-choice-0,.lonav-choice-1,.lonav-choice-2,.lonav-choice-3,.lonav-choice-4,
    .lonav-choice-5,.lonav-choice-6,.lonav-choice-7,.lonav-choice-8,.lonav-choice-9 {
        position:relative !important;
        left:auto !important;
        right:auto !important;
        top:auto !important;
        bottom:auto !important;
        width:100% !important;
        min-width:0 !important;
        max-width:none !important;
        min-height:68px !important;
        height:auto !important;
        margin:0 !important;
        padding:12px 16px !important;
        font-size:14px !important;
    }

    /* Keep the single gold pointer clearly visible on mobile. */
    .lonav .lonav-pointer::before {
        height:92px !important;
        width:8px !important;
        left:-4px !important;
    }
}

@container (max-width:480px) {
    .lonav-stage {
        height:auto !important;
        gap:18px !important;
        padding:6px 12px 18px !important;
    }
    .lonav-compass {
        top:auto !important;
        width:min(280px, 80vw) !important;
    }
    .lonav-choice,
    .lonav-choice-0,.lonav-choice-1,.lonav-choice-2,.lonav-choice-3,.lonav-choice-4,
    .lonav-choice-5,.lonav-choice-6,.lonav-choice-7,.lonav-choice-8,.lonav-choice-9 {
        width:100% !important;
        min-width:0 !important;
        max-width:none !important;
        min-height:64px !important;
        height:auto !important;
        font-size:14px !important;
    }
}