@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;650;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#080c14;--panel:#101620;--line:#242b38;--muted:#929ba9;--purple:#ae91ff;--green:#8ce3c0}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:#f2f2f7;font:15px 'DM Sans',sans-serif}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--purple);outline-offset:5px}.wrap{max-width:1200px;margin:auto;padding-inline:36px}.header{height:104px;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand{display:flex;align-items:baseline;font:700 28px 'Space Grotesk',sans-serif;letter-spacing:-1.5px}.brand>span:not(.brand-icon){font-weight:400}.brand small{font-size:17px;color:#9d8dbd;letter-spacing:-.5px}.brand-icon{color:var(--purple);font-size:30px;align-self:center;margin-right:12px}.header nav{display:flex;gap:35px;color:#a9aeba;font-size:13px}.header nav .active{color:white}.header nav span{margin-left:6px;color:#777987}.nav-cta{padding:12px 20px;border:1px solid #434052;border-radius:7px;font-size:13px}.nav-cta span{margin-left:23px;color:var(--purple)}.hero{position:relative;min-height:615px;overflow:hidden;border-bottom:1px solid #212431;background:radial-gradient(ellipse at 78% 48%,#24203b55,transparent 50%)}#particles{position:absolute;inset:0;width:100%;height:100%;opacity:.6}.hero-content{position:relative;z-index:2;padding-top:65px;pointer-events:none}.hero-content a{pointer-events:auto}.eyebrow,.kicker,.checker-top,.hero-index,.available,.result-caption{font:10px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:1.4px}.eyebrow{display:inline-flex;align-items:center;gap:10px;color:#c8badf;border:1px solid #393044;border-radius:30px;padding:10px 13px;background:#1c1628a0}.status-dot,.available i,.live i{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 10px #8ce3c044}.eyebrow .status-dot{background:var(--purple)}h1{font:500 clamp(44px,5.5vw,72px)/1.1 'Space Grotesk',sans-serif;letter-spacing:-3.4px;margin:26px 0 23px}h1>span{color:var(--purple)}.hero-content>p{color:#a0a7b5;line-height:1.85;font-size:15px}.hero-actions{display:flex;align-items:center;gap:30px;margin-top:29px}.button{border:0;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;gap:26px;padding:15px 21px;font-size:13px;font-weight:600;white-space:nowrap}.primary{color:#1b142b;background:#b59bf4;box-shadow:inset 0 1px #ffffff44}.primary:hover{background:#c5afff}.button:disabled{opacity:.6;cursor:wait}.text-link{font-size:12px;color:#babac7}.text-link span{margin-left:15px}.hero-trust{display:flex;gap:23px;font-size:10px;color:#818897;margin-top:28px}.hero-trust span::first-letter{color:var(--purple)}.hero-index{position:absolute;bottom:25px;left:max(36px,calc((100% - 1128px)/2));right:max(36px,calc((100% - 1128px)/2));color:#626d7e;font-size:9px;display:flex;justify-content:space-between}.network-globe{position:absolute;top:65px;left:58%;width:460px;height:460px;pointer-events:none}.tools-section{padding-top:54px}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:29px}.kicker{color:#b29ad2;font-size:9px;margin-bottom:13px}h2{font:500 26px/1.35 'Space Grotesk';letter-spacing:-.9px;margin:0}h2 span{color:#9299a7}.available{color:#818b9b;font-size:9px;letter-spacing:.3px}.available i{margin-right:8px;width:5px;height:5px}.tool-layout{display:grid;grid-template-columns:280px 1fr;gap:24px}.tool-tab{display:flex;align-items:center;gap:16px;width:100%;padding:22px 18px;text-align:left;background:transparent;border:1px solid transparent;color:#a0a6b3;border-radius:7px;margin-bottom:10px}.tool-tab.selected{border-color:#514364;background:linear-gradient(110deg,#241c35,#171421);color:#e1d4ff}.tool-tab span:nth-child(2){flex:1;font-size:14px;font-weight:600}.tool-tab small{display:block;font-size:10px;font-weight:400;color:#9891a7;margin-top:7px}.tool-icon{font-size:24px;font-weight:400}.coming{border-top:1px solid var(--line);margin-top:27px;padding:25px 17px}.coming>span{font:9px ui-monospace,monospace;letter-spacing:1.4px;color:#657082}.coming p{color:#7e8796;font-size:12px;margin:24px 0}.coming small{float:right}.coming-note{font-size:11px;line-height:1.8;color:#596475;margin-top:34px}.checker{background:linear-gradient(110deg,#111822,#11151f);border:1px solid #303441;border-radius:9px;overflow:hidden;box-shadow:0 18px 70px #0002}.checker-top{padding:17px 25px;border-bottom:1px solid #292e39;display:flex;justify-content:space-between;color:#aaa2be;font-size:9px}.live{color:#859488;font-size:8px}.live i{width:4px;height:4px;margin-right:7px}.checker-body{padding:26px}.checker h3{font:500 24px 'Space Grotesk';letter-spacing:-.6px;margin:0 0 10px}.checker-body>p{color:#929aaa;font-size:12px;margin:0 0 25px}.input-row{display:flex;align-items:center;gap:12px;background:#0a0f18;border:1px solid #353b48;border-radius:6px;padding:6px 6px 6px 16px}.input-row>span{color:#8490a2;font-size:25px}input{width:100%;min-width:0;background:transparent;border:0;color:#e4dfef;outline:none;font:12px ui-monospace,monospace;padding:10px 0}input::placeholder{color:#697486}.input-row .button{padding:13px 20px}.input-help{display:flex;justify-content:space-between;font-size:9px;color:#68768a;margin:12px 0 25px}.input-help button{border:0;background:transparent;color:#b59ddf;font-size:10px;padding:0}.result{border:1px solid #2d3543;background:#0c121c;border-radius:6px;padding:21px;overflow:auto}.result-caption{font-size:8px;color:#8d99ac;letter-spacing:1px;display:flex;align-items:center;gap:9px}.result-caption .status-dot{width:5px;height:5px}.ip-line{display:flex;align-items:center;gap:18px;margin:16px 0}.ip-line strong{font:500 clamp(19px,2.4vw,31px) 'Space Grotesk';letter-spacing:-.8px;overflow-wrap:anywhere}.ip-line button{color:#a6a2b6;background:#1b2230;border:1px solid #343b49;border-radius:4px;padding:5px 9px}.details{display:flex;gap:18px;flex-wrap:wrap;border-top:1px solid #242b38;padding-top:14px;font-size:10px;color:#8a96a7}.details b{color:#c2c8d2;font-weight:400}.checker-body>.privacy-note{margin:19px 0 0;font-size:9px;color:#6f7b8c}.privacy-note span{margin-right:5px}select{background:#171d29;border:1px solid #353b48;border-radius:4px;color:#cbb9ed;padding:8px;font-size:11px;max-width:80px}table{width:100%;border-collapse:collapse;font:11px/1.6 ui-monospace,monospace;margin-top:15px}td,th{text-align:left;padding:10px 8px;border-bottom:1px solid #29313d;overflow-wrap:anywhere;max-width:400px}th{color:#8f9eb0;font-weight:400}td{color:#cec7df}.error{color:#f4b5b5!important}.benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:64px;padding-bottom:55px}.feature-icon{font-size:25px;color:#ac96d5}.benefits h3{font:500 16px 'Space Grotesk';margin:17px 0 11px}.benefits p{font-size:12px;line-height:1.85;color:#7f8999;margin:0}.about{border-top:1px solid #252c38;padding-top:45px;padding-bottom:48px}.about p{color:#8b95a5;font-size:13px;line-height:1.9;max-width:600px}.domain-tag{display:inline-block;border:1px solid #30333f;border-radius:4px;padding:7px 10px;font:10px ui-monospace,monospace;color:#a89abd;margin:12px 8px 0 0}footer{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #252c38;min-height:100px;color:#707c8e;font-size:10px}footer .brand{font-size:23px;color:#ced2dc}footer .brand small{font-size:13px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(min-width:1500px){.hero{max-width:1500px;margin:auto}.network-globe{left:59%}}@media(max-width:900px){.network-globe{left:62%;opacity:.35}.hero-content{padding-top:45px}.tool-layout{grid-template-columns:215px 1fr;gap:16px}.checker-body{padding:20px}.input-row{flex-wrap:wrap}.input-row input{flex:1}.input-row .button{gap:10px}.benefits{gap:25px}}@media(max-width:650px){.wrap{padding-inline:22px}.header{height:80px}.header nav{display:none}.nav-cta{font-size:11px;padding:10px 12px}.brand{font-size:25px}.hero{min-height:580px}.hero-content{padding-top:45px}.eyebrow{font-size:8px}h1{font-size:49px;letter-spacing:-2.7px}.hero-content>p{font-size:13px}.hero-actions{gap:20px}.hero-trust{gap:12px;font-size:8px}.network-globe{left:52%;top:165px;opacity:.18;pointer-events:none}.hero-index{left:22px;right:22px;font-size:7px}.hero-index span{display:none}.section-heading{align-items:flex-start;gap:15px}h2{font-size:23px}.available{display:none}.tools-section{padding-top:35px}.tool-layout{grid-template-columns:1fr}.tool-menu{display:flex;gap:10px}.tool-tab{padding:15px 12px;gap:10px;flex:1}.tool-tab span:nth-child(2){font-size:12px}.tool-tab small{font-size:8px}.tool-tab>span:last-child{display:none}.coming{display:none}.checker-body{padding:18px}.checker h3{font-size:22px}.input-row{gap:6px;padding-left:9px}.input-row input{font-size:10px}.input-row .button{font-size:11px;padding:12px;gap:8px}.checker-top{padding:16px 18px}.benefits{grid-template-columns:1fr;margin-top:40px;gap:30px}.benefits article{padding-left:45px;position:relative}.feature-icon{position:absolute;left:22px}.benefits h3{margin-top:0}.about{padding-top:30px}footer{gap:15px;flex-wrap:wrap;padding-block:20px}footer>span:nth-child(2){display:none}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
/* The IP landing page shares the toolbox, with the visitor's address first. */
.ip-landing .hero{min-height:700px}.ip-landing .hero-content{padding-top:40px;padding-bottom:90px}.ip-landing h1{margin-top:23px}.own-ip-card{pointer-events:auto;position:relative;max-width:570px;margin-top:24px;padding:25px;background:#101620ed;border:1px solid #514364;border-radius:9px;box-shadow:0 20px 70px #0003}.own-ip-card .ip-line strong{font-size:clamp(22px,3.4vw,45px);letter-spacing:-1px}.own-ip-card .details{line-height:1.8}.ip-landing .network-globe{top:115px}.connection-section{padding-top:46px}.connection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:8px;overflow:hidden;margin:25px 0 15px}.connection-grid>div{background:var(--panel);padding:22px;min-width:0}.connection-grid dt{font-size:11px;color:var(--muted);margin-bottom:10px}.connection-grid dd{margin:0;font:14px/1.6 ui-monospace,monospace;overflow-wrap:anywhere;color:#ddd2f1}.connection-note{color:#8b95a5;font-size:12px;line-height:1.8;max-width:850px}.ip-landing .brand{letter-spacing:-1px;font-size:24px}.ip-landing .hero-actions{margin-top:20px}.retry-connection{margin-top:12px}
@media(max-width:650px){.ip-landing .hero{min-height:710px}.ip-landing .hero-content{padding-top:35px}.ip-landing .header{gap:10px}.ip-landing .header .nav-cta{font-size:10px}.own-ip-card{padding:19px}.connection-grid{grid-template-columns:1fr 1fr}.connection-grid>div{padding:16px}.connection-grid dd{font-size:12px}.ip-landing .hero-actions{flex-wrap:wrap;gap:15px}}
/* Shared, full-bleed backdrop; content keeps a comfortable reading width. */
body{isolation:isolate;background:#080c14}
.site-background{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:radial-gradient(ellipse at 15% 65%,#163a3429,transparent 55%),#080c14}
.background-glow{position:absolute;inset:-15%;background:radial-gradient(ellipse at 75% 28%,#55417e40,transparent 45%),radial-gradient(ellipse at 25% 85%,#27637824,transparent 48%)}
#particles{position:absolute;inset:0;width:100%;height:100%;opacity:.7}
.hero{max-width:none!important;background:transparent}
.wrap{max-width:1320px;padding-inline:clamp(22px,4vw,64px)}
.header{max-width:1480px}
.hero-content{max-width:1320px}
.hero-index{left:max(4vw,calc((100% - 1192px)/2));right:max(4vw,calc((100% - 1192px)/2))}
.benefits,.about,.connection-section{position:relative}
.checker{background:linear-gradient(110deg,#111822f5,#11151ff0)}
.tool-tab.selected{background:linear-gradient(110deg,#241c35ed,#171421ed)}
h1>span,h2>span,.brand .brand-icon{
  color:#b59bf4;
  background-image:linear-gradient(90deg,#8ce3c0,#91d5ff,#b59bf4,#91d5ff,#8ce3c0);
  background-size:300% 100%;
  background-position:0% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:accent-flow 12s ease-in-out infinite alternate;
}
@keyframes accent-flow{from{background-position:0% 50%}to{background-position:100% 50%}}
.result{font-size:15px;line-height:1.7}
.result-caption{font-size:11px;line-height:1.6}
table{font-size:14px;line-height:1.75;table-layout:fixed}
th:nth-child(1){width:24%}th:nth-child(2){width:12%}th:nth-child(3){width:16%}th:nth-child(4){width:48%}
td,th{padding:13px 10px;max-width:none}
td{color:#e3deed}th{color:#b4bfd0}
.result .privacy-note{font:12px/1.8 'DM Sans',sans-serif;color:#a3adbd}
.details{font-size:13px;line-height:1.8}
select{max-width:170px;font-size:12px}
@media(min-width:1500px){.network-globe{left:calc(50% + 140px)}}
@media(max-width:900px){.header nav{gap:16px}.input-row select{max-width:170px}}
@media(max-width:650px){.hero-index{left:22px;right:22px}.result{padding:16px}table{min-width:570px;font-size:14px}.header .nav-cta span{margin-left:8px}.input-row select{max-width:155px}.ip-landing .brand{font-size:21px}.hero-content{pointer-events:auto}}
@media(prefers-reduced-motion:reduce){h1>span,h2>span,.brand .brand-icon{animation:none;background-position:50% 50%}}
.input-row input{flex:1 1 180px}
@media(max-width:900px){.input-row input{flex-basis:calc(100% - 45px)}.input-row select{margin-left:auto}.input-row .button{flex:0 0 auto}}
.header nav a[aria-current="page"]{color:#d8c7ff;background:#b59bf412;box-shadow:0 2px #b59bf4;border-radius:3px;padding:8px 10px;margin:-8px -10px}
@media(max-width:650px){.header{height:auto;min-height:90px;padding-block:18px;flex-wrap:wrap;gap:22px}.header nav{display:flex;order:3;width:100%;gap:24px;overflow-x:auto;padding:10px 2px;font-size:12px;white-space:nowrap}.header nav a[aria-current="page"]{margin:0;padding:4px 8px}.header nav a{align-self:center}.header nav a:last-child{display:none}}
.ip-info-heading{font:500 21px/1.4 'Space Grotesk',sans-serif;margin:28px 0 16px;color:#f2f2f7}
.lookup-info-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin:0 0 15px}
.lookup-info-grid>div{padding:17px}
.connection-grid .isp-detail{background:linear-gradient(120deg,#23382f,#192536);grid-column:1/-1}
.connection-grid .isp-detail dt{font-size:12px;color:#b4c6bd}
.connection-grid .isp-detail dd{font:500 clamp(20px,2.5vw,29px)/1.4 'Space Grotesk',sans-serif;color:#a9edcd}
.result .connection-note{font:12px/1.8 'DM Sans',sans-serif;margin-bottom:0}
@media(max-width:650px){.lookup-info-grid{grid-template-columns:1fr}.lookup-info-grid dd{font-size:13px}.ip-info-heading{font-size:19px}}
.other-tools{margin-bottom:55px}.other-tools>p{font-size:14px;line-height:1.8;color:var(--muted)}
.other-tools-links{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:25px}
.other-tool{display:flex;align-items:center;gap:20px;padding:25px;border:1px solid #443b57;border-radius:9px;background:linear-gradient(120deg,#211b30ed,#111822ed);transition:border-color .2s,background .2s}
.other-tool:hover{border-color:#b59bf4;background:#252035}.other-tool>.tool-icon{color:var(--purple)}.other-tool>div{flex:1}.other-tool h3{font:500 20px 'Space Grotesk',sans-serif;margin:0 0 8px}.other-tool p{font-size:13px;color:var(--muted);line-height:1.7;margin:0}.other-tool>span:last-child{color:var(--purple);font-size:22px}
@media(max-width:650px){.other-tools-links{grid-template-columns:1fr}.other-tool{padding:20px}}
.header .language-switch{display:flex;gap:5px;flex:0 0 auto;padding:4px;border:1px solid #434052;border-radius:6px;font-size:11px}
.header .language-switch a{padding:6px 8px;border-radius:3px;color:#a9aeba}
.header .language-switch a[aria-current="true"]{background:#b59bf426;color:#e2d6ff}
@media(max-width:900px){.header{gap:20px}.header>nav[aria-label="Main navigation"]{gap:18px}}
@media(max-width:650px){.header .language-switch{order:0;width:auto;margin-left:auto;overflow:visible}.header .language-switch a:last-child{display:block}.header:has(.language-switch) .nav-cta{display:none}}

/* Let section content scale with the viewport, beyond the shared wrap limit. */
.tools-section,.connection-section{width:80%;max-width:none;padding-inline:0}
.tool-layout{grid-template-columns:280px minmax(0,1fr)}
.checker{min-width:0}
.connection-section .connection-note{max-width:none}
@media(max-width:900px){.tool-layout{grid-template-columns:215px minmax(0,1fr)}}
@media(max-width:650px){.tool-layout{grid-template-columns:minmax(0,1fr)}}

/* Domain wordmark and responsive network illustration. */
.brand{--brand-size:clamp(18px,2.2vw,28px);gap:10px;align-items:baseline;letter-spacing:-1px;white-space:nowrap}
.brand .brand-icon{align-self:baseline;margin-right:0;font-weight:700;font-size:var(--brand-size);line-height:1;letter-spacing:-.12em;padding-right:.12em}
.brand .brand-domain{font-weight:500;font-size:var(--brand-size);line-height:1}
.brand-domain small{font:inherit;color:inherit;letter-spacing:inherit}
/* Keep layout independent of the drawing's intrinsic dimensions. */
.hero .network-globe{position:absolute;top:65px;left:58%;width:460px;height:460px;pointer-events:none;overflow:hidden}
.network-globe>canvas{display:block;width:100%;height:100%}
.ip-landing .hero .network-globe{top:115px}
@media(min-width:1500px){.hero .network-globe{left:calc(50% + 140px)}}
@media(max-width:900px){.hero .network-globe{left:62%;opacity:.35}}
@media(max-width:650px){.hero .network-globe,.ip-landing .hero .network-globe{left:52%;top:165px;opacity:.18}}
footer .brand{--brand-size:21px}
@media(max-width:650px){.brand{--brand-size:18px;gap:8px}.header{gap:12px}}


/* Compact glass navigation, with a full-width discovery panel. */
html{scroll-padding-top:88px}
.site-header{position:sticky;top:0;z-index:50;background:#0b0e17dc;border-bottom:1px solid #ffffff0d;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.site-header .header{height:64px;min-height:0;flex-wrap:nowrap;padding-block:0;gap:28px}
.site-header .brand{--brand-size:21px}
.header .main-navigation{display:flex;align-items:center;justify-content:center;gap:36px;flex:1;width:auto;overflow:visible;order:0;padding:0;font-size:12px;white-space:nowrap}
.header .main-navigation>a,.nav-tools>summary{padding:24px 0;color:#afb2be;transition:color .2s;cursor:pointer;list-style:none}
.nav-tools>summary::-webkit-details-marker{display:none}
.header .main-navigation>a:hover,.nav-tools>summary:hover,.nav-tools[open]>summary{color:#fff}
.header .main-navigation a[aria-current="page"]{background:none;box-shadow:none;border-radius:0;margin:0;padding:24px 0;color:#e5d9ff}
.header .main-navigation>a{position:relative}
.header .main-navigation>a::after{content:'';position:absolute;bottom:15px;left:0;right:0;height:1px;background:var(--purple);transform:scaleX(0);transform-origin:left;transition:transform .25s}
.header .main-navigation>a:hover::after{transform:scaleX(1)}
.header .nav-chevron{display:inline-block;width:6px;height:6px;border-right:1px solid;border-bottom:1px solid;transform:translateY(-2px) rotate(45deg);margin-left:8px;transition:transform .3s}
.nav-tools[open] .nav-chevron{transform:translateY(1px) rotate(225deg)}
.nav-panel{position:absolute;top:100%;left:0;right:0;background:#10131cf7;border-bottom:1px solid #ffffff12;box-shadow:0 28px 45px #0005;white-space:normal;overflow:hidden}
.nav-panel-inner{max-width:1200px;margin:auto;padding:42px 36px 48px;display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:70px}
.nav-label{font-size:11px;color:#838a9a;margin:0 0 20px}
.nav-discover,.nav-shortcuts{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.header .nav-discover a,.header .nav-discover a[aria-current="page"]{font:500 28px/1.25 'Space Grotesk',sans-serif;padding:0;color:#ededf4;letter-spacing:-.8px;transition:transform .25s,color .25s}
.header .nav-discover a span{display:inline-block;font-size:18px;color:var(--purple);opacity:0;transform:translate(-8px,4px);transition:opacity .25s,transform .25s}
.header .nav-discover a:hover{transform:translateX(6px);color:#cbb7ff}
.header .nav-discover a:hover span{opacity:1;transform:translate(0,0)}
.nav-shortcuts a{font-size:13px;color:#c2c4cf;transition:color .2s}.nav-shortcuts a:hover{color:#fff}
.nav-note{border-left:1px solid #ffffff12;padding-left:35px;color:#a3a8b7}.nav-note p{font:500 22px/1.4 'Space Grotesk',sans-serif;color:#dedee9}.nav-note small{font-size:11px;line-height:1.7}
.nav-ready .nav-panel{animation:none;box-sizing:border-box}
.nav-ready .nav-tools:not(.tools-expanded) .nav-chevron{transform:translateY(-2px) rotate(45deg)}
.nav-tools[open] .nav-panel-inner>div{animation:nav-rise .45s both}.nav-tools[open] .nav-panel-inner>div:nth-child(2){animation-delay:65ms}.nav-tools[open] .nav-panel-inner>div:nth-child(3){animation-delay:120ms}
.site-header .nav-cta{font-size:11px;padding:9px 14px;border-radius:20px;background:#b59bf40a;transition:background .25s,transform .25s}.site-header .nav-cta:hover{background:#b59bf426;transform:translateY(-2px)}.nav-cta span{margin-left:12px}
.header .language-switch{border:0;background:#ffffff05;border-radius:20px;font-size:10px}.menu-toggle{display:none}
@keyframes nav-unfold{from{clip-path:inset(0 0 100%);opacity:.4}to{clip-path:inset(0);opacity:1}}
@keyframes nav-rise{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.header .main-navigation{gap:22px}.site-header .header{gap:20px}.site-header .nav-cta{display:none}.nav-panel-inner{gap:35px}}
@media(max-width:760px){
 .site-header .header{height:auto;min-height:60px;flex-wrap:wrap;gap:0;padding-inline:22px}.site-header .brand{--brand-size:19px;margin-right:auto;min-height:60px;align-items:center}.brand .brand-icon{align-self:auto}
 .site-header .header .language-switch{order:0;width:auto;margin:0 12px 0 0;padding:3px}.header .language-switch a:last-child{display:block}
 .nav-ready .menu-toggle{display:flex;position:relative;order:1;flex-direction:column;justify-content:center;gap:6px;width:36px;height:40px;padding:8px;border:0;background:none;color:white}
 .menu-toggle span{height:1px;width:20px;background:currentColor;transition:transform .3s}.menu-open .menu-toggle span:first-child{transform:translateY(3.5px) rotate(45deg)}.menu-open .menu-toggle span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
 .header .main-navigation{order:3;flex:0 0 100%;flex-direction:column;align-items:stretch;gap:0;padding:8px 0 24px;max-height:calc(100dvh - 60px);overflow-y:auto;white-space:normal}
 .nav-ready:not(.menu-open) .main-navigation{display:none}.nav-ready .main-navigation{overflow:hidden;min-height:0}
 .header .main-navigation>a,.nav-tools>summary,.header .main-navigation a[aria-current="page"]{font-size:22px;padding:15px 4px;margin:0}.header .main-navigation>a:last-child{display:block}.header .main-navigation>a::after{display:none}
 .nav-panel{position:static;background:transparent;border:0;box-shadow:none}.nav-panel-inner{display:grid;grid-template-columns:1fr;padding:12px 4px 25px;gap:28px}.nav-note{display:none}.nav-discover,.nav-shortcuts{gap:15px}.nav-label{margin-bottom:2px}.header .nav-discover a,.header .nav-discover a[aria-current="page"]{font-size:25px;padding:0}.nav-shortcuts a{font-size:15px}
}
@media(prefers-reduced-motion:reduce){.site-header *,.site-header *::after{animation:none!important;transition:none!important}}

/* Blur the page behind either navigation menu; keep the header crisp. */
.nav-backdrop{position:fixed;inset:0;z-index:40;background:rgb(4 7 14 / 24%);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .36s cubic-bezier(.22,.8,.25,1)}
.site-header.backdrop-active + .nav-backdrop{opacity:1;pointer-events:auto}
@media(prefers-reduced-motion:reduce){.nav-backdrop{transition:none}}

/* A pointer-directed holo beam, masked to each surface's border. */
.own-ip-card::after,
#connection-copy::after,
.connection-info-button::after,
.connection-cell::after,
#tools .other-tools-links a::after{
  content:"";
  position:absolute;
  inset:-1px;
  padding:2px;
  border-radius:inherit;
  pointer-events:none;
  background:conic-gradient(from var(--holo-angle,0deg),
    #e9ddff 0deg,var(--green) 16deg,transparent 65deg,
    transparent 295deg,var(--purple) 344deg,#e9ddff 360deg);
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  mask-composite:exclude;
  opacity:0;
  transition:opacity .25s ease;
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .own-ip-card.holo-active::after,
  #connection-copy.holo-active::after,
  .connection-info-button.holo-active::after,
  .connection-cell.holo-active::after,
  #tools .other-tools-links a.holo-active::after{opacity:1;filter:drop-shadow(0 0 5px #ae91ff99)}
}

.own-ip-card .ip-line{
  --ip-font-size:clamp(22px,3.4vw,45px);
  align-items:center;
}
.own-ip-card .ip-line strong{line-height:1.2}
#connection-copy{
  position:relative;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  /* Match the visible IP digits while keeping the button square. */
  width:calc(var(--ip-font-size) * .8);
  height:calc(var(--ip-font-size) * .8);
  min-width:0;
  padding:0;
  font-family:'Space Grotesk',sans-serif;
  font-size:calc(var(--ip-font-size) * .5);
  line-height:1;
  border-radius:6px;
}

#connection-ip[role="button"]{cursor:pointer}
#connection-ip[role="button"]:focus-visible{
  outline:2px solid var(--purple);
  outline-offset:5px;
  border-radius:3px;
}
@supports ((background-clip:text) or (-webkit-background-clip:text)){
  @media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
    #connection-ip[role="button"].holo-active{
      background:radial-gradient(circle 95px at var(--holo-x,50%) var(--holo-y,50%),
        #e9ddff 0%,var(--green) 25%,var(--purple) 55%,#f2f2f7 100%);
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
    }
  }
}

@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  #connection-card{
    transform:perspective(1000px) rotateX(0deg) rotateY(0deg);
    transition:transform .3s ease-out;
  }
  #connection-card.holo-active{
    transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));
    transition-duration:.12s;
  }
}

#tools .other-tools-links a{position:relative}

.site-header .header.wrap,footer.wrap{width:80%;max-width:none;padding-inline:0}

/* Contextual help for connection data. */
.connection-grid>div{position:relative;padding-right:60px}
.connection-info-button{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:32px;height:32px;padding:0;border:1px solid #343b49;border-radius:6px;background:#1b2230;color:#a6a2b6;font:20px/1 'Space Grotesk',sans-serif;cursor:pointer}
.connection-info-button:hover{color:#ddd2f1}
.connection-info-button:focus-visible,.connection-dialog-close:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.connection-dialog-open{overflow:hidden}
.connection-dialog{box-sizing:border-box;width:min(600px,calc(100% - 32px));max-height:calc(100dvh - 40px);padding:36px;border:1px solid #625778;border-radius:16px;background:var(--panel,#131926);color:#eee;box-shadow:0 30px 100px #0009;overflow:auto}
.connection-dialog::backdrop{background:#050914cf;backdrop-filter:blur(8px)}
.connection-dialog h2{font-size:clamp(22px,4vw,30px);padding-right:24px;margin:16px 0;overflow-wrap:anywhere}
.connection-dialog p{line-height:1.7}
.connection-dialog .kicker{padding-right:28px;font-size:11px}
.connection-dialog-value{font:16px/1.7 ui-monospace,monospace;color:var(--green);overflow-wrap:anywhere}
.connection-dialog-question{padding:16px;border:1px solid var(--line);border-radius:8px;background:#ffffff05;font-size:14px;overflow-wrap:anywhere}
.connection-dialog-close{position:absolute;right:14px;top:14px;width:36px;height:36px;border:1px solid #625778;border-radius:50%;background:#222438;color:#eee;font-size:25px;cursor:pointer}
@media(max-width:650px){.connection-grid>div{padding-right:52px}.connection-info-button{right:10px;top:10px}.connection-dialog{padding:25px}}

/* Reveal contextual actions only when the cell is opened. */
.connection-grid>div{padding-right:22px}
.connection-cell{isolation:isolate}
.connection-cell-toggle{border:0;padding:0 20px 0 0;background:none;color:inherit;font:inherit;text-align:left}
.connection-cell-toggle::after{content:"";position:absolute;inset:0;z-index:1;cursor:pointer;border-radius:inherit}
.connection-cell-toggle::before{content:"⌄";position:absolute;right:15px;top:18px;font-size:14px;color:var(--muted);transition:transform .2s}
.actions-open .connection-cell-toggle::before{transform:rotate(180deg)}
.connection-cell-toggle:focus-visible{outline:none}
.connection-cell:has(.connection-cell-toggle:focus-visible){outline:2px solid var(--purple);outline-offset:-3px}
.connection-grid .connection-cell-actions{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .24s ease,opacity .24s ease}
.connection-cell-actions-inner{min-height:0;overflow:hidden;display:flex;align-items:center;gap:10px;position:relative;z-index:2}
.actions-open .connection-cell-actions{grid-template-rows:1fr;opacity:1}
.connection-cell-actions .connection-info-button{position:relative;inset:auto;flex-shrink:0;margin-top:14px;margin-bottom:4px}
.connection-cell-actions .connection-action-status{font:11px/1.5 'DM Sans',sans-serif;color:var(--muted);padding-top:10px}
@media(max-width:650px){.connection-grid>div{padding-right:16px}.connection-cell-toggle::before{top:12px;right:10px}}
@media(prefers-reduced-motion:reduce){.connection-grid .connection-cell-actions,.connection-cell-toggle::before{transition:none}}