:root{
  --happ-bg:#050a1b;
  --happ-card:#252f5a;
  --happ-card-2:#2b3563;
  --happ-text:#f5f7ff;
  --happ-muted:#c2c9e0;
  --happ-line:rgba(255,255,255,.10);
  --happ-accent:#7b22ff;
  --happ-accent-2:#b45cff;
  --happ-green:#29c471;
  --happ-blue:#4faef7;
  --happ-radius:28px;
  --happ-shadow:0 18px 50px rgba(0,0,0,.32);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(180deg,#02071a 0%,#060d24 45%,#040814 100%);color:var(--happ-text);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{text-decoration:none;color:inherit}
img{max-width:100%;height:auto;display:block}
.happ-shell,.happ-public-wrap{padding:16px}
.home-container,.profile-page-container,.happ-auth-center{max-width:760px;margin:0 auto}
.profile-page-container{max-width:820px}
.happ-public-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;max-width:820px;margin:0 auto 22px;padding:10px 0}
.happ-public-brand{display:flex;align-items:center;gap:12px;color:var(--happ-text);font-size:1.48rem;font-weight:800;min-width:0}
.happ-public-brand img{width:40px;height:40px;border-radius:50%;flex-shrink:0;object-fit:cover;box-shadow:0 0 18px rgba(122,44,255,.24)}
.happ-top-button,.btn-entry-home,.happ-main-button,.happ-plan-pay,.happ-copy,.happ-primary-action,.happ-secondary-action,.happ-green-button{background:linear-gradient(135deg,var(--happ-accent-2),var(--happ-accent));color:#fff;border:none;border-radius:18px;padding:16px 24px;font-weight:800;font-size:1.05rem;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 12px 28px rgba(123,34,255,.28)}
.happ-top-button,.btn-entry-home,.happ-main-button,.happ-plan-pay,.happ-copy,.happ-primary-action,.happ-secondary-action,.happ-green-button,.happ-modal-plan{transition:transform .16s ease,box-shadow .16s ease,filter .16s ease,background .16s ease,border-color .16s ease}.happ-top-button:hover,.btn-entry-home:hover,.happ-main-button:hover,.happ-plan-pay:hover,.happ-copy:hover,.happ-primary-action:hover,.happ-secondary-action:hover,.happ-green-button:hover,.happ-modal-plan:hover{transform:translateY(-1px);filter:brightness(1.03)}.happ-top-button:active,.btn-entry-home:active,.happ-main-button:active,.happ-plan-pay:active,.happ-copy:active,.happ-primary-action:active,.happ-secondary-action:active,.happ-green-button:active,.happ-modal-plan:active{transform:translateY(0) scale(.99)}.happ-top-button:focus-visible,.btn-entry-home:focus-visible,.happ-main-button:focus-visible,.happ-plan-pay:focus-visible,.happ-copy:focus-visible,.happ-primary-action:focus-visible,.happ-secondary-action:focus-visible,.happ-green-button:focus-visible,.happ-modal-plan:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(255,255,255,.16),0 0 0 5px rgba(122,44,255,.38)}
.happ-top-button{padding:13px 22px;border-radius:14px;font-size:1rem}
.profile-card,.happ-panel-card,.home-ad-card,.home-trusted,.happ-plan-card,.happ-instructions-box{background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.02)),var(--happ-card);border:1px solid var(--happ-line);border-radius:32px;box-shadow:var(--happ-shadow)}
.profile-card,.happ-panel-card,.home-ad-card,.home-trusted,.happ-instructions-box{padding:28px}
.hero-card{text-align:center;padding:34px 24px;position:relative;overflow:hidden}
.hero-card::before{content:"";position:absolute;inset:auto -30% -50% auto;width:300px;height:300px;background:radial-gradient(circle,rgba(125,39,255,.22),transparent 65%);pointer-events:none}
.profile-avatar{display:flex;justify-content:center;margin-bottom:14px}
.profile-avatar img,.happ-avatar-fallback{width:86px;height:86px;border-radius:50%;background:#fff;object-fit:cover;box-shadow:0 0 28px rgba(122,44,255,.26)}
.happ-avatar-fallback{background:radial-gradient(circle at 30% 30%,#c887ff,var(--happ-accent) 58%,#3a106f)}
.profile-title,.home-title{font-size:clamp(2rem,4vw,3.5rem);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin:0 0 14px}.happ-profile-name{font-size:clamp(1.6rem,4.2vw,2.75rem);line-height:1.08;overflow-wrap:anywhere;word-break:break-word;max-width:100%}
.hero-desc{color:var(--happ-muted);font-size:1.05rem;line-height:1.6;margin:0 0 8px}
.hero-entry-wrap{display:inline-flex;align-items:center;justify-content:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.10);padding:6px;border-radius:18px;margin-top:18px}
.hero-entry-btns{display:flex;align-items:center;gap:0}
.btn-entry-home{min-width:180px;padding:16px 26px;border-radius:15px}
.btn-entry-register{background:transparent;box-shadow:none;color:rgba(255,255,255,.95)}
.btn-entry-register:hover{background:rgba(255,255,255,.07)}
.hero-entry-sep{width:1px;height:28px;background:linear-gradient(to bottom,transparent,rgba(255,255,255,.35),transparent)}
.section-card{margin-top:22px}
.section-title{font-size:1.65rem;font-weight:800;margin:0 0 20px}
.home-feature-grid,.happ-plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.home-feature-card{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:24px;min-height:100%}
.home-feature-icon{font-size:2rem;margin-bottom:14px}
.home-feature-card h5{margin:0 0 10px;font-size:1.35rem;font-weight:800}
.home-feature-card p,.home-ad-card p,.home-trusted-text,.happ-panel-card p,.happ-plan-desc,.profile-site-help,.happ-instruction-text p{margin:0;color:var(--happ-muted);line-height:1.65;font-size:1rem}
.home-ad-card,.home-trusted{margin-top:22px;text-align:center}
.home-ad-card h2{margin:0 0 12px;font-size:2rem;font-weight:800}
.home-trusted-icon{font-size:2.1rem;margin-bottom:12px}
.home-trusted-text span{font-weight:800;color:#fff}
.happ-auth-page .happ-auth-center{max-width:760px}
.happ-auth-card{max-width:720px;margin:0 auto}
.happ-tag{display:inline-flex;align-items:center;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.05);color:#dbe2ff;font-size:1rem;margin-bottom:16px}
.happ-auth-card h1{margin:0 0 18px;font-size:2.2rem;font-weight:800}
.happ-auth-form label{display:block;font-size:1rem;font-weight:700;color:#fff;margin:18px 0 10px}
.happ-auth-form input,.happ-auth-form textarea,.happ-instructions-chooser select{width:100%;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.88);color:#111c33;padding:13px 16px;font-size:1rem;outline:none}
.happ-inline-link,.happ-bottom-link a{display:inline-block;margin-top:14px;color:#d6b9ff;text-decoration:underline;font-size:1rem}
.happ-main-button{width:100%;margin-top:18px}
.happ-auth-divider{display:flex;align-items:center;gap:12px;margin:22px 0 16px;color:var(--happ-muted)}
.happ-auth-divider::before,.happ-auth-divider::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.12)}
.happ-tg-box{background:rgba(79,174,247,.10);border:1px solid rgba(79,174,247,.22);border-radius:22px;padding:16px}.happ-telegram-widget{display:flex;justify-content:center;min-height:50px;overflow:hidden}.happ-telegram-widget iframe{max-width:100%!important}.happ-telegram-widget>script{display:block}
.happ-tg-title{font-size:1.1rem;font-weight:800;margin-bottom:12px}
.happ-auth-split{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:1200px;margin:0 auto}
.happ-profile-card{max-width:760px;margin:0 auto;padding:30px 28px}.happ-profile-name{max-width:100%;overflow-wrap:anywhere;word-break:break-word;line-height:1.05}
.happ-logout-inline{display:inline-flex;margin:4px auto 20px auto;color:var(--happ-muted);font-size:1rem}
.profile-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.profile-list li,.profile-sub-box,.happ-inline-bind-box{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:20px;min-width:0}
.profile-list li{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap}
.profile-label{display:block;color:var(--happ-muted);font-size:1rem;margin-bottom:8px}
.profile-value,.profile-site-email,.profile-sub-link{display:block;color:#fff;font-size:1.65rem;font-weight:800;line-height:1.25;overflow-wrap:anywhere;word-break:break-word;max-width:100%}
.profile-site-email,.profile-sub-link{font-size:1.3rem}
.profile-status{display:inline-flex;align-items:center;border-radius:999px;padding:12px 18px;font-size:1rem;font-weight:800}
.profile-status.is-active{background:rgba(41,196,113,.18);color:#8ff2b8}
.profile-status.is-expired{background:rgba(255,92,92,.15);color:#ffabab}
.profile-copy-btn,.happ-open-inline-bind{padding:12px 18px;border-radius:16px;font-size:1rem;margin-top:14px}
.happ-green-button,.happ-open-inline-bind{background:linear-gradient(135deg,#23b65d,#1d8f49)!important;box-shadow:0 10px 24px rgba(35,182,93,.24)!important;color:#fff!important;border:none!important;cursor:pointer;font-weight:700}.happ-blue-button{background:linear-gradient(135deg,#2f7cff,#2156cf)!important;box-shadow:0 10px 24px rgba(47,124,255,.22)!important;color:#fff!important;border:none!important;cursor:pointer;font-weight:700}.happ-teal-button{background:linear-gradient(135deg,#18b985,#0d8f75)!important;box-shadow:0 10px 24px rgba(24,185,133,.22)!important;color:#fff!important;border:none!important;cursor:pointer;font-weight:700}
.profile-actions-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
.happ-primary-action,.happ-secondary-action{min-width:170px;padding:15px 22px}
.happ-secondary-action{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);box-shadow:none}
.happ-modal{position:fixed;inset:0;z-index:9999}
.happ-modal[hidden]{display:none}
.happ-modal-backdrop{position:absolute;inset:0;background:rgba(3,5,12,.66)}
.happ-modal-dialog{position:relative;display:flex;align-items:center;justify-content:center;min-height:100%;padding:20px}
.happ-modal-card{width:min(100%,680px);background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.02)),var(--happ-card);border:1px solid var(--happ-line);border-radius:30px;box-shadow:var(--happ-shadow);overflow:hidden}.happ-modal-card--xs{width:min(100%,460px)}.happ-modal-card--sm{width:min(100%,520px)}.happ-modal-card--lg{width:min(100%,760px)}
.happ-modal-head{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.10)}
.happ-modal-head h3{margin:0;font-size:1.6rem;font-weight:800}
.happ-modal-close{background:transparent;border:none;color:#fff;font-size:2rem;line-height:1;cursor:pointer}
.happ-modal-body{padding:18px;max-height:min(78vh,760px);overflow-y:auto;-webkit-overflow-scrolling:touch}
.happ-modal-plan-list{display:flex;flex-direction:column;gap:12px}
.happ-modal-plan{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.10);border-radius:20px;padding:16px 18px;color:#fff;cursor:pointer}
.happ-modal-plan[disabled]{opacity:.55;cursor:not-allowed}
.happ-modal-plan-title{font-size:1.32rem;font-weight:800}
.happ-modal-plan-price{font-size:1.15rem;font-weight:700;color:#dfe4ff}
.happ-modal-plan-save{display:inline-flex;padding:7px 12px;border-radius:999px;background:rgba(41,196,113,.18);color:#9effc4;font-size:.95rem;font-weight:700}
.happ-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px}
.happ-plan-card{padding:22px;display:flex;flex-direction:column;gap:14px}
.happ-plan-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.happ-plan-name{font-size:1.3rem;font-weight:800}
.happ-plan-sub{font-size:1.15rem;color:#e0e5f6;font-weight:700;margin-top:4px}
.happ-plan-save{display:inline-flex;padding:8px 12px;border-radius:999px;background:rgba(41,196,113,.18);color:#9effc4;font-size:.92rem;font-weight:800}
.happ-plan-price{font-size:2.5rem;font-weight:900;line-height:1}
.happ-plan-desc{min-height:52px}
.happ-plan-pay{margin-top:auto;width:100%}
.happ-plan-disabled{color:var(--happ-muted);font-size:.95rem}
.instructions-head{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:18px}.happ-instructions-chooser{min-width:148px;flex:0 0 148px}.happ-modal .happ-instructions-box{background:transparent;border:none;box-shadow:none;padding:0}.happ-modal .instructions-head h3{font-size:1.55rem}.happ-modal .happ-tag{margin-bottom:10px}
.instructions-head h3{margin:10px 0 10px;font-size:1.8rem;font-weight:800}
.happ-instruction-panel{display:none}
.happ-instruction-panel.is-active{display:block}
.happ-instruction-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:16px}
.happ-instruction-gallery img{border-radius:18px;border:1px solid rgba(255,255,255,.08)}
.happ-notice{max-width:820px;margin:0 auto 16px;background:rgba(122,34,255,.18);border:1px solid rgba(180,92,255,.30);padding:15px 18px;border-radius:18px;color:#f6ebff;transition:opacity .35s ease,transform .35s ease}
.happ-notice.is-hiding{opacity:0;transform:translateY(-8px)}
.site-footer{max-width:820px;margin:34px auto 0 auto;padding:0 16px 24px;color:var(--happ-muted);text-align:center;font-size:.95rem}
.site-footer__nav{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:10px}
.site-footer__nav a{text-decoration:underline;color:var(--happ-muted)}
@media (max-width:900px){
  .happ-auth-split,.home-feature-grid,.happ-plan-grid,.happ-instruction-gallery{grid-template-columns:1fr}
  .happ-public-topbar{padding:8px 0}
}
@media (max-width:640px){
  .happ-profile-name{font-size:clamp(1.08rem,5.6vw,1.65rem)!important;max-width:100%}
  .happ-modal-card--sm{width:min(100%,460px)}
  .happ-modal-card--lg{width:min(100%,680px)}
  .happ-shell,.happ-public-wrap{padding:12px}
  .profile-card,.happ-panel-card,.home-ad-card,.home-trusted,.happ-instructions-box{padding:20px}
  .happ-public-brand{font-size:1.18rem;gap:8px}
  .happ-public-brand img{width:34px;height:34px}
  .happ-top-button{padding:11px 16px;font-size:.92rem}
  .profile-avatar img,.happ-avatar-fallback{width:72px;height:72px}
  .profile-title,.home-title{font-size:2rem}
  .hero-desc{font-size:.98rem}
  .btn-entry-home{min-width:132px;padding:13px 16px;font-size:.94rem}
  .happ-auth-card h1{font-size:1.7rem}
  .happ-auth-form label{margin:14px 0 8px}
  .happ-auth-form input,.happ-auth-form textarea{padding:12px 14px;font-size:.98rem}
  .happ-instructions-chooser{min-width:132px;flex-basis:132px}
  .happ-instructions-chooser select{padding:14px 14px;font-size:1rem;border-radius:18px}
  .profile-value,.profile-site-email,.profile-sub-link{font-size:1.08rem}
  .profile-list li{align-items:flex-start;flex-direction:column}
  .happ-modal-head h3{font-size:1.35rem}
  .happ-modal-plan-title{font-size:1.16rem}
}


/* v1.7.3: desktop payment modal smaller but vertical */
@media (min-width: 768px){
  #payment-modal .happ-modal-dialog{padding:18px}
  #payment-modal .happ-modal-card--sm{width:min(100%,580px)}
  #payment-modal .happ-modal-head{padding:16px 20px}
  #payment-modal .happ-modal-head h3{font-size:1.55rem}
  #payment-modal .happ-modal-body{padding:18px 20px 20px;max-height:none;overflow:visible}
  #payment-modal .happ-modal-plan-list{display:flex;flex-direction:column;gap:10px}
  #payment-modal .happ-modal-plan{min-height:0;padding:16px 18px;border-radius:20px;gap:6px}
  #payment-modal .happ-modal-plan-title{font-size:1.18rem;line-height:1.18}
  #payment-modal .happ-modal-plan-price{font-size:1.08rem}
  #payment-modal .happ-modal-plan-save{padding:5px 10px;font-size:.82rem}
}

.happ-copy.is-copied{filter:brightness(1.08);transform:translateY(0) scale(.98)}
.happ-bank-transfer-box{margin-top:16px;padding:18px;border-radius:18px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12)}
.happ-bank-transfer-box h4{margin:0 0 10px}
.happ-popup-message{position:fixed;inset:0;z-index:99999}
.happ-popup-backdrop{position:absolute;inset:0;background:rgba(2,6,20,.6)}
.happ-popup-card{position:relative;max-width:560px;margin:12vh auto 0;background:var(--happ-card);border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:22px;color:var(--happ-text);box-shadow:0 24px 70px rgba(0,0,0,.34)}
.happ-popup-close{position:absolute;top:14px;right:14px;background:transparent;color:var(--happ-text);border:none;font-size:28px;line-height:1;cursor:pointer}
@media (max-width: 767px){.happ-popup-card{margin:8vh 16px 0}}
