/* TG Proxy — Anycast-inspired visual system. Shared by public pages. */
:root, body.hero-securify {
  --bg:#080a0e; --bg-deep:#0d1118; --surface:#10141b; --raised:#171d27; --hover:#202938;
  --text:#f3f5f8; --text-2:#aeb7c6; --text-3:#8e9aae;
  --border:rgba(184,203,232,.11); --border-strong:rgba(184,203,232,.22);
  --accent:#2479ed; --accent-text:#69a8ff; --accent-hover:#398bfa;
  --accent-soft:rgba(36,121,237,.12); --accent-border:rgba(75,149,250,.4);
  --accent-border-strong:rgba(75,149,250,.55); --accent-border-mid:rgba(75,149,250,.3);
  --accent-glow-sm:rgba(36,121,237,.06); --accent-glow-md:rgba(36,121,237,.16); --accent-glow-lg:rgba(36,121,237,.22);
  --header-bg:rgba(8,10,14,.92); --hero-bg:#080a0e; --hero-fg:#f3f5f8;
  --hero-fg-soft:#aeb7c6; --hero-fg-mut:#8e9aae; --pill-bg:transparent;
  --pill-fg:#aeb7c6; --pill-border:transparent; --green:#56cb98;
  --font-display:"Onest",system-ui,sans-serif; --font-body:"Onest",system-ui,sans-serif;
  --radius:16px; --radius-sm:9px; --wrap:1200px;
  color-scheme:dark;
}
body.light, body.hero-securify.light {
  --bg:#fafbfd; --bg-deep:#edf2f8; --surface:#fff; --raised:#edf2f8; --hover:#e3ecf8;
  --text:#152033; --text-2:#536178; --text-3:#63738c;
  --border:rgba(30,57,96,.12); --border-strong:rgba(30,57,96,.24);
  --accent:#1769d5; --accent-text:#1769d5; --accent-hover:#105bc0;
  --header-bg:rgba(250,251,253,.95); --hero-bg:#fafbfd; --hero-fg:#152033;
  --hero-fg-soft:#536178; --hero-fg-mut:#63738c; --pill-bg:transparent; --pill-fg:#536178;
  --green:#258259; --green-soft:rgba(37,130,89,.09);
  color-scheme:light;
}
body, body:not(.light), body.hero-securify:not(.light){background:var(--bg);font-family:var(--font-body)}
html.tg-cursor, html.tg-cursor body{cursor:auto}
html.tg-cursor a, html.tg-cursor button, html.tg-cursor [role="button"]{cursor:pointer}
html{scroll-padding-top:96px}
body{font-size:16px}
.wrap{max-width:var(--wrap);padding:0 32px}
/* The opening viewport is deliberately separate from the catalogue. */
.hero-screen{display:flex;flex-direction:column;height:auto;min-height:100vh;min-height:100svh;overflow:hidden;padding:0;background:var(--hero-bg);isolation:isolate}
.hero-screen .hero-video-fallback{background:none;overflow:hidden;pointer-events:none}
.hero-video-fallback::before{content:"";position:absolute;inset:-20%;background:radial-gradient(ellipse 55% 60% at 78% 15%,rgba(36,121,237,.18),transparent 75%);animation:blueDrift 18s ease-in-out infinite alternate}
.hero-nav{position:relative;flex-shrink:0;padding:0 32px;height:76px;border-bottom:1px solid var(--border);background:transparent;gap:20px}
body.light .hero-nav{background:transparent}
#site.hero-ready .hero-nav{animation:quietEnter .8s cubic-bezier(.22,1,.36,1) both}
.nav-pill,.nav-icon-btn,.nav-earn{backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:none}
.nav-brand{font-size:17px;font-weight:650;padding:0;border:0;background:none;letter-spacing:-.04em}
.nav-brand svg{color:var(--accent-text);width:23px;height:23px}
.nav-links{padding:0;border:0;background:none;gap:8px}
.nav-links a{font-size:14px;padding:27px 16px;border-radius:0;text-transform:none}
.nav-links a:hover{color:var(--text);box-shadow:inset 0 -2px var(--accent)}
.nav-icon-btn,.nav-earn-ico{border:1px solid var(--border);width:38px;height:38px;border-radius:50%;background:transparent}
.nav-cta{background:var(--accent);color:#fff;font-weight:600;padding:10px 20px;font-size:14px;text-transform:none}
.hero-fg{display:flex;align-items:center;flex:1;max-width:var(--wrap);padding:72px 32px 140px;margin:0 auto;height:auto;width:100%}
.intro-title{font-size:clamp(64px,8.5vw,116px);font-weight:400;line-height:1.06;letter-spacing:-.055em;margin:0}
.intro-line{display:block}
#introAccent{color:var(--accent-text)}
.intro-word-clip{display:inline-block;overflow:hidden;vertical-align:bottom;padding:0 .045em .16em;margin:0 -.045em -.16em}
.intro-word{display:inline-block}
#site.hero-ready .intro-word{animation:wordEnter 1s cubic-bezier(.22,1,.36,1) var(--word-delay,0ms) both}
.hero-scroll{bottom:max(30px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:44px;min-height:44px;color:var(--text-3);font-size:11px;letter-spacing:.04em;text-transform:none}
.hero-scroll svg{width:24px;height:36px}
.scroll-wheel{animation:scrollHint 2.4s ease-in-out infinite}
#site.hero-ready .hero-scroll{animation:cueEnter .8s ease .7s both}
@keyframes wordEnter{from{opacity:0;filter:blur(8px);transform:translateY(100%) rotate(2deg)}to{opacity:1;filter:blur(0);transform:translateY(0) rotate(0)}}
@keyframes quietEnter{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes cueEnter{from{opacity:0}to{opacity:1}}
@keyframes scrollHint{0%,100%{transform:translateY(0);opacity:.45}50%{transform:translateY(5px);opacity:1}}
@keyframes blueDrift{from{transform:translate3d(-3%,0,0) scale(1)}to{transform:translate3d(3%,4%,0) scale(1.08)}}
/* Catalogue: soft panels and thin borders, with colour reserved for status. */
section{padding:56px 0}
.sec-head h2,.top-sec-head h2{font-size:clamp(24px,3vw,36px);font-weight:450;letter-spacing:-.045em;text-transform:none;line-height:1.15}
.top-sec-head::after{background:var(--border)}
.top-grid{gap:16px}
.top-card,.top-card.pos1{padding:24px;border-radius:16px;background:var(--surface);gap:18px}
.top-card.pos1{border-color:var(--accent-border)}
.top-card::before{display:none}
.top-card:hover{transform:none;background:var(--raised)}
.rank{font:12px/1.5 ui-monospace,Consolas,monospace;border-radius:6px;font-weight:500}
.top-card.pos1 .rank{background:var(--accent-soft);color:var(--accent-text);border:1px solid var(--accent-border)}
.p-name-txt b,.top-card.pos1 .p-name-txt b{font-size:14px;font-weight:500}
.p-metric-lbl{font-size:12px;color:var(--text-3)}
.p-metric-val{font-size:14px;font-weight:500}
.btn{box-shadow:none;font-weight:550;border-radius:9px;min-height:44px}
.btn-primary,.feed-more-btn{background:var(--accent);color:#fff;box-shadow:none}
.btn-primary:hover{background:var(--accent-hover);box-shadow:none}
.btn-ghost{background:transparent;border:1px solid var(--border-strong);color:var(--text)}
.btn-ghost:hover{background:var(--accent-soft);border-color:var(--accent-border)}
.ping-track{height:3px;background:var(--border)}
.ping-fill{animation:none}
.plist{gap:0;border:1px solid var(--border);border-radius:16px;overflow:hidden;background:var(--surface)}
.prow{background:transparent;border:0;border-bottom:1px solid var(--border);border-radius:0;padding:20px;box-shadow:none}
.prow:last-child{border-bottom:0}
.prow:hover{background:var(--raised);transform:none}
.prow.is-bypass{border-left:2px solid var(--accent-border)}
.fdrop-btn,.feed-rkn-btn{background:var(--surface);border-color:var(--border-strong);min-height:40px}
.fdrop-btn{font-size:13px}
.feed-rkn-btn{width:40px;height:40px}
.feed-more-btn{min-width:200px;width:auto;border-radius:99px;padding:10px 28px;margin-top:12px}
.ad{border-radius:14px;background:var(--surface);box-shadow:none;border:1px solid var(--border);border-left:2px solid var(--ad-color,var(--accent))}
.ad h3{font-weight:550;letter-spacing:-.025em}
.ad p{color:var(--text-2)}
.ad .btn{min-height:40px}
.stats-band{grid-template-columns:1fr;gap:0;padding:0}
.globe-wrap{display:none}
.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:0;border:1px solid var(--border);border-radius:16px;background:var(--surface);overflow:hidden}
.stat-cell{border:0;border-right:1px solid var(--border);padding:28px}
.stat-cell:last-child{border-right:0}
.stat-cell b{font-weight:450;font-size:36px}
.stat-cell span{font-size:13px;text-transform:none}
.how-grid{gap:0;border:1px solid var(--border);border-radius:16px;overflow:hidden}
.how-card{border:0;border-right:1px solid var(--border);padding:28px;background:var(--surface)}
.how-card:last-child{border-right:0}
.how-card h3{font-weight:500;font-size:19px;text-transform:none;letter-spacing:-.025em}
.how-card p{font-size:14px;line-height:1.65;color:var(--text-2)}
.how-num{font-family:ui-monospace,Consolas,monospace;color:var(--accent-text)}
.how-ico{color:var(--accent-text);background:var(--accent-soft)}
.submit-panel{border:1px solid var(--border);padding:30px;border-radius:16px;background:var(--surface)}
.submit-text h3{font-weight:500;text-transform:none}
.submit-text p,.submit-hint{color:var(--text-2)}
.submit-row input{background:var(--bg);border-color:var(--border-strong);font-size:14px;min-height:48px}
.faq-list{max-width:850px}
.faq-q{font-family:var(--font-body);font-weight:500;font-size:16px;letter-spacing:-.01em}
.faq-item .faq-a{font-size:15px;color:var(--text-2)}
footer{border-top:1px solid var(--border);padding:28px 0 40px;color:var(--text-3)}
.share-bar-in{background:var(--surface);border-color:var(--border-strong);box-shadow:0 8px 40px rgba(0,0,0,.3);border-radius:14px}
.share-bar .btn-share{background:var(--accent);box-shadow:none}
.share-sheet-in,.px-modal-card{background:var(--surface);border-color:var(--border-strong)}
.px-modal[hidden]{display:none}
.boot-loader{background:var(--bg)}
.logo-mark{background:var(--accent);box-shadow:none}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .75s cubic-bezier(.22,1,.36,1),transform .75s cubic-bezier(.22,1,.36,1)}
.reveal.is-in{opacity:1;transform:none}
a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent-text);outline-offset:4px}
@media(max-width:1000px){
  .nav-links a{padding:27px 10px}
  .nav-cta{display:none}
  .top-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .top-card,.top-card.pos1{padding:18px}
}
@media(max-width:760px){
  .wrap{padding:0 20px}
  .hero-nav{height:68px;padding:0 20px;gap:12px}
  .nav-links{display:none}
  .nav-brand{font-size:16px;padding:0}
  .nav-right{gap:6px}
  .nav-icon-btn,.nav-earn-ico{width:36px;height:36px;padding:0}
  .hero-fg{padding:64px 20px 130px}
  .intro-title{font-size:clamp(44px,12.8vw,84px);line-height:1.12}
  .top-grid{grid-template-columns:1fr}
  .top-card,.top-card.pos1{padding:22px}
  #feedSection .sec-head{flex-wrap:wrap;gap:18px}
  #feedSection .feed-controls{width:100%;margin-left:0;flex:none;justify-content:flex-start}
  .fdrop{flex:1}
  #feedSortDrop{flex:1.4}
  .fdrop-btn{width:100%;max-width:none;font-size:13px}
  .prow{padding:20px}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat-cell{padding:22px;border-bottom:1px solid var(--border)}
  .stat-cell:nth-child(2){border-right:0}
  .stat-cell:nth-last-child(-n+2){border-bottom:0}
  .stat-cell b{font-size:30px}
  .how-grid{grid-template-columns:1fr}
  .how-card,.how-card:last-child{padding:24px;border-right:0;border-bottom:1px solid var(--border)}
  .how-card:last-child{border-bottom:0}
  .submit-panel{padding:22px}
  section{padding:38px 0}
}
@media(max-height:480px) and (min-width:761px){.hero-fg{padding:40px 32px 100px}.intro-title{font-size:64px}.hero-scroll{bottom:16px}}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  #site.hero-ready .intro-word,#site.hero-ready .hero-nav,#site.hero-ready .hero-scroll,.scroll-wheel,.hero-video-fallback::before{animation:none;opacity:1;filter:none;transform:none}
  #site.hero-ready .hero-scroll{transform:translateX(-50%)}
  .reveal,.reveal.is-in{opacity:1;transform:none;transition:none}
}
/* Earn: same restrained visual language as the catalogue, without a separate
   floating "promo" panel. */
