/* Shared MariaStacks mood presentation. Domain coordinates and colors stay with their owners. */
.ms-mood-visual-system {
    --ms-visual-dot-size: 10px;
    --ms-visual-halo-size: 54px;
    --ms-visual-pole-size: clamp(.65rem,1.3vw,1.15rem);
    --ms-visual-label-size: .76rem;
    --ms-visual-line-height: 1.25;
    --ms-visual-pole-opacity: .72;
    --ms-visual-aura-opacity: .50;
}
.ms-mood-visual-system .ms-visual-map {
    position: relative;
    width: min(100%, var(--ms-visual-size, 540px));
    margin: 0 auto;
    padding: var(--ms-visual-gutter-y, 40px) var(--ms-visual-gutter-x, 58px);
    box-sizing: border-box;
    overflow: visible;
}
.ms-mood-visual-system .ms-visual-plot {position:relative;width:100%;aspect-ratio:1;overflow:visible;}
.ms-mood-visual-system .ms-visual-grid {position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:3;pointer-events:none;}
.ms-mood-visual-system .ms-visual-ring,
.ms-mood-visual-system .ms-visual-axis {fill:none;stroke:currentColor;stroke-width:.34;stroke-opacity:.13;vector-effect:non-scaling-stroke;}
.ms-mood-visual-system .ms-visual-ring:nth-child(1) {stroke-opacity:.09;}
.ms-mood-visual-system .ms-visual-ring:nth-child(2) {stroke-opacity:.11;}
.ms-mood-visual-system .ms-visual-ring:nth-child(3) {stroke-opacity:.14;}
.ms-mood-visual-system .ms-visual-axis {stroke-opacity:.42;stroke-width:.44;}
.ms-mood-visual-system .ms-visual-arrow {fill:currentColor;fill-opacity:.78;}
.ms-mood-visual-system .ms-visual-pole {
    color:inherit;fill:currentColor;font-family:'Inter',sans-serif;
    font-size:var(--ms-visual-pole-size);font-weight:400;letter-spacing:0;
    line-height:var(--ms-visual-line-height);opacity:var(--ms-visual-pole-opacity);pointer-events:none;
}
.ms-mood-visual-system .ms-visual-pole--svg {font-size:4.4px;}
.ms-mood-visual-system .ms-visual-label {font-size:var(--ms-visual-label-size);font-weight:500;line-height:var(--ms-visual-line-height);letter-spacing:0;}
/* Shared atmospheric field mechanics; each consumer supplies its own semantic gradient. */
.ms-mood-visual-system .ms-visual-field {
    position:absolute;inset:var(--ms-visual-field-inset,0);z-index:0;border-radius:50%;
    filter:blur(var(--ms-visual-field-blur,18px)) saturate(var(--ms-visual-field-saturation,.80)) contrast(var(--ms-visual-field-contrast,.92));
    transform:scale(var(--ms-visual-field-scale,1.03));opacity:var(--ms-visual-field-opacity,.95);pointer-events:none;
}
/* One gradient SVG per plot. Radial alpha stops provide diffusion without per-point blur surfaces. */
.ms-mood-visual-system .ms-visual-auras {position:absolute;inset:0;width:100%;height:100%;z-index:1;overflow:visible;opacity:var(--ms-visual-aura-opacity);pointer-events:none;}
.ms-mood-visual-system .ms-visual-marker {
    position:absolute;transform:translate(-50%,-50%);border:0;border-radius:50%;background:transparent;
    color:inherit;z-index:5;overflow:visible;
}
.ms-mood-visual-system .ms-visual-marker::before,
.ms-mood-visual-system .ms-visual-marker::after {content:'';color:var(--ms-visual-color,currentColor);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;}
.ms-mood-visual-system .ms-visual-marker::before {
    width:var(--ms-visual-halo-size);height:var(--ms-visual-halo-size);
    background:radial-gradient(circle,currentColor 0%,color-mix(in srgb,currentColor 32%,transparent) 28%,transparent 70%);
    opacity:var(--ms-visual-halo-opacity,.44);
}
.ms-mood-visual-system .ms-visual-marker::after {width:var(--ms-visual-dot-size);height:var(--ms-visual-dot-size);background:currentColor;box-shadow:0 3px 16px rgba(0,0,0,.46);}
.ms-mood-visual-system .ms-visual-marker.is-seasonal-primary {--ms-visual-dot-size:12px;--ms-visual-halo-size:76px;--ms-visual-halo-opacity:.72;}
.ms-mood-visual-system .ms-visual-marker.is-seasonal-secondary {--ms-visual-dot-size:11px;--ms-visual-halo-size:64px;--ms-visual-halo-opacity:.56;}
.ms-mood-visual-system .ms-visual-marker[aria-pressed="true"] {--ms-visual-halo-opacity:.80;}
.ms-mood-visual-system .ms-visual-marker:focus-visible {outline:2px solid currentColor;outline-offset:3px;}
.ms-mood-visual-system .ms-visual-marker::before {transition:opacity .2s ease;}
@media(prefers-reduced-motion:reduce) {
    .ms-mood-visual-system .ms-visual-marker::before {transition:none;animation:none;}
    .ms-mood-visual-system .ms-visual-auras {animation:none;}
}
.ms-mood-visual-system .mstax-mood-field-mask {
    position: absolute;
    inset: 0;
    overflow: visible;
    border-radius: 50%;
    background: transparent;
    -webkit-mask-image: none;
    mask-image: none;
}

.ms-mood-visual-system .mstax-mood-field {
    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(8,8,8,0.60) 0%,
            rgba(8,8,8,0.32) 18%,
            rgba(8,8,8,0.10) 38%,
            rgba(8,8,8,0) 62%
        ),
        var(--mstax-mood-gradient);
}

/*
 * The edge veil creates the visible fade into the card background. Because it
 * is an overlay rather than a mask, the circle does not end on a hard contour.
 */
.ms-mood-visual-system .mstax-mood-field-vignette {
    position: absolute;
    inset: -2%;
    z-index: 2;
    border-radius: 50%;
    background: radial-gradient(
        circle at 50% 50%,
        rgba(17,18,20,0.18) 0%,
        rgba(17,18,20,0.06) 50%,
        rgba(17,18,20,0.16) 68%,
        rgba(17,18,20,0.42) 80%,
        rgba(17,18,20,0.76) 91%,
        #111214 100%
    );
    pointer-events: none;
}