*{box-sizing:border-box}html{background:#07131e}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#0e2a44;background:#0b1720}a{color:#0b68c9}.site-shell{width:min(1280px,calc(100% - 18px));margin:8px auto 24px;border:2px solid #27b9ff;border-radius:12px;overflow:hidden;background:#eef7fb;box-shadow:0 0 24px rgba(0,156,255,.22)}
.site-header{background:linear-gradient(90deg,#06284c 0,#0a3c70 48%,#06284c 100%);color:white;border-bottom:1px solid #38bff7}.brand{padding:14px 22px 10px;display:flex;align-items:center;gap:16px;text-decoration:none;color:white}.brand-logo{font-size:54px;line-height:1;font-style:italic;font-weight:1000;letter-spacing:-4px;background:linear-gradient(#fff 12%,#89edff 52%,#18a4e7 53%,#45ffd6 90%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(0,214,255,.18)}.brand strong{display:block;font-size:22px;letter-spacing:1.5px}.brand small{display:block;font-size:14px;color:#8ef0ff;font-weight:700;margin-top:3px}.site-header nav{display:flex;justify-content:center;gap:8px;padding:0 12px;background:#06213d;border-top:1px solid rgba(255,255,255,.08)}.site-header nav a{padding:13px 18px;color:white;text-decoration:none;font-size:13px;font-weight:800}.site-header nav a:hover,.site-header nav a:first-child{background:#1789e9}.site-header nav .nav-cta{background:transparent!important;color:white!important;box-shadow:none}
.top-ad-zone{background:linear-gradient(90deg,#07335d,#0a4d84,#07335d);padding:10px 18px;border-bottom:1px solid #55c8ff}.top-ad-inner,.bottom-ad-inner{text-align:center}.top-ad-inner img,.bottom-ad-inner img{max-width:100%;height:auto;display:block;margin:auto}.ad-placeholder{width:min(468px,100%);height:60px;display:grid;place-items:center;margin:auto;border:2px dashed #a9ddff;background:rgba(4,35,66,.6);color:#c6ecff;font-size:13px;font-weight:800}.text-ad{display:block;max-width:468px;margin:4px auto 0;text-decoration:none;font-weight:800;font-size:13px;color:#d8ff67}.muted{color:#b7d8ea!important;font-weight:normal}
.page-grid{display:grid;grid-template-columns:188px minmax(0,1fr);gap:14px;padding:14px;background:#f7fbfd}.likes-column{align-self:start;background:linear-gradient(#0a4d84,#08365f);border:2px solid #37baff;border-radius:10px;padding:10px;text-align:center;color:white;box-shadow:inset 0 0 22px rgba(0,204,255,.14)}.likes-title{font-weight:900;color:white;margin-bottom:10px;font-size:19px}.likes-column img{display:block;margin:0 auto 10px;width:125px;height:125px;border:2px solid #75dbff}.like-placeholder{width:125px;height:125px;margin:auto;display:grid;place-items:center;background:linear-gradient(#103b68,#0b1e36);border:2px dashed #64cfff;color:#dff8ff;font-weight:900}.likes-mini{font-size:11px;color:#c1dced;margin-top:8px}.content-column{min-width:0}
.hero{position:relative;overflow:hidden;border:1px solid #55b9e8;border-radius:8px;min-height:342px;padding:42px 45% 36px 38px;background:#082d50 url('../img/hero-wave.jpg') right center/auto 100% no-repeat;box-shadow:inset 0 0 60px rgba(0,20,40,.25)}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,33,61,.96) 0%,rgba(3,42,76,.90) 39%,rgba(3,42,76,.18) 69%,rgba(3,42,76,0) 100%)}.hero>*{position:relative;z-index:2}.eyebrow{font-weight:900;letter-spacing:1px;color:#8ff6ff;font-size:15px}.hero h1{font-size:48px;line-height:1.01;margin:10px 0 13px;color:white;text-transform:uppercase;font-style:italic}.hero h1 span{color:#64ff7a}.hero p{max-width:590px;font-size:17px;color:#e0f5ff;line-height:1.5}.hero-badges{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0}.badge{padding:7px 11px;border-radius:999px;background:#05355b;border:1px solid #44a9e6;font-size:12px;font-weight:900;color:white}.badge.green{background:#093c28;border-color:#6aff75;color:#98ff9e}.badge.orange{background:#4a2f05;border-color:#ffb02d;color:#ffd06c}
.btn{background:linear-gradient(#67f35f,#24bf38);color:#06200b!important;border:0;border-radius:7px;padding:13px 20px;font-weight:1000;text-decoration:none;display:inline-block;box-shadow:0 2px 6px rgba(0,0,0,.22);cursor:pointer}.btn.secondary{background:linear-gradient(#1989e4,#0d64bd);color:white!important}.btn.orange{background:linear-gradient(#ffb633,#ea7911);color:#201000!important}.btn.danger{background:#8b2230;color:white!important}
.section{margin-top:14px;border:1px solid #b9d9e8;background:white;border-radius:8px;padding:20px;box-shadow:0 2px 8px rgba(26,82,112,.08)}.section h1,.section h2{color:#0a3a70;margin-top:0}.section h2{font-size:27px;margin-bottom:6px}.section-lead{color:#56798c;margin-top:0}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:17px}.step{background:linear-gradient(#f7fcff,#edf8fc);border:1px solid #b8ddec;border-radius:8px;padding:17px;min-height:150px}.step:nth-child(2){background:linear-gradient(#f3fff3,#e9faeb)}.step:nth-child(3){background:linear-gradient(#fff8ef,#fff2e4)}.step:nth-child(4){background:linear-gradient(#f8f2ff,#f1eaff)}.step-num{font-size:28px;font-weight:1000;color:#1177da}.step:nth-child(2) .step-num{color:#28a840}.step:nth-child(3) .step-num{color:#f07a13}.step:nth-child(4) .step-num{color:#7d31d1}.step strong{display:block;margin:6px 0;color:#0f4074}.step p{font-size:13px;color:#4e7186;line-height:1.45;margin:0}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;margin-top:16px;background:#d5e6ee;border:1px solid #d5e6ee;border-radius:8px;overflow:hidden}.stat{background:#f8fcfe;padding:14px;text-align:center}.stat b{display:block;font-size:24px;color:#1177da}.stat small{color:#4f7389}.notice,.success,.error{padding:14px 16px;border-radius:8px;margin:14px 0;line-height:1.5}.notice{background:#fffbe8;border:1px solid #e2ca58;color:#594d12}.success{background:#ecfff2;border:1px solid #6bcf8b;color:#145c30}.error{background:#fff0f1;border:1px solid #dc747e;color:#7d1d26}
.form{display:grid;gap:14px}.field label{display:block;font-weight:800;margin-bottom:6px;color:#173f60}.field input,.field textarea,.field select{width:100%;padding:12px;border-radius:7px;border:1px solid #9fc6d9;background:white;color:#12344f;font-size:16px}.field textarea{min-height:120px;resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th,td{padding:10px;border-bottom:1px solid #d6e6ee;text-align:left;vertical-align:top}th{color:#0b4d83;background:#edf6fa}
.bottom-ad-zone{padding:14px;background:linear-gradient(90deg,#062746,#0a4678,#062746);border-bottom:1px solid #54c9ff}.site-footer{background:#05233f;color:white}.footer-links{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;padding:16px}.footer-links a{text-decoration:none;color:#ccecff;font-size:13px}.footer-bottom{text-align:center;border-top:1px solid #1a5278;padding:14px;color:#89bad6;font-size:12px}.footer-bottom strong{color:#74e8ff}
.surf-shell{border:1px solid #7ab6d0;border-radius:8px;overflow:hidden;background:white}.surfbar{display:flex;align-items:center;gap:12px;padding:10px;background:#082d50;color:white;flex-wrap:wrap}.surfbar .timer{font-size:26px;font-weight:1000;color:#6cff73;min-width:70px}.surfbar .grow{flex:1;min-width:180px}.surf-frame{width:100%;height:640px;border:0;background:white}.surf-ad{margin-left:auto;text-align:center}.surf-ad img{max-width:320px;height:auto}.reward-box{border:2px solid #f2a122;background:#fff8e6;border-radius:10px;padding:18px;margin:16px 0}.reward-box h3{color:#a65c00;margin-top:0}.test-preview{width:100%;height:420px;border:2px solid #55a8d0;border-radius:8px;background:white}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.card{background:#f7fbfd;border:1px solid #c0dce8;border-radius:8px;padding:16px}.card h3{margin-top:0;color:#0a497f}
@media(max-width:980px){.site-header nav{flex-wrap:wrap}.page-grid{grid-template-columns:1fr}.likes-column{display:none}.hero{padding-right:35%;background-position:70% center}.steps,.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:650px){.site-shell{width:calc(100% - 8px);margin:4px auto}.brand{padding:12px}.brand-logo{font-size:42px}.brand strong{font-size:16px}.site-header nav a{padding:10px 9px;font-size:11px}.page-grid{padding:8px}.hero{padding:25px 20px;background-position:center;background-size:cover}.hero:before{background:rgba(3,34,62,.78)}.hero h1{font-size:34px}.steps,.stats,.cards,.form-row{grid-template-columns:1fr}.section{padding:16px}.surf-frame{height:520px}.surfbar{align-items:flex-start}.surf-ad{width:100%;margin-left:0}}


/* ==========================================================
   APPROVED NGS MASTER TEMPLATE — LOCKED VISUAL CHROME
   Desktop matches the approved NGS digital-wave identity.
   Mobile intentionally reflows while preserving the same theme.
   ========================================================== */

html,body{overflow-x:hidden}
body{padding-top:18px;background:#06111c}
.site-shell.approved-shell{
  width:min(1312px,calc(100% - 18px));
  margin:0 auto 28px;
  border:2px solid #21c3ff;
  border-radius:10px;
  overflow:hidden;
  background:#f8fbfd;
  box-shadow:0 0 28px rgba(0,173,255,.26)
}

/* exact approved desktop header artwork */
.approved-header{position:relative;background:#032348}
.approved-header-art{display:block;width:100%;height:auto}
.approved-nav-hotspots{position:absolute;inset:0;pointer-events:none}
.approved-nav-hotspots a{position:absolute;top:74.5%;height:24%;pointer-events:auto;border-radius:5px}
.approved-nav-hotspots a:focus-visible{outline:3px solid #7dff65;outline-offset:1px}
.ah-home{left:28.1%;width:7.4%}.ah-how{left:36.2%;width:10.5%}.ah-surf{left:47.4%;width:8.3%}.ah-advertise{left:56.3%;width:9.1%}.ah-contact{left:65.7%;width:8.2%}
.mobile-brand,.mobile-nav{display:none}

/* compact top advertising area, directly beneath nav on inner pages */
.approved-top-ad{
  padding:8px 16px 9px;
  background:
    radial-gradient(circle at 78% 30%,rgba(0,210,255,.28),transparent 26%),
    linear-gradient(105deg,#05264b,#0a4f8c 52%,#05254a);
  border-bottom:1px solid #34c5ff
}
.approved-ad-pair{
  width:min(730px,100%);
  margin:auto;
  display:grid;
  grid-template-columns:minmax(0,468px) minmax(180px,1fr);
  gap:10px;
  align-items:center;
  border:2px dashed rgba(213,239,255,.82);
  padding:4px
}
.approved-banner-slot{min-width:0;height:60px;overflow:hidden}
.approved-banner-slot img{display:block;width:468px;max-width:100%;height:60px;object-fit:fill}
.approved-banner-placeholder{height:60px;display:grid;place-items:center;text-align:center;color:white;font-weight:900;background:linear-gradient(90deg,#0576d4,#063b7c,#0576d4);border:1px solid #46d9ff}
.approved-banner-placeholder strong{color:#aaff54}
.approved-text-slot{min-width:0;text-align:center;color:#e9f8ff;line-height:1.18}
.approved-text-slot>a{display:block;color:#aaff5c;text-decoration:none;font-weight:900;font-size:14px;line-height:1.25}
.approved-text-slot strong{display:block;color:#9cff56;font-size:14px}
.approved-text-slot small{display:block;margin-top:3px;color:#fff;font-size:11px}

/* main shell: same left rail + body structure on every page */
.page-grid.approved-page-grid{
  display:grid;
  grid-template-columns:219px minmax(0,1fr);
  gap:0;
  padding:0;
  background:white
}
.approved-likes{
  min-height:690px;
  border:0;
  border-right:2px solid #19befe;
  border-radius:0;
  padding:16px 14px 24px;
  background:
    radial-gradient(circle at 40% 75%,rgba(0,190,255,.20),transparent 28%),
    linear-gradient(#073a72,#075da1 68%,#0477bf);
  box-shadow:inset -10px 0 28px rgba(0,30,80,.25);
  color:white
}
.approved-likes .likes-title{font-size:22px;margin:0 0 14px;color:white;text-shadow:0 2px 3px #02254b}
.likes-stack{display:flex;flex-direction:column;gap:12px;align-items:center}
.approved-like{display:block;width:170px;max-width:100%;padding:6px;border:1px solid #61d6ff;border-radius:7px;background:#06264f;box-shadow:0 0 9px rgba(0,210,255,.20)}
.approved-like img{display:block;width:125px;height:125px;max-width:100%;margin:auto;border:0}
.approved-like-placeholder{width:125px;max-width:100%;aspect-ratio:1/1;display:grid;place-items:center;text-align:center;border:2px dashed #6ce3ff;background:#07315f;color:white;font-weight:900}

.content-column.approved-body{
  min-width:0;
  padding:16px;
  background:linear-gradient(#fff,#f8fcff)
}
.approved-body>.section:first-child{margin-top:0}
.approved-body .section{
  border:1px solid #bfdceb;
  border-radius:8px;
  box-shadow:0 2px 8px rgba(15,74,113,.08)
}

/* footer mirrors the approved visual language */
.approved-footer{background:linear-gradient(90deg,#062a53,#073e70,#062a53);color:white;border-top:2px solid #28c6ff}
.approved-bottom-ad{
  padding:9px 16px 7px;
  background:
    radial-gradient(circle at 15% 50%,rgba(0,180,255,.18),transparent 24%),
    linear-gradient(90deg,#062a53,#073d70,#062a53)
}
.approved-footer .footer-links{padding:8px 14px 7px;gap:13px}
.approved-footer .footer-links a{color:#d7f1ff;font-size:12px}
.approved-footer .footer-bottom{padding:7px 12px 11px;color:#b8d7ea;border-top:1px solid rgba(85,199,255,.28)}
.approved-footer .footer-bottom strong{color:#6fe9ff}

/* Mobile: same NGS theme, reflowed for real phone usability */
@media(max-width:760px){
  body{padding-top:10px}
  .site-shell.approved-shell{width:calc(100% - 12px);margin:0 auto 16px;border-radius:8px}
  .approved-header-art,.approved-nav-hotspots{display:none}
  .approved-header{
    padding:14px;
    background:
      radial-gradient(circle at 90% 5%,rgba(0,220,255,.32),transparent 30%),
      linear-gradient(120deg,#05264b,#073f73,#05264b)
  }
  .mobile-brand{display:flex;align-items:center;gap:10px;color:white}
  .mobile-ngs-mark{
    font-size:42px;line-height:1;font-style:italic;font-weight:1000;letter-spacing:-3px;
    background:linear-gradient(#fff 10%,#84efff 50%,#0da5e8 52%,#4dffd8 92%);
    -webkit-background-clip:text;background-clip:text;color:transparent
  }
  .mobile-brand strong{display:block;font-size:15px;letter-spacing:.8px}
  .mobile-brand small{display:block;color:#7de8ff;font-size:10px;margin-top:2px}
  .mobile-nav{display:flex;gap:7px;flex-wrap:wrap;margin-top:12px;padding-top:10px;border-top:1px solid rgba(92,216,255,.35)}
  .mobile-nav a{flex:1 1 29%;min-width:88px;padding:9px 7px;border-radius:6px;text-align:center;text-decoration:none;background:#082d55;color:#fff;font-size:11px;font-weight:900;border:1px solid #17659a}
  .mobile-nav a:nth-child(3){background:linear-gradient(#67f35f,#25bd3c);color:#05230c}

  .approved-top-ad,.approved-bottom-ad{padding:8px}
  .approved-ad-pair{grid-template-columns:1fr;gap:5px;border-width:1px}
  .approved-banner-slot{height:auto;min-height:44px;display:grid;place-items:center}
  .approved-banner-slot img{width:min(468px,100%);height:auto;aspect-ratio:468/60}
  .approved-banner-placeholder{height:auto;min-height:50px}
  .approved-text-slot>a,.approved-text-slot strong{font-size:12px}

  .page-grid.approved-page-grid{grid-template-columns:1fr}
  .approved-likes{
    min-height:0;border-right:0;border-bottom:2px solid #19befe;padding:10px;
  }
  .approved-likes .likes-title{font-size:15px;margin-bottom:8px}
  .likes-stack{flex-direction:row;overflow-x:auto;justify-content:flex-start;padding-bottom:3px}
  .approved-like{flex:0 0 137px;width:137px;padding:5px}
  .approved-like img{width:125px;height:125px}
  .approved-like-placeholder{flex:0 0 125px}
  .content-column.approved-body{padding:10px}
  .approved-body .section{padding:15px}
  .approved-footer .footer-links{gap:9px}
  .approved-footer .footer-links a{font-size:11px}
}

@media(max-width:430px){
  .mobile-brand strong{font-size:13px}.mobile-brand small{font-size:9px}
  .mobile-ngs-mark{font-size:36px}
  .mobile-nav a{flex-basis:44%;font-size:10px}
  .approved-body h1{font-size:25px}
  .approved-body h2{font-size:22px}
  .surf-frame{height:62vh;min-height:430px}
  .table-wrap{-webkit-overflow-scrolling:touch}
}