#view-viya.page-view{max-width:none;width:100%;margin:0;padding:20px 16px 24px}
#view-viya .view-note{display:none}

.viya-graph-root{position:relative;display:flex;flex-direction:column;gap:0;
    height:calc(100vh - 280px);min-height:480px;
    background:var(--bg-panel);border:1px solid var(--line);border-radius:10px;
    overflow:hidden}
html.newsletter-hidden .viya-graph-root{height:calc(100vh - 150px)}

.viya-graph-viewport:focus{outline:none}
.viya-graph-svgwrap :focus,.viya-graph-svgwrap :focus-visible{outline:none}

.viya-graph-viewport{position:relative;flex:1;min-height:0;overflow:hidden;
    background:#232527;touch-action:none;cursor:grab;user-select:none;-webkit-user-select:none;
    transition:background-color .3s ease}

.viya-graph-root.has-selection .viya-graph-viewport{background-color:#111213}
.viya-graph-viewport.panning{cursor:grabbing}
.viya-graph-world{position:absolute;left:0;top:0;width:1846.57px;height:1038.7px;
    transform-origin:0 0}
.viya-graph-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;
    display:block;pointer-events:none;transition:filter .3s ease}
.viya-graph-root.has-selection .viya-graph-bg{filter:brightness(.5)}
.viya-graph-svgwrap{position:absolute;inset:0;width:100%;height:100%}
.viya-graph-svgwrap svg{width:100%;height:100%;display:block}

.viya-graph-svgwrap svg text{font-family:"Chakra Petch",system-ui,"Segoe UI",Roboto,Arial,sans-serif!important}

.viya-graph-svgwrap svg #g1 > g{transition:opacity .25s ease,filter .25s ease}
.viya-graph-svgwrap svg #g1 > g.vg-dim{opacity:.14;filter:saturate(.15)}
.viya-graph-svgwrap svg #g1 > g.vg-active{opacity:1;filter:saturate(1.15)
    drop-shadow(0 0 2px rgba(35,255,5,.9)) drop-shadow(0 0 3px #fff)}
.viya-graph-svgwrap svg g.vg-dim{opacity:.12;filter:saturate(.15)}
.viya-graph-svgwrap svg g.vg-active{opacity:1;filter:saturate(1.15)
    drop-shadow(0 0 2px rgba(255,255,255,.9)) drop-shadow(0 0 3px #fff)}

.viya-graph-svgwrap svg g.vg-link{opacity:1;filter:saturate(1.1)
    drop-shadow(0 0 6px rgba(35,255,5,.7))}
.viya-graph-svgwrap svg g{transition:opacity .25s ease,filter .25s ease}

.viya-graph-svgwrap svg #g1 > g{cursor:pointer}

.viya-graph-side{position:absolute;top:12px;left:12px;z-index:20;
    width:min(400px,calc(100% - 24px));display:flex;flex-direction:column;gap:10px}
.viya-graph-hint{background:var(--bg-panel);border:1px solid var(--line);border-radius:10px;
    box-shadow:0 18px 50px rgba(0,0,0,.55);
    padding:14px 16px;font-size:var(--fs-sm);line-height:1.45}
.viya-graph-hint p{margin:0 0 10px}
.viya-graph-actions{display:flex;justify-content:space-between;gap:10px}
.viya-wire-panel{background:var(--bg-panel);border:1px solid var(--line);border-radius:10px;
    box-shadow:0 18px 50px rgba(0,0,0,.55);
    padding:14px 16px;font-size:var(--fs-sm);line-height:1.5}
.viya-wire-panel[hidden]{display:none}
.viya-wire-panel h3{margin:0 0 4px;font-size:var(--fs-md);font-weight:700}
.viya-wire-panel .viya-wire-sub{margin:0 0 6px;color:var(--text-dim);font-size:var(--fs-sm)}
.viya-wire-panel p{margin:0 0 8px}
.viya-wire-panel p:last-of-type{margin-bottom:10px}

.viya-callout-layer{position:absolute;inset:0;z-index:15;pointer-events:none}

.viya-inline-label{position:absolute;left:0;top:0;max-width:320px;pointer-events:none;
    transform:translate(-50%,-50%);text-align:center;color:#000}
.viya-inline-head{display:block;font-size:var(--fs-md);line-height:1.3}
.viya-inline-head strong{font-weight:700}
.viya-inline-label span{display:block;font-size:var(--fs-sm);line-height:1.2}

.viya-graph-intro{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;
    padding:20px;background:rgba(0,0,0,.25);
    opacity:1;transition:opacity .3s ease}
.viya-graph-intro[hidden]{display:none}
.viya-graph-intro.fading{opacity:0}
.viya-graph-intro-card{width:min(440px,calc(100vw - 32px));background:var(--bg-panel);
    border:1px solid var(--line);border-radius:10px;padding:22px 24px;
    font-size:var(--fs-md);line-height:1.55;box-shadow:0 18px 50px rgba(0,0,0,.55)}
.viya-graph-intro-card p{margin:0 0 12px}
.viya-graph-intro-card p:last-of-type{margin-bottom:14px}
.viya-graph-intro-card .viya-intro-actions{display:flex;justify-content:center}

html.viya-active body{padding-bottom:14px}
html.viya-active #view-viya.page-view{padding-bottom:0}
html.viya-active #newsletter-footer{transform:translateY(110%);opacity:0;visibility:hidden;transition:transform .35s ease,opacity .3s ease,visibility 0s .35s}
html.viya-active #newsletter-show-tab{transform:translateY(110%);opacity:0;visibility:hidden;transition:transform .35s,opacity .3s ease,visibility 0s .35s}

@media (max-width:1023.98px),(orientation:portrait){
    #view-viya.page-view{padding:14px 10px 18px}
    .viya-graph-root{height:calc(100vh - 340px);min-height:420px}
    html.newsletter-hidden .viya-graph-root{height:calc(100vh - 190px)}
    .viya-graph-hint{font-size:var(--fs-sm);padding:8px 10px}
    .viya-wire-panel{font-size:var(--fs-sm);padding:8px 10px}
}

@media (prefers-reduced-motion:reduce){
    .viya-graph-world{transition:none!important}
    .viya-graph-bg{transition:none}
    .viya-graph-viewport{transition:none}
    .viya-graph-intro{transition:none}
    .viya-graph-svgwrap svg #g1 > g,.viya-graph-svgwrap svg g{transition:none}
}

@media (max-width:659.98px),(max-width:1023.98px) and (max-height:500px) and (orientation:landscape){
    .viya-wire-panel{display:none}
    .viya-graph-root{min-height:300px}
    .viya-graph-hint{padding:6px 8px}
}