@import "https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800&display=swap";:root{color:#182b38;font-synthesis:none;background:#f3f7f8;font-family:Vazirmatn,Tahoma,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(at 90% 15%,#dcf5f5,#0000 45%);margin:0}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.6;cursor:wait}main{max-width:1220px;margin:auto;padding:30px 38px}header{border-bottom:1px solid #d9e4e8;justify-content:space-between;align-items:center;padding-bottom:26px;display:flex}.brand{color:#173644;letter-spacing:2px;align-items:center;gap:12px;font-weight:800;text-decoration:none;display:flex}.brand small{letter-spacing:1.4px;border-left:1px solid #bdced4;padding-left:12px;font-size:9px}.logo{color:#fff;background:#0c9ea8;border-radius:12px;place-items:center;width:38px;height:38px;display:grid}.private{color:#48747e;font-size:12px}.heading{padding:48px 0 30px}.eyebrow,.step{letter-spacing:1px;color:#527c84;font-size:11px}.eyebrow:before{content:"";vertical-align:middle;background:#0ca6ad;width:24px;height:2px;margin-left:10px;display:inline-block}h1{margin:14px 0;font-size:45px;font-weight:800;line-height:1.6}h1 em{color:#099da5;font-style:normal}p{color:#71848d;font-size:13px;line-height:1.95}h2{margin:7px 0 20px;font-size:21px}.workspace{grid-template-columns:1fr 320px;gap:24px;display:grid}.panel{background:#fff;border:1px solid #e0e9ec;border-radius:22px;padding:26px;box-shadow:0 12px 40px #254e6105}.panelTitle{justify-content:space-between;align-items:center;display:flex}.count{background:#f0f5f6;border-radius:20px;padding:5px 14px;font-size:12px}.grid{grid-template-columns:repeat(4,1fr);gap:12px;display:grid}.country{text-align:right;color:#263d48;background:#fcfdfd;border:1px solid #e2e9ed;border-radius:14px;padding:16px 12px;transition:all .2s}.country:hover{border-color:#70c9ce;transform:translateY(-3px)}.country.selected{background:#ecfaf9;border:2px solid #0ca5ad;padding:15px 11px}.top{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.flag{font-size:31px}.radio{border:1px solid #cad6da;border-radius:50%;width:14px;height:14px}.selected .radio{border:4px solid #0aa4ac}.country strong,.country small,.status{display:block}.country strong{font-size:16px}.country small{letter-spacing:1px;color:#8b9da5;margin:5px 0 22px;font-size:8px}.status{color:#89969b;font-size:9px}.status:before{content:"•";color:#c2a36d;margin-left:5px}.destination{background:#f2f7f7;border-radius:10px;padding:10px;font-size:13px}.ip{text-align:center;color:#66848d;padding:30px 0 12px;font-family:monospace;font-size:24px}.primary{color:#fff;background:#0c9ea8;border:0;border-radius:12px;width:100%;margin:12px 0 0;padding:15px;font-weight:700;box-shadow:0 7px 18px #089ba421}.primary:hover{background:#078b94}.copy{color:#008892;background:#edf8f8;border:1px solid #b9e7e7;border-radius:12px;width:100%;margin-top:10px;padding:10px}.note{border-top:1px solid #e5edef;margin-top:24px;padding-top:20px}.note strong{font-size:12px}.note p{margin-bottom:0;font-size:11px}.hint{gap:12px;padding:12px 9px;display:flex}.hint span{color:#099da5;font-size:25px}.hint p{font-size:11px}.logout{color:#738992;background:0 0;border:0;font-size:12px}.error{color:#a15a2c;background:#fff5e9;border-radius:10px;padding:10px;font-size:12px}footer{color:#91a1a8;letter-spacing:1px;border-top:1px solid #dbe5e9;justify-content:space-between;margin-top:50px;padding:22px 0;font-size:10px;display:flex}.login{max-width:440px;margin:auto}.login label{font-size:12px;display:block}.login input{border:1px solid #cbdcdf;border-radius:10px;outline-color:#0b9da6;width:100%;margin:8px 0;padding:12px}:focus-visible{outline-offset:3px;outline:3px solid #3cbdc7}@media (max-width:1000px){.grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:700px){main{padding:20px}.brand small{display:none}.heading{padding-top:28px}h1{font-size:33px}.workspace{grid-template-columns:1fr}.panel{padding:20px}.country{padding:18px}.country.selected{padding:17px}.top{margin-bottom:12px}.country small{margin-bottom:15px}footer{font-size:8px}.heading p{font-size:12px}}.summary{align-items:center;gap:25px;margin-bottom:24px;display:flex}.summary>div{flex:1}.summary strong{color:#099da5;font-size:26px;display:block}.summary span{color:#70858c;font-size:11px}.summary button{width:auto;margin:0}.sources{margin-top:25px}.sourceLinks{flex-wrap:wrap;gap:12px;display:flex}.sourceLinks a{color:#087f88;background:#ecf7f7;border-radius:8px;padding:8px 12px;font-size:12px;text-decoration:none}.notice{color:#266c5b;background:#e0f5ef;border-radius:12px;padding:16px}@media (max-width:700px){.summary{flex-wrap:wrap;gap:15px}.summary>div{min-width:25%}.summary button{width:100%}.summary strong{font-size:22px}}.personalDns{margin-bottom:28px}.subscriptionForm{grid-template-columns:2fr 1fr 1.4fr;align-items:end;gap:16px;margin-top:24px;display:grid}.subscriptionForm label,.generatedLink label{color:#4b6d78;font-size:12px}.subscriptionForm input,.generatedLink input{color:#1a4654;width:100%;font:inherit;background:#f9fbfc;border:1px solid #cfdee2;border-radius:10px;margin-top:7px;padding:12px;display:block}.subscriptionForm .primary{grid-column:1/-1;max-width:310px}.generatedLink{background:#f0f9f9;border-radius:15px;margin-top:24px;padding:18px}.generatedLink input{font-family:monospace;font-size:13px}.linkActions{gap:12px;display:flex}.dnsGuide{border:1px solid #e1eaed;border-radius:12px;margin-top:22px;padding:16px}.dnsGuide summary{cursor:pointer;font-size:13px}.subscriptionList{gap:10px;display:grid}.subscriptionRow{border:1px solid #e0eaed;border-radius:12px;align-items:center;gap:14px;padding:16px;display:flex}.subscriptionRow>div{flex:1}.subscriptionRow strong{font-size:13px;display:block}.subscriptionRow small{color:#718992;margin:7px 0;font-size:11px;display:block}.subscriptionRow code{color:#8c9da3;font-size:10px}.revoke{color:#9e573c;background:#fff2ee;border:0;border-radius:8px;padding:9px 12px;font-size:11px}.revoke:disabled{opacity:.4;cursor:default}.personalDns h3{margin-top:24px;font-size:16px}.personalDns>.notice{font-size:12px;line-height:2}@media (max-width:700px){.subscriptionForm{grid-template-columns:1fr 1fr}.subscriptionForm label:first-child{grid-column:1/-1}.subscriptionForm .primary{max-width:none}.subscriptionRow{flex-wrap:wrap}.subscriptionRow>div{min-width:65%}.linkActions{flex-direction:column;gap:0}}
