/* Persistent.id Data Assets: an explorable map in the persistent.id product-band style.
   Fragments, glyphs, tags, the hub and the rings are copied from persistent-web/styles.css. */
:root{
  --bg:#000a36; --text-1:#f7f8f8; --text-2:#a6b0c4; --text-3:#76829c; --blue:#4d8dff; --eyebrow:#9fc0ff;
  --font:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --rings:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1400 1400' fill='none' stroke='%23a6c4ff' stroke-opacity='.07'%3E%3Ccircle cx='700' cy='700' r='140'/%3E%3Ccircle cx='700' cy='700' r='196'/%3E%3Ccircle cx='700' cy='700' r='252'/%3E%3Ccircle cx='700' cy='700' r='308'/%3E%3Ccircle cx='700' cy='700' r='364'/%3E%3Ccircle cx='700' cy='700' r='420'/%3E%3Ccircle cx='700' cy='700' r='476'/%3E%3Ccircle cx='700' cy='700' r='532'/%3E%3Ccircle cx='700' cy='700' r='588'/%3E%3Ccircle cx='700' cy='700' r='644'/%3E%3C/svg%3E");
}
*,*::before,*::after{box-sizing:border-box;}
html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--text-1);font-family:var(--font);-webkit-font-smoothing:antialiased;overscroll-behavior:none;}
button{font:inherit;color:inherit;background:none;border:0;padding:0;margin:0;cursor:pointer;text-align:inherit;}
b,i,em{font-style:normal;}
p{margin:0;}

/* ------------------------------------------------ loader: the logo writes itself out */
.loader{position:fixed;inset:0;z-index:100;display:grid;place-items:center;background:var(--bg);transition:opacity .6s ease,visibility .6s;}
.loader svg{width:min(432px,86vw);height:auto;overflow:visible;}
.loader .s{fill:none;stroke:var(--text-1);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;
  animation:write 1s cubic-bezier(.55,0,.25,1) forwards;animation-delay:calc(var(--i) * 55ms + 150ms);}
.loader .f{fill:var(--text-1);fill-rule:evenodd;opacity:0;animation:inkin .55s ease forwards 1.45s;}
.loader .strokes{animation:inkout .5s ease forwards 1.7s;}
@keyframes write{to{stroke-dashoffset:0;}}
@keyframes inkin{to{opacity:1;}}
@keyframes inkout{to{opacity:0;}}
.loader.done{opacity:0;visibility:hidden;}
/* hand-off: the page shows through while the logo glides into the hero */
.loader{transition:opacity .6s ease,visibility .6s,background-color .9s ease;}
.loader.handoff{background-color:rgba(0,10,54,0);}
.loader svg{transform-origin:50% 50%;}

/* ------------------------------------------------ stage + world */
.stage{position:fixed;inset:0;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;
  background-color:var(--bg);
  background-image:radial-gradient(circle,rgba(166,196,255,.06) 1.2px,transparent 1.8px);
  background-size:calc(var(--gs,48)*1px) calc(var(--gs,48)*1px);background-position:calc(var(--gx,0)*1px) calc(var(--gy,0)*1px);}

.world{position:absolute;left:0;top:0;width:0;height:0;transform-origin:0 0;}
.edges{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;z-index:1;}
.loading .node,.loading .edge{animation-play-state:paused!important;}

