/* MANTA APPARELS — premium visual system. Presentation only; no API, routes or data logic. */
:root{
 --manta-navy:#08284f;--manta-navy-deep:#061b37;--manta-blue:#1767b5;--manta-sky:#39a9e8;
 --manta-gold:#c69a4b;--manta-ink:#152b45;--manta-muted:#71839a;--manta-line:#e1e9f1;
 --manta-bg:#f4f7fa;--manta-white:#fff;--manta-radius:20px;--manta-shadow:0 12px 34px rgba(8,40,79,.075)
}
html{scroll-behavior:smooth;background:var(--manta-bg)}
body{background:linear-gradient(180deg,#edf3f8 0,#f7f9fb 340px,#f4f7fa 100%);color:var(--manta-ink);font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.app{width:100%;max-width:1280px;margin:0 auto;background:transparent;box-shadow:none;min-height:100vh}
.top{min-height:76px;padding:12px clamp(16px,3vw,38px);background:rgba(6,27,55,.97);border-bottom:1px solid #ffffff1c;box-shadow:0 7px 24px #061b3720;backdrop-filter:blur(18px)}
.top .brand-wrap{display:flex;align-items:center;min-width:0}.top .brandmark{width:190px;height:48px;max-width:42vw;object-fit:contain;object-position:left center;border-radius:0;background:transparent}
.top-actions{gap:10px}.top .lang-toggle,.top .icon{height:42px;min-width:42px;border:1px solid #ffffff35;border-radius:13px;background:#ffffff12;color:#fff}.top .lang-toggle{padding:0 14px;font-size:12px;font-weight:800}
.page{padding:26px clamp(15px,3vw,38px) 120px}.page.home-page{padding-top:24px}
.hero.hero-carousel{height:clamp(250px,34vw,410px);min-height:250px;padding:clamp(24px,4vw,54px);border:1px solid #d8e5f1;border-radius:26px;background:#08284f;box-shadow:0 18px 46px #09294d26;isolation:isolate}
.hero.hero-carousel .hero-banner-image{object-fit:cover;object-position:center;width:100%;height:100%;inset:0;filter:saturate(.95)}
.hero.hero-carousel.has-banner-image:before{content:"";display:block;position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(4,25,50,.84) 0%,rgba(5,35,68,.66) 43%,rgba(5,35,68,.08) 100%)!important;opacity:1!important}
.hero.hero-carousel.has-banner-image:after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(4,23,45,.48),transparent 45%)!important;opacity:1!important}
.hero-carousel .hero-copy{z-index:3;max-width:min(58%,650px)}.hero-carousel .eyebrow{font-size:11px;letter-spacing:2px;color:#e3c88f;font-weight:900}.hero-carousel h1{max-width:650px;margin:13px 0 10px;font-size:clamp(28px,4.2vw,52px);line-height:1.08;letter-spacing:-1.1px;font-weight:850}.hero-carousel p{max-width:570px;font-size:clamp(13px,1.25vw,16px);line-height:1.7;color:#e6eef7}
.hero-carousel .hero-btn{margin-top:18px;padding:13px 20px;border-radius:12px;background:#fff;color:var(--manta-navy);font-size:13px;font-weight:850;box-shadow:0 9px 22px #00162c40}.hero-carousel .hero-visual{display:none}.banner-footer{z-index:4;bottom:16px;left:clamp(24px,4vw,54px);right:clamp(24px,4vw,54px);color:#fff}.banner-footer>span{font-size:11px;letter-spacing:.4px}.banner-dots{gap:7px}.banner-dot{width:9px;height:9px;border:1px solid #fff;background:#ffffff55}.banner-dot.on{width:27px;border-radius:20px;background:#e3c88f;border-color:#e3c88f}
.quick-actions{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:20px 0}.quick-action{min-height:92px;display:flex;align-items:center;justify-content:flex-start;gap:14px;padding:18px 20px;border-radius:17px;border:1px solid var(--manta-line);background:#fff;box-shadow:0 5px 18px #09294d0b;color:var(--manta-ink);transition:transform .2s,box-shadow .2s,border-color .2s}.quick-action:hover{transform:translateY(-3px);box-shadow:var(--manta-shadow);border-color:#c7d8e8}.quick-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;font-size:21px;flex:0 0 46px;box-shadow:none}.quick-action b{font-size:13px;font-weight:850}
.overview-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.overview-card{min-height:136px;padding:21px 22px;border:1px solid var(--manta-line);border-radius:19px;background:#fff;box-shadow:0 5px 18px #09294d0a}.overview-card.balance-card{background:linear-gradient(130deg,#fff,#edf5fb);border-color:#d4e3f0}.overview-label{font-size:12px;color:#6b7f95}.overview-label i{width:30px;height:30px;border-radius:10px;background:#e8f0f7;color:var(--manta-blue)}.overview-card strong{font-size:27px;color:var(--manta-navy);letter-spacing:-.7px}.overview-card small{font-size:11px;color:#8795a6}.overview-card>button{width:36px;height:36px;border-radius:11px;background:var(--manta-navy);box-shadow:none}
.referral-card{margin-top:15px;padding:20px 22px;border:1px solid var(--manta-line);border-radius:19px;background:#fff;box-shadow:0 5px 18px #09294d0a}.referral-heading h2{font-size:16px;color:var(--manta-navy)}.referral-heading p{font-size:12px;color:var(--manta-muted)}.referral-symbol{width:42px;height:42px;border-radius:13px;background:#edf3f8;color:var(--manta-blue)}.referral-card .copybox{padding:7px;background:#f5f8fb;border:1px solid #e4ebf2;border-radius:13px}.referral-card .copybox input{border:0!important;background:transparent!important;font-size:12px}.referral-card .copybox .btn{border-radius:10px}
.section{margin-top:28px}.section-head{margin-bottom:15px}.section-head h2{font-size:clamp(19px,2vw,25px);color:var(--manta-navy);letter-spacing:-.55px}.section-kicker{font-size:10px;letter-spacing:1.8px;color:var(--manta-gold);font-weight:900}.package-count{background:#edf3f8;color:var(--manta-blue);border:1px solid #dce7f0;border-radius:30px}
.tabs.package-tabs{padding:5px;border:1px solid #dfe8f0;border-radius:13px;background:#eaf0f5;gap:5px}.tabs.package-tabs button{padding:11px 17px;border-radius:10px;color:#61758a;font-size:12px;font-weight:800}.tabs.package-tabs button.on{background:var(--manta-navy);color:#fff;box-shadow:0 5px 12px #09294d20}
.package-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.package-card-new{padding:18px;border:1px solid #e0e8ef!important;border-radius:19px!important;background:#fff!important;box-shadow:0 7px 22px #09294d0b!important;transition:transform .22s,box-shadow .22s,border-color .22s}.package-card-new:hover{transform:translateY(-3px);border-color:#c5d8e9!important;box-shadow:0 15px 35px #09294d14!important}.package-card-new .package-card-top{gap:16px;align-items:flex-start}.package-image,.package-image-fallback{width:112px;height:112px;flex:0 0 112px;border-radius:14px;background:#edf3f8}.package-main h3{margin:9px 0 5px;font-size:16px;color:var(--manta-navy)}.package-main .price{font-size:25px;color:#0c3d6e}.package-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:12px}.package-facts>span{padding:9px 8px;border-radius:11px;background:#f5f8fb;border:1px solid #eaf0f5}.package-facts small{font-size:9px;color:#7a8b9e}.package-facts b{font-size:11px;color:#233e5b}.package-buy{width:100%;margin-top:15px;border-radius:11px;min-height:43px;background:var(--manta-navy)!important;box-shadow:none!important}.package-buy:hover{background:#11477c!important}.package-buy:disabled{background:#e8edf2!important;color:#7b8998!important;opacity:1}.package-category-tag,.tag{background:#edf3f8;color:#2c628f;border:1px solid #dce8f0}
.placement-banner{border-radius:20px;min-height:165px;padding:26px;background:linear-gradient(90deg,#061e3dce,#061e3d2b),var(--placement-image) center/cover,#0a2d55;color:#fff;box-shadow:0 10px 26px #09294d1c;margin-bottom:24px}.placement-banner h2{font-size:24px}.placement-banner p{color:#e3edf6}
.card,.stat,.mini-card{border:1px solid var(--manta-line);border-radius:17px;background:#fff;box-shadow:0 5px 18px #09294d09}.card{padding:19px}.stat{padding:17px}.stat strong{color:var(--manta-navy)}
.bottom{width:100%;max-width:1280px;height:78px;bottom:0;background:rgba(255,255,255,.97);border:1px solid #e1e8ef;border-bottom:0;border-radius:18px 18px 0 0;box-shadow:0 -8px 30px #09294d0e;backdrop-filter:blur(18px);padding-bottom:env(safe-area-inset-bottom)}.bottom button{font-size:11px;color:#7a8b9e}.bottom button.active{color:var(--manta-blue)}.bottom span{font-size:21px}
.auth{background:radial-gradient(circle at 12% 8%,#2c78b544,transparent 28%),radial-gradient(circle at 92% 90%,#d0a55b30,transparent 28%),linear-gradient(145deg,#061b37,#0b3763)}.authbox{max-width:470px;border:1px solid #e0e9f1;border-radius:24px;box-shadow:0 28px 80px #00172e55}.auth-logo img{object-fit:contain}.auth-logo strong{color:var(--manta-navy)}.auth .btn{background:var(--manta-navy)}
.modal{background:#04172dcc;backdrop-filter:blur(8px)}.modal .sheet{width:min(600px,100%);border-radius:24px 24px 0 0;border:1px solid #e1e9f0;box-shadow:0 24px 80px #00162c50}.toast{background:#09294d;border-radius:12px}
/* Team workspace */
.team-dashboard{max-width:1500px;margin:0 auto;background:#f4f7fa;min-height:100vh}.team-sidebar{background:#071f3d;border-right:1px solid #ffffff12}.team-side-brand{padding:22px 20px;border-bottom:1px solid #ffffff18}.team-side-brand img{object-fit:contain}.team-side-brand span{color:#fff}.team-side-nav button{color:#c6d5e5;border-radius:11px;margin:3px 0;padding:12px 14px}.team-side-nav button:hover,.team-side-nav button.on{background:#ffffff14;color:#fff}.team-side-nav button.on{box-shadow:inset 3px 0 var(--manta-gold)}.team-side-footer{border-top:1px solid #ffffff18}.team-main{background:#f4f7fa}.team-topbar{height:76px;background:#fff;border-bottom:1px solid var(--manta-line);box-shadow:0 3px 14px #09294d07}.team-content{max-width:1200px;padding:26px clamp(14px,3vw,34px) 115px;margin:0 auto}.team-page-title{margin-bottom:18px}.team-page-title h1{color:var(--manta-navy);font-size:26px;letter-spacing:-.6px}.team-title-icon{background:#e8f0f7;color:var(--manta-blue);border-radius:14px}.team-breadcrumb{color:#8191a4}
.team-hero-banner{position:relative;isolation:isolate;min-height:210px;margin:0 0 18px;padding:28px clamp(20px,4vw,42px);display:flex;align-items:center;overflow:hidden;border-radius:22px;background:#08284f url('images/team-banner-bg.jpg') center/cover no-repeat;box-shadow:0 14px 35px #08284f20;color:#fff}.team-hero-banner:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,24,48,.94) 0%,rgba(4,24,48,.78) 47%,rgba(4,24,48,.10) 100%)}.team-hero-copy{max-width:650px}.team-hero-kicker{font-size:10px;letter-spacing:2px;color:#e4c98f;font-weight:900}.team-hero-copy h2{font-size:clamp(23px,3vw,34px);line-height:1.14;margin:10px 0 8px;color:#fff}.team-hero-copy p{max-width:530px;color:#e0eaf4;font-size:13px;line-height:1.65;margin:0}.team-hero-copy button{margin-top:15px;padding:11px 16px;border:1px solid #ffffff6b;border-radius:10px;background:#fff;color:#09294d;font-weight:850;font-size:12px}.team-hero-mark{margin-left:auto;display:grid;place-items:center;width:94px;height:94px;border-radius:25px;border:1px solid #ffffff45;background:#ffffff14;color:#fff;font-size:40px;font-weight:900;backdrop-filter:blur(8px)}.team-hero-mark span{font-size:9px;letter-spacing:2px;margin-top:-20px}
.team-invite-card,.team-panel,.team-stat-card,.team-rate{border:1px solid var(--manta-line);border-radius:17px;background:#fff;box-shadow:0 5px 18px #09294d09}.team-invite-card{padding:20px}.team-invite-label{color:#526d87}.team-invite-input{background:#f5f8fb;border:1px solid #e3ebf2;border-radius:11px}.team-invite-input button,.team-qr-btn{background:var(--manta-navy);border-radius:9px}.team-code-card{background:#f3f7fa;border:1px solid #e2eaf1;border-radius:14px}.team-stats-grid{gap:13px}.team-stat-card{padding:18px}.team-stat-card strong{color:var(--manta-navy);font-size:25px}.team-panel{padding:19px}.team-panel-head h2{color:var(--manta-navy)}.team-rate{box-shadow:none;background:#f8fafc}.team-rate strong{color:#174c7b}.team-level-tabs button{border-radius:10px}.team-level-tabs button.on{background:var(--manta-navy)}
/* Other feature pages */
.profile-cover,.pa-hero,.service-hero,.gift-checkin-hero{border-radius:20px!important;box-shadow:0 12px 28px #09294d14}.profile-menu-item,.profile-action,.notification-card,.order-card,.wd-card,.pa-list-card,.support-link-card{border-radius:15px!important;border:1px solid var(--manta-line)!important;box-shadow:0 4px 15px #09294d08!important}.notification-icon,.profile-menu-icon{border-radius:12px}.share-page-top{background:#fff;border-bottom:1px solid var(--manta-line);color:var(--manta-navy)}.share-total-card{background:linear-gradient(120deg,#08284f,#14558b)!important;border-radius:20px!important;box-shadow:0 12px 30px #09294d1f}.share-level-card{border:1px solid var(--manta-line)!important;border-radius:17px!important;box-shadow:0 5px 17px #09294d09!important}.share-claim-btn{background:var(--manta-navy)!important;border-radius:10px!important}.share-claim-btn:disabled{background:#e6edf3!important;color:#8795a3!important}
@media(min-width:800px){body{padding:0}.app{max-width:1280px;min-height:100vh}.top{position:sticky;top:0}.bottom{left:50%;transform:translateX(-50%)}.page{padding-bottom:120px}.home-page .package-list{grid-template-columns:repeat(2,minmax(0,1fr))}.team-dashboard{border-radius:0}.team-content{padding-bottom:120px}}
@media(max-width:799px){.app{max-width:100%;border-radius:0}.top{min-height:64px;padding:9px 13px}.top .brandmark{width:150px;height:42px}.page{padding:16px 13px 112px}.hero.hero-carousel{height:clamp(205px,57vw,290px);min-height:205px;padding:20px 17px 45px;border-radius:18px}.hero-carousel .hero-copy{max-width:76%}.hero-carousel h1{font-size:clamp(22px,6vw,32px)}.hero-carousel p{font-size:11px;line-height:1.5}.hero-carousel .hero-btn{padding:10px 13px;font-size:11px}.banner-footer{left:17px;right:17px;bottom:10px}.quick-actions{gap:8px}.quick-action{min-height:76px;padding:10px;display:flex;flex-direction:column;justify-content:center;gap:7px}.quick-icon{width:34px;height:34px;flex-basis:34px;font-size:17px}.quick-action b{font-size:10px}.overview-card{min-height:116px;padding:14px}.overview-card strong{font-size:20px}.referral-card{padding:14px}.package-list{grid-template-columns:1fr}.package-card-new{padding:14px}.package-image,.package-image-fallback{width:86px;height:86px;flex-basis:86px}.package-main h3{font-size:14px}.package-main .price{font-size:21px}.package-facts{gap:5px}.package-facts>span{padding:7px 5px}.package-facts small{font-size:8px}.package-facts b{font-size:10px}.team-content{padding:17px 13px 110px}.team-hero-banner{min-height:190px;padding:22px 18px;border-radius:17px;background-position:center}.team-hero-mark{width:62px;height:62px;font-size:27px;border-radius:18px}.team-hero-copy{max-width:80%}.team-hero-copy h2{font-size:23px}.team-hero-copy p{font-size:11px}.team-hero-copy button{font-size:10px;padding:9px 12px}.team-stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.team-topbar{height:62px}.team-page-title h1{font-size:21px}}
@media(max-width:420px){.top .brandmark{width:128px}.top-actions{gap:6px}.top .lang-toggle,.top .icon{min-width:36px;height:36px}.hero-carousel .hero-copy{max-width:88%}.hero-carousel h1{font-size:22px}.hero-carousel p{max-width:95%}.overview-grid{gap:8px}.overview-card{padding:12px}.overview-label{font-size:10px}.overview-card strong{font-size:18px}.team-hero-mark{display:none}.team-hero-copy{max-width:100%}.team-invite-card{padding:13px}.team-stats-grid{gap:8px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
/* Package catalogue, income history and welcome experience */
@media(min-width:800px){
 .page:has(> .package-card-new){display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;align-content:start}
 .page:has(> .package-card-new)>.placement-banner,.page:has(> .package-card-new)>.section-head,.page:has(> .package-card-new)>.tabs{grid-column:1/-1}
 .order-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.order-card{margin:0!important}
}
.devices-page .order-summary{gap:12px;margin:16px 0;padding:15px;border:1px solid var(--manta-line);border-radius:17px;background:#fff;box-shadow:0 5px 18px #09294d08}
.devices-page .order-summary>div{padding:12px;border-radius:12px;background:#f5f8fb}.devices-page .order-summary small{color:#7b8da1;font-size:10px}.devices-page .order-summary b{display:block;margin-top:5px;color:var(--manta-navy);font-size:19px}
.order-tabs{background:#eaf0f5;border:1px solid #e0e8ef;border-radius:13px;padding:5px}.order-tabs button{border-radius:9px;font-weight:800;color:#6d8094}.order-tabs button.on{background:var(--manta-navy);color:#fff}
.order-card{padding:17px!important;border:1px solid var(--manta-line)!important;border-radius:17px!important;background:#fff!important;box-shadow:0 5px 18px #09294d08!important}.order-card-head{gap:12px}.order-title h3{color:var(--manta-navy);font-size:15px}.order-metrics>div{background:#f5f8fb;border:1px solid #eaf0f5;border-radius:11px;padding:10px}.order-metrics small{font-size:9px;color:#8090a2}.order-metrics b{color:#244b70;font-size:12px}.order-details{border-top:1px solid #e9eef3;padding-top:12px;color:#71839a}.order-claim{background:var(--manta-navy)!important;border-radius:10px!important}.claim-countdown{border-radius:10px!important;background:#f3f7fa!important;color:#49647c!important}
.modal:has(.welcome-popup){align-items:center;padding:18px;background:#061b37d9;backdrop-filter:blur(9px)}.sheet:has(.welcome-popup){width:min(560px,100%);border-radius:23px;padding:0;overflow:hidden}.welcome-popup{border-radius:23px;background:#fff}.welcome-popup-head{background:linear-gradient(115deg,#061b37,#0d4778 72%,#1767a6)!important;padding:24px 52px 22px 22px!important}.welcome-popup-head span{color:#e5ca92!important}.welcome-popup-head h2{color:#fff!important;font-size:23px!important}.welcome-popup-head p{color:#dce8f2!important}.welcome-popup-head img{object-fit:contain!important;border-radius:13px!important;background:#fff!important;padding:5px}.welcome-popup-tabs button.on{background:var(--manta-navy)!important;box-shadow:0 5px 13px #08294d20!important}.welcome-info-row{border-color:#e4ebf1!important;background:#f8fafc!important;border-radius:12px!important}.welcome-info-icon{background:#eaf1f7!important;color:#155b8c!important}.welcome-info-row strong{color:#155b8c!important}.welcome-commission{background:linear-gradient(110deg,#0a3158,#1767a6)!important}.welcome-time{background:#f5f8fa!important;border-color:#dce7ef!important;color:#355a78!important}.welcome-links a{background:#edf3f8!important;color:#164e7b!important}.welcome-start{background:var(--manta-navy)!important;border-radius:11px!important;margin:0!important;padding:14px!important}
@media(max-width:799px){.page:has(> .package-card-new){display:block}.page:has(> .package-card-new)>.package-card-new{margin-bottom:13px}.order-list{display:grid;grid-template-columns:1fr;gap:12px}.devices-page .order-summary{grid-template-columns:1fr 1fr}.devices-page .order-summary>div:last-child{grid-column:1/-1}}