/* /dns/ cursor: a query walking the delegation (js/dns-cursor.js).
 *
 * The head is the query; behind it the path a resolver walks to answer it:
 * name server, zone, top-level domain, root. The root is amber, the colour the
 * page gives DNSSEC, because the chain of trust starts there; the server is
 * violet, the colour of what is post-quantum, because that is where the
 * encrypted transports end.
 */

/* Nothing applies until the script sets .dn-cursor-on: if it fails to load,
 * the native pointer stays rather than vanishing with no replacement. */
.dn-cursor-on,
.dn-cursor-on a,
.dn-cursor-on button,
.dn-cursor-on summary,
.dn-cursor-on code,
.dn-cursor-on input,
.dn-cursor-on select,
.dn-cursor-on textarea {
    cursor: none;
}

.dn-cursor-layer {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 9999;
    pointer-events: none;
    overflow: visible;
}

.dn-cursor-hex {
    fill: rgba(6, 10, 18, 0.55);
    stroke: #5eead4;
    stroke-width: 1.6;
    transition:
        fill 0.12s ease-out,
        stroke 0.12s ease-out;
}
.dn-cursor-core {
    fill: #5eead4;
}
.dn-cursor-head {
    filter: drop-shadow(0 0 4px rgba(94, 234, 212, 0.55));
}

/* Answered, with authority: the hexagon fills. */
.dn-cursor-answered .dn-cursor-hex {
    fill: rgba(196, 181, 253, 0.35);
    stroke: #c4b5fd;
}
.dn-cursor-answered .dn-cursor-core {
    fill: #f1f5f9;
}
.dn-cursor-answered {
    filter: drop-shadow(0 0 7px rgba(196, 181, 253, 0.8));
}

.dn-cursor-chain {
    fill: none;
    stroke: rgba(94, 234, 212, 0.45);
    stroke-width: 1.2;
}
.dn-cursor-node {
    stroke-width: 1.2;
}
.dn-cursor-node-ns {
    fill: rgba(196, 181, 253, 0.85);
    stroke: #c4b5fd;
}
.dn-cursor-node-zone,
.dn-cursor-node-tld {
    fill: rgba(94, 234, 212, 0.6);
    stroke: #5eead4;
}
.dn-cursor-node-root {
    fill: rgba(251, 191, 36, 0.7);
    stroke: #fbbf24;
}

.dn-cursor-ring {
    fill: none;
    stroke: #5eead4;
    stroke-width: 1.4;
}
.dn-cursor-ring-sign {
    stroke: #fbbf24;
}