/* ------------------------------------------------ trails (as the product band draws them) */
.edge .base{fill:none;stroke:url(#edgeFade);stroke-width:3.2;stroke-linecap:round;transition:opacity .3s;}
.edge .flow{fill:none;stroke:url(#pulseFade);stroke-width:3.5;stroke-linecap:round;stroke-dasharray:26 520;animation:flow 4.5s linear infinite;animation-delay:var(--d,0s);transition:opacity .3s;}
.edge .tick{fill:none;stroke:#9fc0ff;stroke-width:3;stroke-linecap:round;opacity:.85;transition:opacity .3s;}
@keyframes flow{to{stroke-dashoffset:-546;}}
.has-sel .edge:not(.hot) .base,.has-sel .edge:not(.hot) .flow,.has-sel .edge:not(.hot) .tick{opacity:.25;}

/* ------------------------------------------------ nodes */
.node{position:absolute;left:calc(var(--x)*1px);top:calc(var(--y)*1px);z-index:3;transition:opacity .35s;}
.asset{width:420px;transform:translateX(-50%);animation:rise .9s cubic-bezier(.16,1,.3,1) backwards;animation-delay:var(--d,0s);}
@keyframes rise{from{opacity:0;transform:translate(-50%,22px);}to{opacity:1;transform:translate(-50%,0);}}
.has-sel .node{opacity:.3;}
.has-sel .node.sel{opacity:1;z-index:10;}
.sel-asset .node:not(.sel){opacity:0;pointer-events:none;}
.sel-out .out:not(.sel){opacity:0;pointer-events:none;}
.sel-asset .edge .base,.sel-asset .edge .flow,.sel-asset .edge .tick{opacity:.08!important;}

.nh{display:flex;flex-direction:column;align-items:center;width:100%;text-align:center;}
.nh:focus-visible .bigicon,.core:focus-visible{outline:2px solid #a6c4ff;outline-offset:6px;}
.bigicon{display:grid;place-items:center;width:72px;height:72px;border-radius:22px;background:var(--blue);color:#fff;box-shadow:0 18px 34px -14px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.25);transition:transform .3s cubic-bezier(.16,1,.3,1);}
.bigicon svg{width:36px;height:36px;stroke-width:1.7;}
.asset:hover .bigicon{transform:translateY(-3px);}
.eyebrow{margin-top:20px;font-size:15px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.what{margin-top:10px;font-size:38px;line-height:1.1;font-weight:600;letter-spacing:-.025em;color:var(--text-1);}

/* fragment panels */
.frag{position:relative;padding:6px;border-radius:14px;background:#0b1135;box-shadow:0 0 0 1px rgba(255,255,255,.07),inset 0 1px 0 rgba(255,255,255,.05);}
.frag__head{display:flex;align-items:center;height:46px;padding:0 16px 0 18px;font-size:16px;color:var(--text-3);}
.frag__row{display:flex;align-items:center;gap:12px;height:54px;padding:0 16px;border-radius:10px;font-size:16px;color:var(--text-1);}
.frag__row--active{background:rgba(20,41,85,.98);box-shadow:0 0 0 1px rgba(255,255,255,.06),0 18px 34px -14px rgba(0,0,0,.85);}
.frag__row--dim2{opacity:.55;}
.frag__glyph{flex:none;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.08);color:var(--text-1);display:grid;place-items:center;}
.frag__glyph svg{width:16px;height:16px;}
.frag__name{white-space:nowrap;}
.frag__tag{font-size:12px;line-height:1;padding:5px 7px;border-radius:6px;color:var(--text-3);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1);white-space:nowrap;}
.frag__check{margin-left:auto;color:var(--text-1);flex:none;}
.cb{flex:none;width:18px;height:18px;border-radius:5px;display:grid;place-items:center;background:var(--blue);}

.art{position:relative;height:270px;margin-top:30px;perspective:1100px;perspective-origin:50% 0;cursor:pointer;}
/* hover: the panel brightens and a soft light comes up behind it */
.art::before{content:"";position:absolute;left:-14%;right:-14%;top:-18%;height:120%;border-radius:50%;background:radial-gradient(closest-side,rgba(77,141,255,.34),rgba(77,141,255,.10) 55%,rgba(77,141,255,0));opacity:0;transition:opacity .5s ease;pointer-events:none;}
.asset:hover .art::before,.asset:focus-within .art::before{opacity:1;}
.art .sfrag{opacity:.86;}
.asset:hover .art .sfrag,.asset:focus-within .art .sfrag{opacity:1;background:#101a4c;box-shadow:0 0 0 1px rgba(160,196,255,.22),inset 0 1px 0 rgba(255,255,255,.08),0 30px 60px -30px rgba(0,0,0,.9);}
.art .sfrag{text-align:left;transform-origin:50% 0;transform:rotateX(18deg);transition:transform .7s cubic-bezier(.16,1,.3,1),opacity .45s ease,background .45s ease,box-shadow .45s ease;
  -webkit-mask-image:linear-gradient(to bottom,#000 76%,transparent 100%);mask-image:linear-gradient(to bottom,#000 76%,transparent 100%);}
.a0 .art .sfrag{transform:rotateX(18deg) rotateY(10deg);}
.a2 .art .sfrag{transform:rotateX(18deg) rotateY(-10deg);}
.asset:hover .art .sfrag{transform:rotateX(12deg);}
.asset.sel .art{display:none;}

/* the detail that opens under the fragment */
.more{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:0fr;transition:grid-template-rows .55s cubic-bezier(.16,1,.3,1);}
.more>div{min-width:0;min-height:0;overflow-x:visible;overflow-y:clip;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s;}
.node.sel .more{grid-template-rows:1fr;}
.node.sel .more>div{opacity:1;visibility:visible;}
.panel{margin-top:14px;padding:22px 22px 24px;border-radius:14px;background:#0b1135;box-shadow:0 0 0 1px rgba(255,255,255,.07),inset 0 1px 0 rgba(255,255,255,.05);text-align:left;}
.figs{display:grid;gap:18px;}
.figs.n2{grid-template-columns:1fr 1fr;}
.fig .v{font-size:56px;line-height:58px;font-weight:700;letter-spacing:-.045em;color:var(--blue);font-variant-numeric:tabular-nums;}
.fig .k{margin-top:10px;font-size:13px;line-height:18px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.fig .d{margin-top:6px;font-size:16px;line-height:24px;color:var(--text-2);}
.fig .d b{font-weight:600;color:var(--text-1);}
.vend{display:flex;flex-direction:column;gap:14px;margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.07);}
.vrow{display:flex;align-items:center;gap:14px;}
.vrow b{display:block;font-size:17px;line-height:23px;font-weight:600;}
.vrow span:not(.frag__glyph){display:block;margin-top:2px;font-size:16px;line-height:22px;color:var(--text-2);}
.chain{margin-top:22px;padding-top:20px;border-top:1px solid rgba(255,255,255,.07);}
.chain .t{font-size:13px;line-height:18px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.chain .p{margin-top:8px;font-size:18px;line-height:26px;font-weight:600;}
.chk{list-style:none;padding:20px 0 0;margin:22px 0 0;border-top:1px solid rgba(255,255,255,.07);display:flex;flex-direction:column;gap:12px;}
.chk li{display:flex;align-items:center;gap:12px;font-size:16px;line-height:22px;}

/* ------------------------------------------------ hero */
.hero{width:1200px;transform:translateX(-50%);text-align:center;}
.pill{display:inline-flex;align-items:center;height:32px;padding:0 15px;border-radius:9999px;background:var(--text-1);color:var(--bg);font-size:15px;font-weight:500;}
/* the full wordmark, the same traced outline the loader draws, so the loader can land on it exactly */
.hero__logo{display:block;width:320px;height:auto;margin:0 auto;fill:var(--text-1);fill-rule:evenodd;overflow:visible;}
.hero h1{margin:30px auto 0;max-width:1100px;font-size:68px;line-height:1.08;font-weight:500;letter-spacing:-.03em;color:var(--text-1);text-wrap:balance;}
.hero p{margin:24px auto 0;max-width:620px;font-size:19px;line-height:1.55;color:var(--text-2);text-wrap:balance;}
.hero__cta{display:inline-flex;align-items:center;gap:10px;height:48px;margin-top:34px;padding:0 22px;border-radius:12px;background:var(--text-1);color:var(--bg);font-size:16px;font-weight:500;text-decoration:none;transition:background .15s,transform .15s;}
.hero__cta:hover{background:#e3e8f1;}
.hero__cta svg{transition:transform .15s;}
.hero__cta:hover svg{transform:translateX(3px);}
.hero__cta:focus-visible{outline:2px solid #a6c4ff;outline-offset:3px;}
.has-sel .hero{opacity:.08;}

/* ------------------------------------------------ card graphics */
/* PII Graph: a record */
.rec{padding:8px 6px 8px;}
.rec__id{display:flex;align-items:center;gap:10px;padding:12px 10px;border-radius:10px;background:rgba(20,41,85,.98);box-shadow:0 0 0 1px rgba(255,255,255,.06),0 18px 34px -14px rgba(0,0,0,.85);}
.rec__avatar{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff;}
.rec__avatar svg{width:20px;height:20px;}
.rec__who{min-width:0;flex:1;}
.rec__who b{display:block;font-size:17px;font-weight:500;color:var(--text-1);white-space:nowrap;}
.rec__who span{display:block;margin-top:3px;font-size:15px;color:var(--text-3);white-space:nowrap;}
.frag__tag--ok{color:#8ff0c0;box-shadow:inset 0 0 0 1px rgba(143,240,192,.35);}
/* the headline number on the record: big white figure, caption under it */
.rec__big{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:6px;}
.rec__big b{display:block;color:var(--text-1);font-size:38px;line-height:1;font-weight:700;letter-spacing:-.035em;font-variant-numeric:tabular-nums;}
.rec__big span{font-size:15px;line-height:1;color:var(--text-2);white-space:nowrap;}
.rec__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px;}
.rtile{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:12px;border-radius:10px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.05);font-size:15px;line-height:1.25;color:var(--text-1);}
.rec__avatar img,.nhub img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;}
.rec__avatar{overflow:hidden;background:#142955;box-shadow:0 0 0 2px rgba(159,192,255,.35);}
.nhub{overflow:hidden;}
/* the big figures at the top of the Linkage and Signal panels, matching the 289M+ on the record */
.fstats{display:flex;gap:34px;padding:16px 16px 6px;}
.fstats--c{justify-content:center;gap:56px;padding-top:20px;text-align:center;}
.fstat b{display:block;font-size:42px;line-height:1;font-weight:700;letter-spacing:-.035em;color:var(--text-1);font-variant-numeric:tabular-nums;}
.fstat span{display:block;margin-top:8px;font-size:16px;line-height:1.2;color:var(--text-2);}
/* figures built into each graphic */
.recfig{display:flex!important;align-items:baseline;gap:12px;font-size:34px!important;line-height:1;font-weight:700!important;letter-spacing:-.035em;color:var(--text-1);white-space:nowrap;}
.rec__who .recfig span{display:inline!important;margin:0 0 0 2px!important;font-size:15px!important;font-weight:500;letter-spacing:0;color:var(--text-2)!important;margin:0!important;}
.rec__who>span{white-space:nowrap!important;margin-top:6px!important;line-height:1.35;font-size:14px!important;letter-spacing:-.01em;}
.nfig{font-style:normal;font-size:19px;font-weight:700;letter-spacing:-.02em;color:var(--text-1);margin-left:2px;}
.act__bars{position:relative;}
.act__fig{position:absolute;left:4px;top:2px;}
.act__fig b{display:block;font-size:40px;line-height:1;font-weight:700;letter-spacing:-.04em;color:var(--text-1);}
.act__fig span{display:block;margin-top:6px;font-size:15px;color:var(--text-2);}
/* Identity Linkage: a network */
.net{position:relative;margin:16px auto 6px;}
.net>svg{position:absolute;left:0;top:0;overflow:visible;}
.nl{fill:none;stroke:rgba(255,255,255,.18);stroke-width:1.5;}
.nl--on{stroke:#9fc0ff;stroke-width:2;}
.nhub{position:absolute;transform:translate(-50%,-50%);width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:rgba(20,41,85,.98);box-shadow:0 0 0 2px rgba(159,192,255,.8),0 0 0 10px rgba(77,141,255,.12);color:#fff;}
.nhub svg{width:24px;height:24px;}
.nchip{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;gap:9px;height:44px;padding:0 14px 0 5px;border-radius:999px;background:#121c4f;box-shadow:0 0 0 1px rgba(255,255,255,.1);white-space:nowrap;}
.nchip b{font-size:16px;font-weight:500;color:var(--text-1);}
.nchip .frag__glyph{width:34px;height:34px;}
.nchip .frag__glyph svg{width:18px;height:18px;}
.nchip--on{background:rgba(20,41,85,.98);box-shadow:0 0 0 1px rgba(159,192,255,.6);}
.nchip--on .frag__glyph{background:var(--blue);color:#fff;}
/* Signal Network: activity */
.act{padding:10px 10px 10px;}
.act__bars{display:flex;align-items:flex-end;gap:5px;height:132px;margin-top:16px;padding:0 4px 8px;border-bottom:1px solid rgba(255,255,255,.1);}
.act__bars i{flex:1;border-radius:3px 3px 1px 1px;background:rgba(255,255,255,.13);}
.act__bars i.on{background:var(--blue);}
.act__legend{display:grid;grid-template-columns:max-content max-content;justify-content:space-between;gap:10px 14px;margin-top:2px;}
.leg{display:flex;align-items:center;gap:8px;font-size:15px;color:var(--text-1);white-space:nowrap;}
.leg .frag__glyph{width:32px;height:32px;}
.leg .frag__glyph svg{width:17px;height:17px;}

/* ------------------------------------------------ focused view: the persistent.id graph diagram (inputs, the asset, what it delivers) */
.focus{position:absolute;left:50%;top:calc(100% + 40px);width:1320px;transform:translateX(-50%);display:grid;grid-template-columns:350px 1fr 350px;align-items:center;text-align:left;cursor:default;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,visibility .35s;}
.asset.sel .focus{opacity:1;visibility:visible;pointer-events:auto;}
.flinks{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;}
.flinks .b{fill:none;stroke:rgba(159,192,255,.34);stroke-width:2;stroke-dasharray:1 1;stroke-dashoffset:1;animation:write .9s cubic-bezier(.55,0,.25,1) .35s forwards;}
.flinks .p{fill:none;stroke:rgba(160,196,255,.9);stroke-width:1.8;stroke-linecap:round;stroke-dasharray:26 520;animation:flow 4.5s linear 1.2s infinite;}
.gcol{position:relative;z-index:1;display:flex;flex-direction:column;gap:10px;}
.gcol--mid{align-items:center;justify-content:center;padding:8px 36px;}
/* rows in the opened views: no boxes, line icons, larger type (same as the outcome lists) */
.gnode{display:flex;align-items:center;gap:18px;padding:12px 6px;
  opacity:0;transform:translateX(-18px);transition:opacity .45s ease,transform .6s cubic-bezier(.16,1,.3,1);}
.gnode--out{transform:translateX(18px);}
.gnode .frag__glyph{width:32px;height:32px;border-radius:0;background:none;color:#9fc0ff;}
.gnode .frag__glyph svg{width:30px;height:30px;}
.gnode--out .frag__glyph{background:none;color:#9fc0ff;}
.gnode__text{display:flex;flex-direction:column;min-width:0;}
.gnode__label{font-size:21px;line-height:1.3;color:var(--text-1);}
.gnode__fig{margin-right:10px;font-weight:700;color:var(--text-1);}
.gnode__sub{margin-top:3px;font-size:17px;line-height:1.4;color:var(--text-2);}
.gcol .gnode:nth-child(2){--n:1;}.gcol .gnode:nth-child(3){--n:2;}.gcol .gnode:nth-child(4){--n:3;}.gcol .gnode:nth-child(5){--n:4;}
.asset.sel .gnode,.hub.sel .gnode{opacity:1;transform:none;transition-delay:calc(.25s + var(--n,0) * .06s);}
/* the centre of an opened card: its big figure in white, no card around it */
.person{display:flex;flex-direction:column;align-items:center;gap:8px;width:100%;max-width:360px;padding:10px 0;text-align:center;
  opacity:0;transform:scale(.94);transition:opacity .45s ease .1s,transform .6s cubic-bezier(.16,1,.3,1) .1s;}
.asset.sel .person{opacity:1;transform:none;}
.person__icon{display:none;place-items:center;width:64px;height:64px;margin-bottom:8px;border-radius:20px;background:var(--blue);color:#fff;box-shadow:0 12px 24px -12px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.25);}
.person__icon svg{width:32px;height:32px;stroke-width:1.7;}
.person__fig{font-size:72px;line-height:1;font-weight:700;letter-spacing:-.045em;color:var(--text-1);font-variant-numeric:tabular-nums;}
.person__name{font-size:21px;font-weight:500;color:var(--text-1);}
.person__pid{margin-top:2px;font-size:17px;line-height:1.5;color:var(--text-2);text-wrap:balance;}
.person__tag{display:none;margin-top:8px;font-size:13px;color:#8ff0c0;background:rgba(61,214,140,.12);padding:6px 10px;border-radius:9999px;}
@media (max-width:900px){
  .focus{width:420px;grid-template-columns:1fr;}
  .flinks{display:none;}
  .gcol--mid{padding:48px 0 0;}
  .gcol--out{padding-top:48px;}
  .gcol--mid::before,.gcol--out::before{content:"";position:absolute;top:10px;left:50%;width:2px;height:30px;border-radius:1px;background:linear-gradient(to bottom,rgba(160,196,255,0),rgba(160,196,255,.75));}
  .person{max-width:none;}
}

/* ------------------------------------------------ outcomes: cards hanging off the bottom of the circle */
.out{width:360px;transform:translateX(-50%);animation:rise .9s cubic-bezier(.16,1,.3,1) backwards;animation-delay:var(--d,0s);}
/* open grid sections: a hairline across the top, a divider between columns, no boxes */
.ocard{display:flex;flex-direction:column;align-items:center;width:100%;min-height:340px;padding:44px 30px 12px;text-align:center;border-top:1px solid rgba(255,255,255,.1);border-left:1px solid rgba(255,255,255,.08);}
.out[data-id="audiences"] .ocard{border-left:0;}
.ocard{transition:background .3s ease;}
.ocard:hover{background:rgba(255,255,255,.035);}
/* opened: no fill, and the column grows toward the left (its panel stays put on the right) */
.ocard{transform-origin:100% 0;transition:background .3s ease,transform .6s cubic-bezier(.16,1,.3,1);}
.out.sel .ocard,.out.sel .ocard:hover{background:none;transform:scale(1.25);border-color:transparent;}
.ographic{opacity:.85;transition:opacity .3s ease;}
/* focused outcome: its benefits, checked, in a panel under the column */
/* no box: the list floats beside the opened column, centred on it (the column is 340px scaled 1.25, so its middle is 212px down) */
.ofocus{position:absolute;left:calc(100% + 44px);top:212px;width:600px;transform:translate(-12px,-50%);padding:0;text-align:left;cursor:default;
  opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,visibility .35s;}
.out.sel .ofocus{opacity:1;visibility:visible;pointer-events:auto;transform:translate(0,-50%);}
.ofocus{transition:opacity .35s ease,visibility .35s,transform .5s cubic-bezier(.16,1,.3,1);}
.ochecks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;}
.ochecks li{border-radius:10px;transition-property:opacity,transform,background;
  opacity:0;transform:translateY(8px);transition:opacity .4s ease,transform .5s cubic-bezier(.16,1,.3,1);}
.ochecks li.open{background:rgba(20,41,85,.98);box-shadow:0 0 0 1px rgba(255,255,255,.06);}
.ocheck{display:flex;align-items:center;gap:18px;width:100%;min-height:64px;padding:10px 18px;border-radius:12px;font-size:21px;line-height:1.35;color:var(--text-1);text-align:left;transition:background .2s;}
.ocheck:hover{background:rgba(255,255,255,.04);}
.ochecks li.open .ocheck:hover{background:none;}
.ocheck:focus-visible{outline:2px solid #a6c4ff;outline-offset:-2px;}
.ocheck__t{flex:1;min-width:0;}
.ocheck__chev{flex:none;width:11px;height:11px;margin-right:4px;border-right:2px solid var(--text-3);border-bottom:2px solid var(--text-3);transform:rotate(45deg) translateY(-2px);transition:transform .3s;}
.ochecks li.open .ocheck__chev{transform:rotate(-135deg) translateY(-2px);}
.ohow{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s cubic-bezier(.16,1,.3,1);}
.ohow>div{min-height:0;overflow:hidden;}
.ohow p{margin:0;padding:0 22px 18px 68px;font-size:18px;line-height:1.55;color:var(--text-2);}
.ochecks li.open .ohow{grid-template-rows:1fr;}
.oico{flex:none;display:grid;place-items:center;width:32px;height:32px;color:#9fc0ff;}
.oico svg{width:30px;height:30px;}
.ochecks li.open .oico{color:var(--blue);}
.out.sel .ochecks li{opacity:1;transform:none;}
.out.sel .ochecks li:nth-child(1){transition-delay:.15s}.out.sel .ochecks li:nth-child(2){transition-delay:.2s}.out.sel .ochecks li:nth-child(3){transition-delay:.25s}.out.sel .ochecks li:nth-child(4){transition-delay:.3s}.out.sel .ochecks li:nth-child(5){transition-delay:.35s}.out.sel .ochecks li:nth-child(6){transition-delay:.4s}
.ocard:hover .ographic,.out.sel .ographic{opacity:1;}
.ocard:hover .otitle,.out.sel .otitle{color:#cfe0ff;}
.ocard:focus-visible{outline:2px solid #a6c4ff;outline-offset:4px;}
.ographic{display:grid;place-items:center;width:100%;height:156px;}
.og{width:300px;height:152px;overflow:visible;}
.mpulse{display:none;}
@keyframes mflow{from{stroke-dashoffset:0;}to{stroke-dashoffset:-318;}}
.otitle{margin-top:24px;font-size:24px;line-height:1.2;font-weight:600;letter-spacing:-.015em;color:var(--text-1);}
.odesc{margin-top:8px;font-size:16px;line-height:1.45;color:var(--text-2);text-wrap:balance;}
.mfrag{width:280px;padding:5px;border-radius:12px;background:rgba(255,255,255,.035);box-shadow:0 0 0 1px rgba(255,255,255,.07);text-align:left;}
.mrow{display:flex;align-items:center;gap:10px;height:38px;padding:0 10px;border-radius:8px;font-size:15px;color:var(--text-1);}
.mrow:first-child{background:rgba(20,41,85,.98);box-shadow:0 0 0 1px rgba(255,255,255,.06);}
.mrow .frag__glyph{width:26px;height:26px;}
.mrow .frag__glyph svg{width:14px;height:14px;}
.mrow span:not(.frag__glyph){white-space:nowrap;}
.mcheck{margin-left:auto;color:#8ff0c0;flex:none;}
.edge.down .base{stroke:rgba(255,255,255,.16);}
.edge.down .flow{stroke:rgba(160,196,255,.9);}

/* ------------------------------------------------ the hub (as .tie__hub) */
.hub{width:0;height:0;z-index:2;}
.hub>*{position:absolute;left:0;top:0;}
.hub .rings{width:1400px;height:1400px;transform:translate(-50%,-50%);background:var(--rings) center/contain no-repeat;pointer-events:none;transition:opacity .35s;}
.has-sel .hub .rings{opacity:.5;}
.hub .core{display:grid;place-items:center;width:200px;height:200px;border-radius:50%;background:#00031b;box-shadow:0 0 0 2px rgba(159,192,255,.85);transform:translate(-50%,-50%);transition:opacity .3s,transform .4s cubic-bezier(.16,1,.3,1);}
.hub .core::before{content:"";position:absolute;inset:-22px;border-radius:50%;background:rgba(255,255,255,.035);z-index:-1;}
.hub .core::after{content:"";position:absolute;inset:-22px;border-radius:50%;background:rgba(159,192,255,.10);z-index:-1;animation:hubPulse 3.2s ease-out infinite;}
@keyframes hubPulse{0%{transform:scale(.92);opacity:.9;}100%{transform:scale(1.35);opacity:0;}}
.hub .core:hover{transform:translate(-50%,-50%) scale(1.03);}
.hub .core img{display:block;height:88px;width:auto;}
.hublabel{left:162px!important;top:-58px!important;width:380px;pointer-events:none;transition:opacity .3s;}
.hublabel b{display:block;font-size:32px;line-height:1.12;font-weight:600;letter-spacing:-.025em;color:var(--text-1);}
.hublabel span{display:block;margin-top:8px;font-size:17px;line-height:1.5;color:var(--text-2);}
.hub.sel .hublabel{opacity:0;pointer-events:none;}


/* opened graph: header above the circle, the diagram around it, the licence line below; no box */
.gview{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s ease,visibility .4s;}
.hub.sel .gview{opacity:1;visibility:visible;pointer-events:auto;}
.ghead{width:900px;transform:translate(-50%,calc(-100% - 230px));text-align:center;}
.ghead h2{margin:10px 0 0;font-size:44px;line-height:1.1;font-weight:500;letter-spacing:-.025em;color:var(--text-1);}
.ghead p{margin:14px auto 0;max-width:640px;font-size:19px;line-height:1.55;color:var(--text-2);text-wrap:balance;}
.gdiag{width:1320px;transform:translate(-50%,-50%);display:grid;grid-template-columns:360px 1fr 360px;align-items:center;text-align:left;}
.gspace{height:300px;}
.glic{width:760px;transform:translate(-50%,230px);display:flex;flex-direction:column;align-items:center;text-align:center;}
.glic__icon{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:rgba(77,141,255,.18);color:#cfe0ff;}
.glic__icon svg{width:22px;height:22px;}
.glic b{margin-top:14px;font-size:22px;line-height:1.3;font-weight:600;letter-spacing:-.01em;color:var(--text-1);}
.glic span:not(.glic__icon){margin-top:8px;max-width:620px;font-size:17px;line-height:1.55;color:var(--text-2);text-wrap:balance;}
@media (max-width:900px){
  .ghead{width:420px;}
  .ghead h2{font-size:34px;}
  .gdiag{width:420px;grid-template-columns:1fr;row-gap:0;}
  .gspace{display:none;}
  .gdiag .gcol--out{padding-top:24px;}
  .glic{width:420px;}
}

/* ------------------------------------------------ HUD */
.hud{position:fixed;z-index:30;}
.top{left:0;right:0;top:0;display:flex;align-items:center;gap:16px;padding:16px 18px 14px;pointer-events:none;background:rgba(0,10,54,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(255,255,255,.06);}
.top>*{pointer-events:auto;}
.brand{display:flex;align-items:center;gap:14px;height:52px;padding:0 20px 0 18px;border-radius:16px;background:#04113e;box-shadow:0 0 0 1px rgba(255,255,255,.08);color:var(--text-1);text-decoration:none;}
.brand img{height:22px;width:auto;display:block;}
.brand span{font-size:15px;font-weight:500;color:var(--text-2);padding-left:14px;border-left:1px solid rgba(255,255,255,.1);}
.jump{display:flex;gap:6px;height:52px;align-items:center;padding:0 8px;border-radius:16px;background:#04113e;box-shadow:0 0 0 1px rgba(255,255,255,.08);margin:0 auto;overflow-x:auto;scrollbar-width:none;}
.jump::-webkit-scrollbar{display:none;}
.jump button{flex:none;height:36px;padding:0 14px;border-radius:10px;font-size:15px;font-weight:500;color:var(--text-2);transition:background .15s,color .15s;white-space:nowrap;}
.jump button:hover,.jump button.on{background:rgba(255,255,255,.08);color:var(--text-1);}
.zoom{display:flex;height:52px;align-items:center;gap:4px;padding:0 8px;border-radius:16px;background:#04113e;box-shadow:0 0 0 1px rgba(255,255,255,.08);}
.zoom button{height:36px;min-width:36px;padding:0 10px;border-radius:10px;font-size:19px;font-weight:500;color:var(--text-2);text-align:center;transition:background .15s,color .15s;}
.zoom button:hover{background:rgba(255,255,255,.08);color:var(--text-1);}
.zoom [data-zoom="fit"]{font-size:15px;}
.jump button:focus-visible,.zoom button:focus-visible,.brand:focus-visible{outline:2px solid #a6c4ff;outline-offset:2px;}
.hint{left:50%;bottom:22px;transform:translateX(-50%);margin:0;white-space:nowrap;font-size:15px;color:var(--text-3);pointer-events:none;transition:opacity .6s;}
.hint.gone{opacity:0;}
.hint{display:none!important;}

@media (max-width:900px){
  .top{flex-wrap:wrap;gap:8px;padding:12px 12px 0;}
  .brand{height:46px;}
  .zoom{margin-left:auto;height:46px;}
  .jump{order:3;flex:1 0 100%;height:46px;margin:0;}
  .hint{display:none;}
}
@media (max-width:520px){.brand span{display:none;}.brand{padding:0 16px;}}
.top{justify-content:center;}
@media (max-width:900px){
  .ocard{border-left:0;}
  .ofocus{left:50%;top:calc(100% + 24px);width:400px;transform:translateX(-50%);}
  .out.sel .ocard,.out.sel .ocard:hover{transform:none;}
  .out.sel .ofocus{transform:translateX(-50%);}
  .hero{width:420px;}
  .hero h1{font-size:48px;}
  .hero p{font-size:18px;}
  .hublabel{left:0!important;top:146px!important;width:400px;transform:translateX(-50%);text-align:center;}
  .jump{order:0;flex:1 1 0;min-width:0;margin:0;}
  .top{flex-wrap:nowrap;}
}

@media (prefers-reduced-motion:reduce){
  .asset,.edge .flow,.hub .core::after,.loader .s,.loader .f,.loader .strokes{animation:none!important;}
  .loader .s{display:none;}
  .loader .f{opacity:1;}
  .edge .flow{display:none;}
}

/* ================================================ drill-down layers (the z axis)
   Each level pushes the one before it back and brings the next forward. The map behind blurs and dims;
   a depth bar (back, nested-squares meter, breadcrumbs) stays pinned so you always know where you are. */
.stage{transition:filter .6s ease,opacity .6s ease;}
.deep-open .stage{filter:blur(8px);opacity:.3;}
.deep{position:fixed;left:0;right:0;bottom:0;top:82px;z-index:20;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 92px);mask-image:linear-gradient(to bottom,transparent 0,#000 92px);overflow-y:auto;overscroll-behavior:contain;background:rgba(0,10,54,0);visibility:hidden;pointer-events:none;transition:background .5s ease,visibility 0s linear .5s;}
.deep.on{visibility:visible;pointer-events:auto;background:rgba(0,10,54,.9);transition:background .5s ease;}
.dpage{position:absolute;left:0;right:0;top:0;min-height:100%;padding:104px 32px 140px;will-change:transform,opacity;}
.dwrap{max-width:1140px;margin:0 auto;}
.dt{margin:16px 0 0;font-size:58px;line-height:1.05;font-weight:500;letter-spacing:-.032em;color:var(--text-1);outline:none;}
.dt span{color:var(--text-2);}
.dlead{margin:22px 0 0;max-width:740px;font-size:20px;line-height:1.55;color:var(--text-2);}
.dstats{display:flex;flex-wrap:wrap;gap:28px 72px;margin-top:52px;padding-top:34px;border-top:1px solid rgba(255,255,255,.1);}
.dstat b{display:block;font-size:56px;line-height:1;font-weight:700;letter-spacing:-.045em;color:var(--text-1);font-variant-numeric:tabular-nums;}
.dstat span{display:block;margin-top:10px;font-size:16px;color:var(--text-2);}
.dh{margin:76px 0 26px;font-size:15px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.dic{display:grid;place-items:center;width:30px;height:30px;color:#9fc0ff;}
.dic svg{width:28px;height:28px;}
/* columns: no boxes, a hairline on top and between */
.dcols{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));border-top:1px solid rgba(255,255,255,.1);}
.dcol{padding:28px 28px 8px 0;}
.dcol+.dcol{padding-left:28px;border-left:1px solid rgba(255,255,255,.08);}
.dcol b{display:block;margin-top:18px;font-size:21px;line-height:1.25;font-weight:600;letter-spacing:-.01em;color:var(--text-1);}
.dcol p{margin:10px 0 0;font-size:16px;line-height:1.6;color:var(--text-2);}
.dev__h{display:block;margin-top:22px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);}
.dev{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:8px;}
.dev li{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--text-1);}
.dev__c{display:grid;color:#8ff0c0;}.dev__c svg{width:18px;height:18px;}
.dlogos{display:flex;align-items:center;gap:18px;margin-top:18px;}
.dlogos img{display:block;width:auto;}
/* steps: numbered, joined by a line */
.dsteps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:28px;}
.dstep{position:relative;display:flex;flex-direction:column;padding-top:58px;}
.dstep::before{content:"";position:absolute;left:46px;right:-28px;top:20px;height:1px;background:linear-gradient(90deg,rgba(159,192,255,.6),rgba(159,192,255,.12));}
.dstep:last-child::before{display:none;}
.dstep__n{position:absolute;left:0;top:0;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(159,192,255,.7);font-size:14px;font-weight:600;color:#cfe0ff;font-variant-numeric:tabular-nums;}
.dstep b{font-size:20px;line-height:1.3;font-weight:600;color:var(--text-1);}
.dstep>span{margin-top:8px;font-size:16px;line-height:1.55;color:var(--text-2);}
.dstep__x{margin-top:14px;font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;}
/* schema tables: hairline rows */
.dtable{border-bottom:1px solid rgba(255,255,255,.08);}
.dtr{display:grid;grid-template-columns:minmax(200px,.9fr) minmax(0,1fr) minmax(0,1.2fr);gap:28px;padding:16px 0;border-top:1px solid rgba(255,255,255,.08);align-items:baseline;}
.dtr--h{padding:0 0 12px;border-top:0;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);}
.dk{font-size:16px;font-weight:600;color:var(--text-1);overflow-wrap:anywhere;}
.dv{font:14px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;overflow-wrap:anywhere;}
.dd{font-size:16px;line-height:1.5;color:var(--text-2);}
.dtg{padding:28px 0 12px;border-top:1px solid rgba(255,255,255,.08);font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.dcode{margin:0;padding:22px 26px;border-radius:14px;background:#0b1135;box-shadow:0 0 0 1px rgba(255,255,255,.08);font:14px/1.75 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;overflow-x:auto;white-space:pre;}
.dsplit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center;margin-bottom:48px;}
.dsplit .dh{margin-top:0;}
.dchips{display:flex;flex-wrap:wrap;gap:20px 36px;}
.dchip{display:flex;align-items:center;gap:12px;font-size:19px;color:var(--text-1);}
.dlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:18px;}
.dlist li{display:flex;gap:14px;font-size:19px;line-height:1.5;color:var(--text-1);}
.dlist__c{flex:none;display:grid;margin-top:3px;color:#9fc0ff;}.dlist__c svg{width:22px;height:22px;}
/* pixel firing on a page */
.dfire{display:flex;flex-direction:column;align-items:flex-start;gap:14px;}
.dfire__url{font:14px/1 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-3);}
.dfire__page b{display:block;font-size:26px;font-weight:600;color:var(--text-1);}
.dfire__page span{display:block;margin-top:4px;font-size:17px;color:var(--text-2);}
.dfire__arrow{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.dfire__arrow::before{content:"";width:2px;height:34px;background:linear-gradient(rgba(159,192,255,0),rgba(159,192,255,.8));}
.dfire__px{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--text-1);}
.dfire__px::before{content:"";width:8px;height:8px;border-radius:2px;background:#9fc0ff;box-shadow:0 0 0 6px rgba(159,192,255,.15);}
/* MAID chain */
.dchain{display:flex;flex-direction:column;align-items:flex-start;gap:8px;}
.dcn b{display:block;font-size:20px;font-weight:600;color:var(--text-1);}
.dcn code,.dcn span{display:block;margin-top:4px;font:14px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;}
.dcn span{font-family:inherit;font-size:16px;color:var(--text-2);}
.dcs{font-size:20px;line-height:1;color:#9fc0ff;padding-left:2px;}
/* funnel */
.dfunnel{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px;}
.dfunnel li{padding-top:18px;border-top:3px solid rgba(159,192,255,.3);}
.dfunnel li:nth-child(2){border-top-color:rgba(159,192,255,.6);}
.dfunnel li:nth-child(3){border-top-color:var(--blue);}
.dfunnel span{display:block;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);}
.dfunnel b{display:block;margin-top:8px;font-size:22px;font-weight:600;color:var(--text-1);}
.dtags{margin:72px 0 0;font-size:15px;letter-spacing:.04em;color:var(--text-3);}
/* "go deeper" tiles: open columns, like the outcomes */
.dtiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));border-top:1px solid rgba(255,255,255,.1);}
.dtile{display:flex;flex-direction:column;align-items:flex-start;padding:30px 28px 30px;text-align:left;border-left:1px solid rgba(255,255,255,.08);transition:background .25s ease;}
.dtile:first-child{border-left:0;}
.dtile:hover{background:rgba(255,255,255,.035);}
.dtile:focus-visible{outline:2px solid #a6c4ff;outline-offset:-2px;}
.dtile b{font-size:48px;line-height:1;font-weight:700;letter-spacing:-.04em;color:var(--text-1);font-variant-numeric:tabular-nums;}
.dtile small{margin-top:8px;font-size:15px;color:var(--text-2);}
.dtile__t{margin-top:22px;font-size:22px;line-height:1.25;font-weight:600;letter-spacing:-.01em;color:var(--text-1);}
.dtile__d{margin-top:8px;font-size:16px;line-height:1.55;color:var(--text-2);}
.dtile__go{display:inline-flex;align-items:center;gap:8px;margin-top:20px;font-size:16px;font-weight:500;color:#9fc0ff;}
.dtile__a{display:grid;}.dtile__a svg{width:18px;height:18px;transition:transform .2s ease;}
.dtile:hover .dtile__a svg{transform:translateX(4px);}
/* level 1: the entry tiles under an opened card */
.fdeep{grid-column:1/-1;margin-top:64px;opacity:0;transition:opacity .45s ease .55s;}
.asset.sel .fdeep{opacity:1;}
.fdeep__h{margin:0 0 18px;text-align:center;font-size:15px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
/* the depth bar */
.dbar{position:fixed;left:50%;top:96px;z-index:31;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 32px);height:50px;padding:0 14px 0 6px;border-radius:14px;background:#04113e;box-shadow:0 0 0 1px rgba(255,255,255,.1),0 20px 40px -20px rgba(0,0,0,.8);
  transform:translate(-50%,-10px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .35s ease,transform .45s cubic-bezier(.16,1,.3,1),visibility .35s;}
.deep-open .dbar{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);}
.dback{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px 0 10px;border-radius:10px;font-size:15px;font-weight:500;color:var(--text-1);background:rgba(255,255,255,.07);transition:background .15s;}
.dback:hover{background:rgba(255,255,255,.12);}
.dback:focus-visible,.dcrumbs button:focus-visible{outline:2px solid #a6c4ff;outline-offset:2px;}
/* nested squares: one per level, the current one lit */
.dmeter{position:relative;flex:none;width:26px;height:26px;}
.dmeter i{position:absolute;left:50%;top:50%;border-radius:4px;box-shadow:inset 0 0 0 1.5px rgba(166,176,196,.35);transform:translate(-50%,-50%);transition:box-shadow .3s,background .3s;}
.dmeter i:nth-child(1){width:26px;height:26px;}.dmeter i:nth-child(2){width:19px;height:19px;}.dmeter i:nth-child(3){width:12px;height:12px;border-radius:3px;}.dmeter i:nth-child(4){width:5px;height:5px;border-radius:1.5px;}
.dmeter[data-depth="1"] i:nth-child(2),.dmeter[data-depth="2"] i:nth-child(3),.dmeter[data-depth="3"] i:nth-child(4){box-shadow:inset 0 0 0 1.5px #9fc0ff;background:rgba(77,141,255,.35);}
.dcrumbs{display:flex;align-items:center;gap:8px;min-width:0;overflow-x:auto;scrollbar-width:none;white-space:nowrap;}
.dcrumbs::-webkit-scrollbar{display:none;}
.dcrumbs button{font-size:15px;color:var(--text-2);transition:color .15s;}
.dcrumbs button:hover{color:var(--text-1);}
.dcrumbs button[aria-current]{color:var(--text-1);font-weight:500;}
.dsep{color:var(--text-3);}
@media (max-width:900px){
  .dbar{top:76px;}
  .deep{top:70px;}
  .dpage{padding:90px 18px 110px;}
  .dt{font-size:38px;}
  .dlead{font-size:18px;}
  .dstat b{font-size:40px;}
  .dstats{gap:24px 40px;}
  .dcol,.dcol+.dcol{padding:24px 0 8px;border-left:0;}
  .dcol+.dcol{border-top:1px solid rgba(255,255,255,.08);}
  .dsteps{grid-template-columns:1fr;gap:30px;}
  .dstep::before{display:none;}
  .dtr{grid-template-columns:1fr;gap:4px;}
  .dtr--h{display:none;}
  .dsplit{grid-template-columns:1fr;gap:36px;}
  .dtile{border-left:0;border-top:1px solid rgba(255,255,255,.08);padding:26px 0;}
  .dtile:first-child{border-top:0;}
  .dfunnel{grid-template-columns:1fr;gap:20px;}
}
@media (prefers-reduced-motion:reduce){.stage{transition:none;}}
.dsteps+.dsplit{margin-top:76px;}

/* back (top left) and close (top right): shown whenever a card or a drill-down page is open */
.dbar{display:none!important;}
.zbtn{position:fixed;top:16px;z-index:32;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:52px;border-radius:16px;background:#04113e;box-shadow:0 0 0 1px rgba(255,255,255,.1);color:var(--text-1);font-size:16px;font-weight:500;
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-6px);transition:opacity .3s ease,transform .4s cubic-bezier(.16,1,.3,1),visibility .3s,background .15s;}
.zback{left:18px;padding:0 18px 0 14px;}
.zclose{right:18px;width:52px;}
.zbtn:hover{background:#0b1c55;}
.zbtn:focus-visible{outline:2px solid #a6c4ff;outline-offset:2px;}
.zopen .zbtn{opacity:1;visibility:visible;pointer-events:auto;transform:none;}
@media (max-width:900px){.zbtn{top:12px;height:46px;}.zback{left:12px;padding:0 12px;font-size:0;gap:0;}.zclose{right:12px;width:46px;}.zopen .jump{margin:0 56px;}}

/* ================================================ one-screen scenes (replaces the long document pages) */
.deep{overflow:hidden;-webkit-mask-image:none;mask-image:none;}
.dpage{position:absolute;inset:0;min-height:0;padding:28px 40px 36px;display:block;overflow:hidden;}
.dwrap{max-width:1240px;margin:0 auto;transform-origin:50% 0;}
.dhd{display:flex;flex-direction:column;align-items:center;text-align:center;}
.dhd .eyebrow{margin-top:20px;}
.dhd .dt{margin:10px 0 0;max-width:760px;font-size:38px;line-height:1.1;font-weight:600;letter-spacing:-.025em;text-wrap:balance;}
.dhd+*{margin-top:52px;}
/* flow of steps: icon nodes joined by a line */
.dflow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:24px;}
.dfl{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;}
.dfl::after{content:"";position:absolute;top:36px;left:calc(50% + 46px);width:calc(100% - 92px + 24px);height:1px;background:linear-gradient(90deg,rgba(159,192,255,.6),rgba(159,192,255,.15));}
.dfl:last-child::after{display:none;}
.dfl__n{display:grid;place-items:center;width:72px;height:72px;border-radius:50%;background:#0b1c48;box-shadow:inset 0 0 0 1.5px rgba(159,192,255,.45);color:#cfe0ff;}
.dfl__n svg{width:30px;height:30px;}
.dfl b{margin-top:20px;font-size:21px;line-height:1.25;font-weight:600;color:var(--text-1);}
.dfl>span:not(.dfl__n){margin-top:8px;max-width:280px;font-size:16px;line-height:1.5;color:var(--text-2);}
.dfl__x{margin-top:12px;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;}
/* hub: items wired into one big figure */
.dhub{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 380px minmax(0,1fr);align-items:center;}
.dhub__links{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;}
.dhub__links .b{fill:none;stroke:rgba(159,192,255,.34);stroke-width:2;}
.dhub__links .p{fill:none;stroke:rgba(160,196,255,.9);stroke-width:1.8;stroke-linecap:round;stroke-dasharray:26 520;animation:flow 4.5s linear infinite;}
.dhub__l,.dhub__r{position:relative;z-index:1;display:flex;flex-direction:column;gap:6px;}
.dhub__r{padding-left:60px;gap:22px;}
.dhub__c{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 36px;}
.dhub__c>b{font-size:72px;line-height:1;font-weight:700;letter-spacing:-.045em;color:var(--text-1);}
.dhub__c>span{margin-top:10px;font-size:20px;font-weight:500;color:var(--text-1);}
.dhub__c>small{margin-top:10px;font-size:16px;line-height:1.5;color:var(--text-2);}
.dn{display:flex;align-items:center;gap:16px;padding:10px 6px;}
.dn__i{flex:none;display:grid;place-items:center;width:30px;height:30px;color:#9fc0ff;}
.dn__i svg{width:28px;height:28px;}
.dn b{display:block;font-size:19px;line-height:1.3;font-weight:500;color:var(--text-1);}
.dn b em{font-style:normal;font-weight:700;margin-right:10px;font-size:28px;letter-spacing:-.03em;}
.dn span:not(.dn__i){display:block;margin-top:2px;font-size:15px;line-height:1.4;color:var(--text-2);}
/* next level links */
.dnext{display:flex;justify-content:center;gap:16px;margin-top:48px;}
.dnext__b{display:flex;align-items:center;gap:16px;padding:16px 22px;border-top:1px solid rgba(255,255,255,.1);text-align:left;transition:background .2s;}
.dnext__b:hover{background:rgba(255,255,255,.035);}
.dnext__b b{font-size:19px;font-weight:600;color:var(--text-1);}
.dnext__b span{font-size:16px;color:var(--text-2);}
.dnext__a{display:grid;color:#9fc0ff;}.dnext__a svg{width:20px;height:20px;transition:transform .2s;}
.dnext__b:hover .dnext__a svg{transform:translateX(4px);}
.dnext__b:focus-visible{outline:2px solid #a6c4ff;outline-offset:2px;}
/* compact schema grid */
.dfields{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:4px 36px;}
.dfgroups{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:36px;}
.dfgroup__h{margin:0 0 6px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.dfld{padding:12px 0;border-top:1px solid rgba(255,255,255,.08);}
.dfld b{display:block;font-size:16px;font-weight:600;color:var(--text-1);overflow-wrap:anywhere;}
.dfld code{display:block;margin-top:4px;font:13px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;overflow-wrap:anywhere;}
.dfld span{display:block;margin-top:4px;font-size:14px;line-height:1.4;color:var(--text-2);}
/* pixel scene */
.dpx{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr) minmax(0,1fr);gap:44px;align-items:center;}
.dpay__h,.dsub{margin:0 0 10px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.dsub{margin-top:44px;text-align:center;}
.dpay__r{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-top:1px solid rgba(255,255,255,.07);}
.dpay__r b{font-size:14px;font-weight:600;color:var(--text-1);white-space:nowrap;}
.dpay__r code{font:12.5px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.dpx~.dcols .dcol{padding-top:20px;}
.dpx~.dcols .dcol p{font-size:15px;}
.dpx~.dcols .dcol b{margin-top:12px;font-size:19px;}
/* two-up */
.dduo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;align-items:center;}
.dflow+.dduo{margin-top:56px;}
.dchain{display:flex;align-items:center;flex-wrap:wrap;gap:12px 18px;}
.dcs{font-size:20px;color:#9fc0ff;}
.dbig svg{display:block;width:100%;max-width:420px;height:auto;margin:0 auto;overflow:visible;}
.dduo~.dchips{justify-content:center;margin-top:36px;}
.dsrc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;}
.dflow~.dsub{margin-top:52px;}
.dtags{margin:28px 0 0;text-align:center;}
/* source cards with graphics (level 1 and level 2) */
.dtile__g{display:block;width:100%;max-width:300px;height:140px;margin-bottom:26px;}
.dtile__g svg{display:block;width:100%;height:100%;overflow:visible;}
.dtiles--big .dtile{padding:30px 32px;}
.dtiles--big .dtile b{font-size:52px;}
.dtiles--big .dtile__t{font-size:24px;}
.dtiles--big .dtile__d{font-size:17px;}
.focus--tiles{width:1240px;}
.focus--tiles>.flinks,.focus--tiles>.gcol{display:none;}
.focus--tiles .fdeep{margin-top:0;}
.focus--tiles .dtile{padding:34px;}
.focus--tiles .dtile b{font-size:60px;}
.focus--tiles .dtile small{font-size:17px;}
.focus--tiles .dtile__t{font-size:28px;}
.focus--tiles .dtile__d{font-size:19px;}
.focus--tiles .dtile__go{font-size:19px;}
.focus--tiles .fdeep__h{font-size:17px;}
@media (max-width:900px){
  .deep{overflow-y:auto;}
  .dpage{position:absolute;inset:0 0 auto 0;min-height:100%;padding:24px 18px 80px;}
  .dhd .dt{font-size:30px;}
  .dflow,.dfgroups,.dsrc,.dduo,.dpx{grid-template-columns:1fr;}
  .dfl::after{display:none;}
  .dhub{grid-template-columns:1fr;}
  .dhub__links{display:none;}
  .dhub__r{padding-left:0;}
  .dhub__c{order:-1;padding:0 0 24px;}
  .dnext{flex-direction:column;}
  .focus--tiles{width:420px;}
}
.dpage[hidden]{display:none!important;}
.dwrap>.dhd+*{margin-top:56px;}
.dflow+.dduo{display:flex;flex-direction:column;align-items:center;gap:40px;}
.dflow+.dduo .dsub{margin-top:0;}
.dflow+.dduo .dchips{justify-content:center;}
.dchain{flex-wrap:nowrap;justify-content:center;gap:22px;}
.dcn{text-align:center;}
.dduo>div>.dsub{text-align:left;}
.dflow+.dduo>div>.dsub{text-align:center;}
.dflow+.dduo .dchain{flex-direction:row;align-items:center;}

/* ================================================ fragment graphics (persistent.id style) and one type scale for every drill-down
   Scale: labels 13px caps · body 16px · item titles 20px · card titles 24px · figures 52px / hub 72px.
   Space: header to body 56px · between blocks 48px · inside items 8px. */
.dart{position:relative;display:block;width:100%;height:236px;margin-bottom:26px;perspective:1100px;perspective-origin:50% 0;
  -webkit-mask-image:linear-gradient(to bottom,#000 68%,transparent 100%);mask-image:linear-gradient(to bottom,#000 68%,transparent 100%);}
.dart .frag{display:block;}
.dart .dfrag{position:absolute;left:0;top:6px;width:100%;transform-origin:50% 0;transform:rotateX(16deg);transition:transform .6s cubic-bezier(.16,1,.3,1);text-align:left;}
.dart .dfrag--list{width:118%;}
.dart .dfrag--list .frag__row,.dart .dfrag--list .frag__head{-webkit-mask-image:linear-gradient(to right,#000 62%,transparent 86%);mask-image:linear-gradient(to right,#000 62%,transparent 86%);}
.dtile:hover .dart .dfrag{transform:rotateX(9deg);}
.dart .frag__head{display:flex;align-items:center;gap:10px;height:44px;padding:0 16px;font-size:15px;color:var(--text-3);}
.frag__hi{display:grid;color:var(--text-3);}.frag__hi svg{width:15px;height:15px;}
.dart .frag__row{display:flex;align-items:center;gap:12px;height:50px;padding:0 14px;font-size:16px;}
.dart .frag__name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-1);}
.frag__sub{margin-left:8px;color:var(--text-3);}
.dart .frag__tag{flex:none;margin-left:auto;}
.frag__avatar{flex:none;width:30px;height:30px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.14);}
.frag__avatar img{display:block;width:100%;height:100%;object-fit:cover;}
.dart .cb{width:18px;height:18px;border-radius:5px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28);background:none;}
.dart .cb--on{background:var(--blue);box-shadow:none;}
.stack{position:absolute;inset:0;display:block;}
.stack__card{position:absolute;display:block;width:80%;padding:16px 18px;border-radius:14px;background:rgba(15,34,76,.98);transform-origin:0 0;text-align:left;}
.stack__head{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:500;color:var(--text-1);}
.stack__i{display:grid;color:var(--text-2);}.stack__i svg{width:18px;height:18px;}
.stack__p{display:block;margin-top:8px;font-size:14px;line-height:1.45;color:var(--text-3);}
.stack__card--3{left:4%;top:4%;transform:rotateX(12deg) rotateZ(-6deg);opacity:.45;}
.stack__card--2{left:12%;top:28%;transform:rotateX(12deg) rotateZ(-6deg);opacity:.72;}
.stack__card--1{left:20%;top:52%;transform:rotateX(12deg) rotateZ(-6deg);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 24px 40px -16px rgba(0,0,0,.9);}
.dbig .dart{height:300px;max-width:520px;margin:0 auto;}
.dtile__g{display:none;}
/* the one scale */
.dhd .eyebrow,.dsub,.dpay__h,.dfgroup__h,.fdeep__h{font-size:13px!important;letter-spacing:.08em;}
.dwrap>.dhd+*{margin-top:56px;}
.dfl b,.dn b,.dcol b,.dnext__b b,.dhub__c>span,.dfunnel b{font-size:20px!important;font-weight:600;}
.dfl>span:not(.dfl__n),.dn span:not(.dn__i),.dcol p,.dnext__b span,.dhub__c>small,.dlist li,.dchip,.dtile__d{font-size:16px!important;line-height:1.5;}
.dtiles--big .dtile__t,.dtile__t{font-size:24px!important;}
.dtiles--big .dtile b,.dtile b{font-size:52px!important;}
.dtile small{font-size:15px!important;}
.dsub,.dflow~.dsub,.dflow+.dduo,.dnext,.dduo~.dchips{margin-top:48px!important;}
.dflow+.dduo .dsub{margin-top:0!important;}
.dnext{margin-top:48px!important;}
.dtile{padding:28px 30px!important;}
.focus--tiles .dart{height:250px;}
.focus--tiles .dart .frag__row{height:56px;font-size:18px;}
.focus--tiles .dart .frag__head{font-size:16px;height:48px;}
.dhero{max-width:560px;margin-left:auto;margin-right:auto;}
.dhero .dart{height:220px;margin-bottom:0;}
.dhero+.dflow{margin-top:40px;}

/* ================================================ pages at natural size: no scale-to-fit; centred when short, scroll when tall */
.deep{overflow-y:auto;overflow-x:hidden;}
.dpage{position:absolute;left:0;right:0;top:0;bottom:auto;min-height:100%;display:flex;flex-direction:column;justify-content:center;padding:40px 40px 64px;overflow:visible;}
.dwrap{width:100%;transform:none!important;}
.dsub--top{margin:0 0 18px!important;text-align:center;}
/* ================================================ graphics: glass parts composed per point */
.gx{position:relative;display:block;width:100%;height:230px;margin-bottom:28px;text-align:left;}
.dart{display:none;}
.gf{position:absolute;display:block;padding:6px;border-radius:14px;background:#0b1135;box-shadow:0 0 0 1px rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.05),0 24px 40px -20px rgba(0,0,0,.9);}
.gx .frag__head{display:flex;align-items:center;gap:10px;height:42px;padding:0 12px;font-size:15px;color:var(--text-3);white-space:nowrap;overflow:hidden;}
.gx .frag__head .frag__avatar{width:24px;height:24px;}
.gx .frag__row{position:relative;display:flex;align-items:center;gap:12px;height:48px;padding:0 12px;border-radius:10px;font-size:16px;color:var(--text-1);}
.gx .frag__name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gx .frag__tag{flex:none;margin-left:auto;}
.gx .frag__glyph{flex:none;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.08);display:grid;place-items:center;color:var(--text-1);}
.gx .frag__glyph svg{width:15px;height:15px;}
.gx .cb{flex:none;width:18px;height:18px;border-radius:5px;display:grid;place-items:center;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.28);}
.gx .cb--on{background:var(--blue);box-shadow:none;}
/* chips */
.gc{position:absolute;display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;border-radius:14px;background:rgba(15,34,76,.98);box-shadow:0 0 0 1px rgba(255,255,255,.09),0 20px 36px -18px rgba(0,0,0,.9);}
.gc>span:last-child{min-width:0;}
.gc b{display:block;font-size:16px;font-weight:500;color:var(--text-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gc small{display:block;margin-top:2px;font-size:13px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gc--on{background:#142e6b;box-shadow:0 0 0 1px rgba(159,192,255,.45),0 20px 36px -18px rgba(0,0,0,.9);}
.gc--sm{padding:10px 14px;}
.gc .frag__avatar{width:34px;height:34px;}
.gl{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;}
.gl path{fill:none;stroke:rgba(159,192,255,.45);stroke-width:1.5;vector-effect:non-scaling-stroke;}
/* event dots (linkage events) */
.gdot{position:absolute;display:flex;flex-direction:column;align-items:center;gap:6px;transform:translateX(-50%);}
.gdot .frag__glyph{width:40px!important;height:40px!important;background:#10265a!important;box-shadow:0 0 0 1px rgba(159,192,255,.3);}
.gdot .frag__glyph svg{width:18px!important;height:18px!important;}
.gdot em{font-style:normal;font-size:13px;color:var(--text-2);}
/* funnel: each stage row is a narrowing bar */
.gf--funnel .frag__row::before{content:"";position:absolute;left:0;top:4px;bottom:4px;width:var(--w,100%);border-radius:10px;background:rgba(77,141,255,.12);z-index:0;}
.gf--funnel .frag__row--active::before{background:rgba(77,141,255,.32);}
.gf--funnel .frag__row--active{background:none;box-shadow:none;}
.gf--funnel .frag__row>*{position:relative;z-index:1;}
/* stat panel */
.gbig{display:block;padding:8px 12px 0;}
.gbig b{display:block;font-size:44px;line-height:1;font-weight:700;letter-spacing:-.04em;color:var(--text-1);}
.gbig small{display:block;margin-top:6px;font-size:14px;color:var(--text-2);}
.gbar{display:flex;gap:4px;margin:16px 12px 0;height:12px;}
.gbar i{display:block;border-radius:6px;background:var(--blue);}
.gbar i+i{background:rgba(159,192,255,.45);}
.gleg{display:flex;gap:20px;padding:12px 12px 10px;font-size:14px;color:var(--text-2);}
.gleg b{color:var(--text-1);font-weight:600;margin-left:4px;}
.gleg i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:6px;background:var(--blue);}
.gleg span+span i{background:rgba(159,192,255,.45);}
/* email */
.gav{display:grid;place-items:center;width:24px;height:24px;border-radius:6px;background:var(--blue);font-size:11px;font-weight:700;color:#fff;}
.gmail{display:block;padding:4px 12px 12px;}
.gmail b{display:block;font-size:18px;font-weight:600;color:var(--text-1);}
.gmail span{display:block;margin-top:4px;font-size:14px;line-height:1.45;color:var(--text-2);}
.gmail em{display:inline-block;margin-top:12px;padding:6px 12px;border-radius:8px;background:var(--text-1);color:var(--bg);font-style:normal;font-size:13px;font-weight:600;}
.gf--receipt{border-radius:14px 14px 4px 4px;}
.dhero .gx{height:230px;}
.dbig .gx{height:260px;max-width:520px;margin:0 auto;}
@media (max-width:900px){.dpage{padding:24px 18px 80px;justify-content:flex-start;}}
/* card figure rules must not reach the text inside the graphics */
.dtile .gx b,.dtile .gx small{letter-spacing:normal!important;line-height:1.3!important;}
.dtile .gx .gc b{font-size:16px!important;font-weight:500!important;}
.dtile .gx small{font-size:13px!important;margin-top:2px!important;}
.dtile .gx .gbig b{font-size:44px!important;font-weight:700!important;letter-spacing:-.04em!important;line-height:1!important;}
.dtile .gx .gbig small{font-size:14px!important;margin-top:6px!important;}
.dtile .gx .gmail b{font-size:18px!important;font-weight:600!important;}
.dtile .gx .gleg b{font-size:14px!important;font-weight:600!important;}
.dsub--top{margin:56px 0 18px!important;}
.gc--sm b{overflow:visible!important;}

/* the template: header · one graphic · steps · go deeper */
.dflow--set .dfl::after{display:none;}
.dhero+.dflow{margin-top:44px!important;}
.dflow+.dnext{margin-top:48px!important;}
.dduo--code{align-items:start;}
.dduo--code .dfields{grid-template-columns:repeat(2,minmax(0,1fr));}
.dhero .gx{height:262px!important;}

/* ================================================ page-specific layouts */
.gx--flow{height:auto!important;margin:0!important;}
.gpan{position:relative;display:block;padding:6px;border-radius:14px;background:#0b1135;text-align:left;box-shadow:0 0 0 1px rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.05),0 24px 40px -20px rgba(0,0,0,.9);}
.gc--flow{position:relative;}
.gcode{display:block;padding:6px 12px 12px;font:13px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;}
.dcap{margin:16px 4px 0;font-size:16px;line-height:1.5;color:var(--text-2);text-align:center;}
/* journey: a graphic for each step */
.dj{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:40px;}
.dj__s{position:relative;display:flex;flex-direction:column;}
.dj__s+.dj__s::before{content:"";position:absolute;left:-30px;top:60px;width:20px;height:2px;border-radius:1px;background:rgba(159,192,255,.6);}
.dj__g{display:flex;align-items:center;min-height:186px;}
.dj__g>.gx{width:100%;}
.dj__n{margin-top:24px;font-size:13px;font-weight:600;letter-spacing:.08em;color:var(--eyebrow);}
.dj__s>b{margin-top:6px;font-size:20px;font-weight:600;color:var(--text-1);}
.dj__s>span:last-child{margin-top:8px;font-size:16px;line-height:1.5;color:var(--text-2);}
/* mechanism: graphic → graphic → graphic */
.dmech{display:grid;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr) 40px minmax(0,1fr);align-items:start;gap:16px;}
.dmech--two{grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);max-width:960px;margin-left:auto;margin-right:auto;}
.dmech__a{display:grid;place-items:center;height:140px;color:#9fc0ff;}
.dmech__l{margin:18px 4px 0;font-size:16px;line-height:1.5;color:var(--text-2);}
.dmech__l b{display:block;margin-bottom:4px;font-size:20px;font-weight:600;color:var(--text-1);}
.dmech+.dsub,.dmech+.dflow{margin-top:52px!important;}
.dflow--text .dfl__n{width:52px;height:52px;}
.dflow--text .dfl__n svg{width:22px;height:22px;}
/* annotated graphic: callouts either side of one picture */
.dann{display:grid;grid-template-columns:minmax(0,1fr) 440px minmax(0,1fr);align-items:center;gap:48px;}
.dann__c{display:flex;flex-direction:column;gap:40px;}
.dco{display:flex;gap:16px;}
.dco__n{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(159,192,255,.7);font-size:14px;font-weight:600;color:#cfe0ff;}
.dco b{display:block;font-size:20px;font-weight:600;color:var(--text-1);}
.dco span:not(.dco__n):not(.dco__p){display:block;margin-top:6px;font-size:16px;line-height:1.5;color:var(--text-2);}
.dco__p{display:inline-flex;align-items:center;gap:10px;margin-top:12px;font-size:15px;color:var(--text-1);}
.dco__p .frag__avatar{width:28px;height:28px;}
.dhub--two{grid-template-columns:minmax(0,1fr) 440px;gap:90px;}
.dhub__c--panel{padding:0;align-items:stretch;text-align:left;}
.dduo .dchips{margin-top:28px;}
@media (max-width:900px){.dj,.dmech,.dmech--two,.dann,.dhub--two{grid-template-columns:1fr;}.dmech__a{display:none;}.dj__s+.dj__s::before{display:none;}}
.dmech__s>.gx>.gpan{min-height:200px;}
.dj__g{min-height:214px;}
.dhub__c--panel .dcap{font-size:16px!important;margin-top:16px!important;}

/* ================================================ information pages (second click): easy to read */
.dpage:has(.info){justify-content:flex-start;padding-top:48px;}
.info{max-width:1040px;margin:0 auto;text-align:left;}
.ilead{margin:0 auto;max-width:720px;font-size:20px;line-height:1.55;color:var(--text-2);text-align:center;}
.istats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:24px;margin-top:44px;padding:28px 0;border-top:1px solid rgba(255,255,255,.1);border-bottom:1px solid rgba(255,255,255,.1);}
.istats b{display:block;font-size:40px;line-height:1;font-weight:700;letter-spacing:-.035em;color:var(--text-1);}
.istats span{display:block;margin-top:8px;font-size:15px;color:var(--text-2);}
.isec{margin-top:64px;}
.isec__l{margin:0;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.isec__t{margin:10px 0 0;font-size:28px;line-height:1.2;font-weight:600;letter-spacing:-.02em;color:var(--text-1);}
.isec__n{margin:10px 0 0;max-width:760px;font-size:17px;line-height:1.6;color:var(--text-2);}
.isec>*:not(.isec__l):not(.isec__t):not(.isec__n):first-of-type{margin-top:24px;}
.isec .isteps,.isec .ilist,.isec .itable,.isec .ibul,.isec .itags,.isec .icode,.isec .ilink{margin-top:24px;}
.isub{margin:36px 0 0;font-size:15px;font-weight:600;color:var(--text-1);}
.isub+.isec__n{margin-top:6px;}
.isteps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:24px;}
.isteps li{padding-top:16px;border-top:2px solid rgba(159,192,255,.35);}
.isteps span{font-size:13px;font-weight:600;color:var(--eyebrow);}
.isteps b{display:block;margin-top:8px;font-size:18px;line-height:1.3;font-weight:600;color:var(--text-1);}
.isteps p{margin:6px 0 0;font-size:15px;line-height:1.55;color:var(--text-2);}
.ilist{display:grid;grid-template-columns:repeat(var(--c),minmax(0,1fr));gap:0 28px;}
.ilist>div{padding:16px 0;border-top:1px solid rgba(255,255,255,.08);}
.ilist b{display:block;font-size:17px;line-height:1.35;font-weight:600;color:var(--text-1);}
.ilist p{margin:6px 0 0;font-size:15px;line-height:1.55;color:var(--text-2);}
.ibul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;}
.ibul li{position:relative;padding-left:22px;font-size:17px;line-height:1.55;color:var(--text-1);}
.ibul li::before{content:"";position:absolute;left:4px;top:.62em;width:6px;height:6px;border-radius:50%;background:#9fc0ff;}
.itags{display:flex;flex-wrap:wrap;gap:10px;}
.itags span{padding:8px 14px;border-radius:999px;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);font-size:15px;color:var(--text-1);}
.icode{padding:20px 24px;border-radius:12px;background:#0b1135;box-shadow:0 0 0 1px rgba(255,255,255,.08);font:14px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;overflow-x:auto;white-space:pre;}
.itable{border-bottom:1px solid rgba(255,255,255,.08);}
.itr{display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,1.1fr) minmax(0,1.3fr);gap:24px;padding:12px 0;border-top:1px solid rgba(255,255,255,.08);align-items:baseline;}
.itr--h{padding:0 0 10px;border-top:0;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);}
.itr b{font-size:15px;font-weight:600;color:var(--text-1);overflow-wrap:anywhere;}
.itr code{font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:#cfe0ff;overflow-wrap:anywhere;}
.itr span{font-size:15px;line-height:1.5;color:var(--text-2);}
.itg{padding:22px 0 8px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.ilink{display:inline-flex;font-size:17px;font-weight:500;color:#9fc0ff;text-decoration:none;}
.ilink:hover{color:var(--text-1);}
.itail{margin:56px 0 0;text-align:center;font-size:15px;color:var(--text-3);}
a.dnext__b{text-decoration:none;}
@media (max-width:900px){.isteps,.ilist{grid-template-columns:1fr;}.itr{grid-template-columns:1fr;gap:2px;}.itr--h{display:none;}.istats{grid-template-columns:1fr 1fr;}}

.dj--chips .dj__g{min-height:0!important;}
.dj--chips .dj__s+.dj__s::before{top:30px;}
.dj--chips .dj__n{margin-top:28px;}
.dj--chips .gc{padding:14px 16px 14px 12px;}
.dj--chips .gc b{font-size:17px;}

/* information pages: big clear icons */
.iic{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(77,141,255,.16);box-shadow:inset 0 0 0 1px rgba(159,192,255,.22);color:#cfe0ff;}
.iic svg{width:26px;height:26px;}
.isec__h{display:flex;align-items:center;gap:18px;}
.isec__i{flex:none;display:grid;place-items:center;width:60px;height:60px;border-radius:18px;background:var(--blue);color:#fff;box-shadow:0 14px 28px -14px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.25);}
.isec__i svg{width:30px;height:30px;}
.isec__h .isec__t{margin-top:4px;}
.isec__h+.isec__n{margin-top:16px;}
.isteps li{display:flex;flex-direction:column;padding-top:20px;}
.isteps li .iic{margin-bottom:16px;}
.isteps li>span:not(.iic){font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.ilist>div{display:flex;gap:16px;align-items:flex-start;padding:18px 0;}
.ilist>div>div{min-width:0;}
.ilist .iic{width:44px;height:44px;border-radius:13px;}
.ilist .iic svg{width:22px;height:22px;}
.itags span{display:inline-flex;align-items:center;gap:8px;padding:9px 16px 9px 12px;}
.itag__i{display:grid;color:#9fc0ff;}.itag__i svg{width:18px;height:18px;}
.iex{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:24px;align-items:center;margin-top:24px;}
.iex .icode{margin-top:0!important;}
.iex--solo{display:block;max-width:520px;margin:48px auto 0;}
.iex .gx--flow,.iex--solo .gx--flow{display:block;}
@media (max-width:900px){.iex{grid-template-columns:1fr;}}
/* drill-down headers: big, like the page hero */
.dhd .bigicon{width:84px;height:84px;border-radius:26px;}
.dhd .bigicon svg{width:42px;height:42px;}
.dhd .eyebrow{margin-top:24px;font-size:15px!important;}
.dhd .dt{margin-top:12px;max-width:1000px;font-size:56px;line-height:1.06;letter-spacing:-.032em;}
@media (max-width:900px){.dhd .dt{font-size:38px;}}

/* info pages, round 2: headings not tiles, bare icons, the circle-and-line steps */
.isec{margin-top:72px;}
.isec__h{display:block;}
.isec__l{margin:0 0 8px;}
.isec__t{margin:0!important;font-size:32px!important;line-height:1.15;letter-spacing:-.025em;}
.isec .dflow{margin-top:36px;}
.isec .dflow .dfl b{font-size:20px!important;}
.isec .dflow .dfl>span:not(.dfl__n){font-size:16px!important;}
.ilist .iic{width:auto;height:auto;border-radius:0;background:none;box-shadow:none;color:#9fc0ff;padding-top:2px;}
.ilist .iic svg{width:28px;height:28px;}
.itags .itag__i{width:auto!important;height:auto!important;padding:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;}
.itags span{padding:9px 16px!important;}

/* sources read as separate blocks; schemas fold away into a panel */
.isec+.isec{padding-top:72px;border-top:1px solid rgba(255,255,255,.08);}
.isec .dflow+.ischema,.isec .icode+.ischema,.isec .iex+.ischema{margin-top:48px;}
.ischema{margin-top:32px;border-radius:16px;background:#0b1135;box-shadow:0 0 0 1px rgba(255,255,255,.08);}
.ischema summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;cursor:pointer;list-style:none;font-size:18px;font-weight:600;color:var(--text-1);}
.ischema summary::-webkit-details-marker{display:none;}
.ischema summary em{font-style:normal;font-size:15px;font-weight:500;color:var(--text-2);display:flex;align-items:center;gap:12px;}
.ischema summary em::after{content:"";width:9px;height:9px;border-right:2px solid #9fc0ff;border-bottom:2px solid #9fc0ff;transform:rotate(45deg) translateY(-2px);transition:transform .25s;}
.ischema[open] summary em::after{transform:rotate(-135deg) translateY(-2px);}
.ischema summary:hover{background:rgba(255,255,255,.03);border-radius:16px;}
.ischema summary:focus-visible{outline:2px solid #a6c4ff;outline-offset:2px;border-radius:16px;}
.ischema .itable{margin:0 24px 16px;border-bottom:0;}

/* ================================================ info pages in persistent.id's section style */
.isec{margin-top:120px!important;padding-top:0!important;border-top:0!important;}
.isec__h{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:820px;margin:0 auto;}
.ipill{display:inline-flex;align-items:center;height:30px;padding:0 14px;border-radius:9999px;background:var(--text-1);color:var(--bg);font-size:14px;font-weight:500;}
.isec__t{margin-top:16px!important;font-size:46px!important;line-height:1.08!important;font-weight:500!important;letter-spacing:-.028em!important;text-wrap:balance;}
.ipill+.isec__t{margin-top:18px!important;}
.isec__h .isec__n{margin:18px auto 0;max-width:640px;font-size:18px;line-height:1.55;color:var(--text-2);text-align:center;}
.isec>.icards,.isec>.dflow,.isec>.ibul,.isec>.itags,.isec>.iex,.isec>.icode,.isec>.ischema,.isec>.ilink{margin-top:56px!important;}
.isec>.itags{justify-content:center;}
.isec>.ilink{display:flex;justify-content:center;}
.isec>.ibul{max-width:760px;margin-left:auto;margin-right:auto;}
.isub{margin:56px 0 0!important;text-align:center;font-size:22px!important;font-weight:600;}
.isub+.isec__n{text-align:center;margin:8px auto 0;}
/* cards, as on persistent.id */
.icards{display:grid;grid-template-columns:repeat(var(--c),minmax(0,1fr));gap:14px;}
.icards .card{display:flex;flex-direction:column;min-height:0;padding:30px 28px 28px;border-radius:18px;background:rgba(255,255,255,.04);text-align:left;}
.icards .card__icon{display:block;color:var(--text-1);margin-bottom:26px;}
.icards .card__icon svg{width:32px;height:32px;display:block;}
.icards .card__name{font-size:21px;line-height:1.25;font-weight:600;letter-spacing:-.012em;color:var(--text-1);}
.icards .card__desc{margin-top:10px;font-size:16px;line-height:1.5;font-weight:500;color:#c6cddc;}
.ilead{font-size:20px;}
.istats{margin-top:56px;}
@media (max-width:900px){.icards{grid-template-columns:1fr;}.isec__t{font-size:34px!important;}.isec{margin-top:80px!important;}}
.isec .isec__h{gap:0!important;}

/* John's photo on the signed-in page panels */
.gmail.gwel{display:flex;align-items:center;gap:14px;}
.gwel .frag__avatar{flex:none;width:44px;height:44px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px rgba(159,192,255,.35);}
.gwel .frag__avatar img{display:block;width:100%;height:100%;object-fit:cover;}
.gwel>span:last-child>span{display:block;margin-top:2px;}

/* hero headline: two lines, each balanced on its own */
.hero h1>span{display:block;text-wrap:balance;}
/* ================================================ phones */
@media (max-width:900px){
  .asset,.out,.hero,.footnode,.ofocus,.ghead,.gdiag,.glic{width:calc(100vw - 32px)!important;}
  .hublabel{width:calc(100vw - 32px)!important;}
  .jump{display:none!important;}
  .top{min-height:70px;}
  .hero__logo{width:220px;}
  .hero h1{margin-top:26px;font-size:36px;line-height:1.08;letter-spacing:-.028em;}
  .hero h1>span+span{margin-top:6px;color:var(--text-2);}
  .hero p{font-size:17px;}
  .what{font-size:30px;}
  .art{height:250px;}
  .dhd .bigicon{width:64px;height:64px;border-radius:20px;}
  .dhd .bigicon svg{width:32px;height:32px;}
  .dhd .dt{font-size:32px!important;}
  .dpage{padding:20px 16px 72px!important;}
  .dtile{padding:24px 4px!important;}
  .gx{height:210px;}
  .istats{grid-template-columns:1fr 1fr!important;gap:22px 16px;}
  .istats b{font-size:32px;}
  .isec__t{font-size:30px!important;}
  .isec{margin-top:80px!important;}
  .icards .card{padding:24px 22px;}
  .ischema .itable{margin:0 16px 12px;}
  .ischema summary{padding:18px 18px;}
  .icode{font-size:12px;padding:16px;}
  .dfl{align-items:flex-start;text-align:left;display:grid;grid-template-columns:52px 1fr;column-gap:16px;}
  .dfl__n{grid-row:span 3;width:52px!important;height:52px!important;}
  .dfl__n svg{width:22px!important;height:22px!important;}
  .dfl b{margin-top:2px!important;}
  .dfl>span:not(.dfl__n){max-width:none;}
  .dflow{gap:28px!important;}
}

.nw{white-space:nowrap;}
/* Back and Close: below the nav bar, clear labelled buttons */
.zbtn{top:100px;height:48px;border-radius:999px;font-size:16px;font-weight:600;box-shadow:0 12px 30px -10px rgba(0,0,0,.8);}
.zback{left:24px;padding:0 20px 0 16px;background:var(--text-1);color:var(--bg);}
.zback:hover{background:#e3e8f1;}
.zclose{right:24px;width:auto;padding:0 20px 0 16px;gap:8px;background:#0b1c55;color:var(--text-1);box-shadow:0 0 0 1px rgba(159,192,255,.35),0 12px 30px -10px rgba(0,0,0,.8);flex-direction:row-reverse;}
.zclose:hover{background:#142e6b;}
.dpage{padding-top:104px!important;}
@media (max-width:900px){
  .zbtn{top:82px;height:44px;font-size:15px!important;gap:6px!important;}
  .zback{left:14px;padding:0 16px 0 12px!important;}
  .zclose{right:14px;padding:0 16px 0 12px!important;width:auto!important;}
  .dpage{padding-top:76px!important;}
  /* phones: nothing tilted or angled */
  .art{perspective:none;}
  .art .sfrag,.a0 .art .sfrag,.a2 .art .sfrag,.asset:hover .art .sfrag{transform:none!important;}
  .stack__card,.stack__card--1,.stack__card--2,.stack__card--3{transform:none!important;filter:none!important;}
  .dart .dfrag,.dtile:hover .dart .dfrag{transform:none!important;}
  .rec__who>span{white-space:normal!important;}
}

/* ================================================ PII Graph drill-down */
.dtiles3 .dtiles{grid-template-columns:repeat(3,minmax(0,1fr));}
.dtiles3 .dtile:nth-child(3n+1){border-left:0;}
.dtiles3 .dtile:nth-child(n+4){border-top:1px solid rgba(255,255,255,.08);}
/* plain tables with their own columns */
.gt{margin-top:40px;border-radius:16px;background:#0b1135;box-shadow:0 0 0 1px rgba(255,255,255,.08);overflow-x:auto;}
.gt__in{min-width:760px;padding:6px 24px 12px;}
.gt__r{display:grid;grid-template-columns:1.5fr repeat(calc(var(--n) - 1),minmax(0,1fr));gap:16px;align-items:center;padding:14px 0;border-top:1px solid rgba(255,255,255,.07);}
.gt__r--h{border-top:0;padding:14px 0 10px;font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);}
.gt__r b{font-size:15px;font-weight:600;color:var(--text-1);overflow-wrap:anywhere;}
.gt__r span{font-size:15px;line-height:1.45;color:var(--text-2);}
.gt__tag{display:inline-flex;font-style:normal;font-size:13px;font-weight:600;padding:5px 10px;border-radius:999px;}
.gt__tag--ok{color:#8ff0c0;background:rgba(61,214,140,.12);}
.gt__tag--no{color:#ffb4b4;background:rgba(255,99,99,.12);}
.gt__tag--mid{color:#cfe0ff;background:rgba(159,192,255,.14);}
.isec>.gt+.isec__n{margin-top:18px;text-align:left;max-width:none;}
/* before and after */
.ba{display:grid;grid-template-columns:minmax(0,1fr) 56px minmax(0,1fr);align-items:stretch;margin-top:40px;}
.ba__c{padding:24px 26px;border-radius:16px;background:rgba(255,255,255,.04);}
.ba__c--on{background:#0f2459;box-shadow:0 0 0 1px rgba(159,192,255,.35);}
.ba__l{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.ba__badge{font-style:normal;font-size:12px;letter-spacing:.04em;padding:4px 9px;border-radius:999px;color:#8ff0c0;background:rgba(61,214,140,.14);text-transform:none;}
.ba__v span{display:block;font:15px/1.7 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--text-1);}
.ba__c:not(.ba__c--on) .ba__v span{color:var(--text-2);}
.ba__note{margin:14px 0 0;font-size:14px;color:var(--text-2);}
.ba__arrow{display:grid;place-items:center;color:#9fc0ff;}
/* three labelled columns of chips */
.c3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px;}
.c3__l{margin:0 0 12px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--eyebrow);}
.c3__chip{padding:14px 16px;margin-top:8px;border-radius:12px;background:rgba(255,255,255,.04);}
.c3__chip b{display:block;font-size:15px;font-weight:600;color:var(--text-1);overflow-wrap:anywhere;}
.c3__chip span{display:block;margin-top:3px;font-size:14px;color:var(--text-2);}
.c3__chip--on{background:#0f2459;box-shadow:0 0 0 1px rgba(159,192,255,.35);}
.c3__chip--ok{box-shadow:inset 3px 0 0 #3dd68c;}
.c3__chip--no{opacity:.6;box-shadow:inset 3px 0 0 #ff7a7a;}
/* funnel of counts */
.fun{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:40px;}
.fun__s{padding:22px 20px;border-radius:16px;background:rgba(255,255,255,.04);}
.fun__s:last-child{background:#0f2459;box-shadow:0 0 0 1px rgba(159,192,255,.35);}
.fun__s b{display:block;font-size:40px;line-height:1;font-weight:700;letter-spacing:-.03em;color:var(--text-1);}
.fun__s span{display:block;margin-top:10px;font-size:15px;line-height:1.4;color:var(--text-2);}
/* timeline */
.tl{list-style:none;margin:40px 0 0;padding:0;}
.tl li{display:grid;grid-template-columns:110px minmax(0,1fr);gap:24px;padding:20px 0;border-top:1px solid rgba(255,255,255,.08);}
.tl__y{font-size:22px;font-weight:700;letter-spacing:-.02em;color:#9fc0ff;}
.tl b{display:block;font-size:19px;font-weight:600;color:var(--text-1);}
.tl p{margin:6px 0 0;font-size:16px;line-height:1.55;color:var(--text-2);}
/* phase cards */
.ph{gap:0;}
.ph__n{display:inline-flex;align-self:flex-start;margin-bottom:16px;padding:6px 12px;border-radius:999px;background:rgba(159,192,255,.14);color:#cfe0ff;font-size:13px;font-weight:600;}
.ph__h{margin:22px 0 8px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);}
.ph__l{margin:0;padding:0 0 0 18px;font-size:15px;line-height:1.6;color:var(--text-2);}
.ph__l--sig{color:var(--text-1);}
.ph__fig{margin-top:auto;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);}
.ph__fig b{display:block;font-size:36px;line-height:1;font-weight:700;letter-spacing:-.03em;color:var(--text-1);}
.ph__fig span{display:block;margin-top:8px;font-size:14px;color:var(--text-2);}
.ph .card__desc{margin-bottom:0;}
.ph .ph__l + .ph__h{margin-top:18px;}
.icards .ph{min-height:0;}
.isec .istats{margin-top:40px;}
@media (max-width:900px){
  .dtiles3 .dtiles{grid-template-columns:1fr;}
  .dtiles3 .dtile{border-left:0!important;border-top:1px solid rgba(255,255,255,.08);}
  .ba{grid-template-columns:1fr;gap:10px;}
  .ba__arrow{transform:rotate(90deg);height:36px;}
  .c3,.fun{grid-template-columns:1fr;}
  .tl li{grid-template-columns:1fr;gap:6px;}
  .gt__in{padding:4px 16px 10px;}
}
.gt__r{grid-template-columns:minmax(210px,1.7fr) repeat(calc(var(--n) - 1),minmax(0,1fr));}
.gt__r b{overflow-wrap:normal;word-break:normal;}

/* the PII data set page: jump links, then one part per topic */
.ijump{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:40px auto 0;max-width:980px;}
.ijump button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 18px;border-radius:14px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);font-size:16px;font-weight:600;color:var(--text-1);text-align:left;transition:background .15s;}
.ijump button span{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--eyebrow);}
.ijump button:hover{background:rgba(255,255,255,.09);}
.ijump button:focus-visible{outline:2px solid #a6c4ff;outline-offset:2px;}
.ipart{margin-top:120px;padding-top:72px;border-top:1px solid rgba(255,255,255,.1);scroll-margin-top:24px;}
.ipart__h{display:flex;flex-direction:column;align-items:center;text-align:center;}
.ipart__t{margin:18px 0 0;font-size:52px;line-height:1.06;font-weight:500;letter-spacing:-.03em;color:var(--text-1);text-wrap:balance;}
.ipart>.ilead{margin-top:16px;}
.ipart .isec{margin-top:72px!important;}
.ipart .isec__t{font-size:32px!important;}
@media (max-width:900px){.ipart__t{font-size:36px;}.ipart{margin-top:80px;padding-top:56px;}.ijump button{flex:1 1 40%;}}

/* key figures shown as cards, not big stat rows */
.isec .istatc,.info>.istatc{margin-top:40px;}
.istatc .card__icon{margin-bottom:22px;}
.istatc .card__name{font-size:26px;letter-spacing:-.02em;}
.istatc .card__desc{margin-top:6px;}
@media (max-width:900px){.istatc{grid-template-columns:1fr 1fr!important;}.istatc .card__name{font-size:22px;}}
/* drill-down titles break onto two balanced lines */
.dhd .dt{max-width:11.5em;margin-left:auto;margin-right:auto;text-wrap:balance;}

/* PII data set page: contents list fixed on the left while the processes scroll */
.idoc{display:grid;grid-template-columns:232px minmax(0,1fr);gap:56px;align-items:start;margin-top:88px;
  width:min(1340px,calc(100vw - 64px));margin-left:calc(50% - min(670px,50vw - 32px));}
.itoc{position:sticky;top:176px;display:flex;flex-direction:column;gap:4px;padding-top:4px;}
.itoc__h{margin:0 0 10px 14px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--text-3);}
.itoc button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:12px 14px;border-radius:12px;font-size:16px;font-weight:600;color:var(--text-2);text-align:left;box-shadow:inset 2px 0 0 rgba(255,255,255,.08);transition:background .15s,color .15s,box-shadow .15s;}
.itoc button span{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-3);}
.itoc button:hover{background:rgba(255,255,255,.05);color:var(--text-1);}
.itoc button[aria-current="true"]{background:rgba(159,192,255,.1);color:var(--text-1);box-shadow:inset 2px 0 0 #9fc0ff;}
.itoc button[aria-current="true"] span{color:var(--eyebrow);}
.itoc button:focus-visible{outline:2px solid #a6c4ff;outline-offset:2px;}
.idoc__b>.ipart:first-child{margin-top:0;padding-top:0;border-top:0;}
.idoc .ipart{scroll-margin-top:170px;}
@media (max-width:1100px){
  .idoc{display:block;width:auto;margin-left:0;margin-top:40px;}
  .itoc{position:static;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px;}
  .itoc__h{display:none;}
  .itoc button{flex:1 1 40%;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);}
  .idoc__b>.ipart:first-child{margin-top:72px;padding-top:56px;border-top:1px solid rgba(255,255,255,.1);}
  .idoc .ipart{scroll-margin-top:140px;}
}

/* PII level 1: phases rising into the graph */
.gbarc{position:absolute;bottom:0;width:31%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px 14px 12px;border-radius:14px 14px 4px 4px;
  background:rgba(15,34,76,.98);box-shadow:0 0 0 1px rgba(255,255,255,.09),0 20px 36px -18px rgba(0,0,0,.9);}
.gbarc .frag__glyph{margin-bottom:6px;}
.gbarc em{font-style:normal;font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--eyebrow);}
.dtile .gx .gbarc b,.gbarc b{font-size:15px!important;font-weight:600!important;line-height:1.3!important;color:var(--text-1);}
.gbarc--on{background:#142e6b;box-shadow:0 0 0 1px rgba(159,192,255,.45),0 20px 36px -18px rgba(0,0,0,.9);}
.gbarc--on .frag__glyph{background:var(--blue,#0055ff);}
/* PII level 1: one record, identifiers around it */
.gc--pt{padding-right:16px;}
.gc--hub{padding:14px 20px 14px 14px;}
.gc--hub .frag__avatar{width:40px;height:40px;}
@media (max-width:900px){.gbarc{padding:12px 10px 0;}.dtile .gx .gbarc b,.gbarc b{font-size:13px!important;}}