.earn-page .page-nav{border-bottom:1px solid var(--border);background:var(--header-bg);height:76px;padding:0 32px;align-items:center}
.earn-page .site-main{padding-top:76px;background:var(--bg)}
.earn-page .wrap-content{max-width:1200px;padding:0 32px}
.earn-page .tk-hero{min-height:390px;padding:82px 0 66px;background:none;overflow:hidden}
/* No large hero glow here: it produced a visible rectangular edge on wide screens. */
.earn-page .tk-hero::before{display:none}
.earn-page .tk-line{max-width:850px;font-weight:400;font-size:clamp(46px,6vw,78px);line-height:1.07;text-transform:none;opacity:1;animation:none}
.earn-page .tk-l2{margin-left:0;color:var(--accent-text)}
.earn-page .tk-sub{max-width:560px;opacity:1;animation:none;font-size:16px;line-height:1.6}
.earn-page .tk-canvas{display:none}
.earn-page .section{max-width:760px;padding:0 0 64px}
.earn-page .card{background:var(--surface);border-color:var(--border-strong);border-radius:16px;box-shadow:none}
.earn-page .card:hover{border-color:var(--accent-border)}
.earn-page .card-title,.earn-page .contact-left h3{text-transform:none;font-weight:500}
.earn-page .card-title{font-family:var(--font-body);font-size:24px;letter-spacing:-.04em}
.earn-page .contact{background:var(--surface);border-color:var(--border-strong);border-radius:16px;box-shadow:none}
.earn-page .btn-tg{background:var(--accent);box-shadow:none}
.earn-page footer .wrap-content{max-width:1200px;padding:0 32px}
@media(max-width:760px){
  .earn-page .page-nav{height:68px;padding:0 20px}
  .earn-page .site-main{padding-top:68px}
  .earn-page .wrap-content,.earn-page footer .wrap-content{padding:0 20px}
  .earn-page .tk-hero{min-height:330px;padding:54px 0 48px}
  .earn-page .tk-line{font-size:clamp(40px,12vw,60px);line-height:1.1}
  .earn-page .tk-sub{font-size:15px}
  .earn-page .section{padding-bottom:44px}
  .earn-page .card-title{font-size:21px}
}
