.app-bar nav a.active{color:var(--mint)}
.nav-toggle{display:none;background:transparent;border:0;color:#fff;font-size:24px;padding:6px;cursor:pointer}
.form-switch{text-align:center!important;font-size:13px!important;margin:18px 0 0!important}
.form-switch a{color:var(--teal);font-weight:800}
.phone-verification{margin:-2px 0 16px;padding:13px;background:#edf7f5;border:1px solid var(--line);border-radius:10px}.phone-verification .secondary-action{width:100%;padding:10px 13px;border:1px solid var(--teal);border-radius:8px;background:#fff;color:var(--teal);font-weight:800;cursor:pointer}.phone-verification .secondary-action:hover{background:var(--teal);color:#fff}.phone-verification .secondary-action:disabled{opacity:.55;cursor:wait}.phone-verification>small{display:block;margin-top:9px;color:var(--muted);font-size:10px;line-height:1.45}.phone-verification>small.pending{color:#805b0a}.phone-verification>small.verified{color:#087c72;font-weight:800}.phone-verification>small.verified:before{content:"✓ ";font-weight:900}.phone-verification #verification-code-row{margin-bottom:10px}.phone-verification #verification-code-row[hidden]{display:none}.phone-verification #verification-code-row label{margin:10px 0}.phone-verification #verification-code-row input{background:#fff}
.primary.compact{display:inline-flex;width:auto;padding:10px 14px;text-decoration:none;font-size:13px;white-space:nowrap}
.history-page{margin-top:0}
.recipient-field{display:block;color:#405c57;font-size:13px;font-weight:750;margin-bottom:8px}.recipient-field input{display:block;width:100%;border:1px solid #bdcec9;padding:11px;margin-top:6px}.network-filters{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px}.network-filter{border:1px solid var(--line);background:#fff;color:var(--muted);padding:8px 11px;font-weight:800;cursor:pointer}.network-filter.active{background:var(--teal);border-color:var(--teal);color:#fff}.package small{display:block;color:var(--muted);font-weight:700;margin-top:5px}

/* Subscriber bundle marketplace */
html[data-page="shop"] body{background:linear-gradient(180deg,#edf7f5 0,#f7faf9 420px)}
html[data-page="shop"] main{padding-top:34px}
html[data-page="shop"] .shop-heading{position:relative;overflow:hidden;align-items:center;margin-bottom:28px;padding:34px 38px;border:0;border-radius:22px;background:linear-gradient(120deg,#102a43 0,#0c4850 66%,#087c72 100%);box-shadow:0 18px 48px #102a4320}
html[data-page="shop"] .shop-heading:after{content:"";position:absolute;right:-75px;top:-125px;width:300px;height:300px;border:55px solid #73e2d219;border-radius:50%;pointer-events:none}
html[data-page="shop"] .shop-heading>div,html[data-page="shop"] .shop-heading>button{position:relative;z-index:1}
html[data-page="shop"] .shop-heading .eyebrow{color:var(--mint)}
html[data-page="shop"] .shop-heading h1{margin-bottom:10px;color:#fff;font-size:clamp(38px,5vw,62px)}
html[data-page="shop"] .shop-heading p{color:#c9dfe1}
html[data-page="shop"] .shop-heading .icon-button{flex:none;border-color:#ffffff55;border-radius:50%;color:#fff;background:#ffffff0d}
html[data-page="shop"] .shop-heading .icon-button:hover{border-color:var(--mint);background:var(--mint);color:var(--navy)}
html[data-page="shop"] .subscriber-profile{margin:0 0 28px;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 10px 30px #102a430b}
html[data-page="shop"] .profile-avatar{background:linear-gradient(145deg,var(--navy),var(--teal));box-shadow:0 7px 16px #102a4326}
html[data-page="shop"] .shop-layout{grid-template-columns:minmax(0,1fr) 365px;gap:24px}
html[data-page="shop"] .catalog{padding:30px;border-radius:18px;box-shadow:0 14px 38px #102a430c}
html[data-page="shop"] .section-title{margin-bottom:22px}
html[data-page="shop"] .section-title h2{font-size:27px}
html[data-page="shop"] .badge{border-radius:999px;background:#d9f1eb;color:#076b62;font-weight:800}
html[data-page="shop"] .package-search{max-width:none;margin-bottom:14px}
html[data-page="shop"] .package-search input{min-height:46px;padding:11px 14px;border-radius:11px;background:#f7faf9}
html[data-page="shop"] .package-search input:focus{box-shadow:0 0 0 3px #087c7218}
html[data-page="shop"] .network-filters{padding-bottom:17px;border-bottom:1px solid var(--line)}
html[data-page="shop"] .network-filter{border-radius:999px;padding:8px 14px;transition:.18s ease}
html[data-page="shop"] .network-filter:hover{border-color:var(--teal);color:var(--teal)}
html[data-page="shop"] .network-filter.active,html[data-page="shop"] .network-filter.active:hover{background:var(--teal);border-color:var(--teal);color:#fff;box-shadow:0 6px 14px #087c7228}
html[data-page="shop"] .bundle-group{margin-bottom:30px}
html[data-page="shop"] .bundle-group header{margin-bottom:11px;padding:0 2px 9px}
html[data-page="shop"] .bundle-group header span{font-size:13px;font-weight:800;color:var(--navy)}
html[data-page="shop"] .bundle-group-grid{gap:10px;border:0}
html[data-page="shop"] .package{position:relative;min-height:145px;padding:18px;border:1px solid var(--line);border-radius:13px;background:#fff;box-shadow:0 5px 15px #102a4308}
html[data-page="shop"] .package:hover{transform:translateY(-2px);border-color:#8bc9bf;box-shadow:0 12px 24px #102a4314}
html[data-page="shop"] .package.selected{border-color:var(--teal);background:linear-gradient(145deg,#effaf7,#fff);box-shadow:0 0 0 2px var(--teal),0 12px 24px #087c7218}
html[data-page="shop"] .package.selected:after{content:"✓";position:absolute;right:12px;top:12px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--teal);color:#fff;font-size:13px;font-weight:900}
html[data-page="shop"] .package strong{font-size:25px}
html[data-page="shop"] .package span{margin-top:22px}
html[data-page="shop"] .bundle-group{--network-color:var(--teal);--network-ink:#fff;--network-soft:#edf7f5}
html[data-page="shop"] .bundle-group.network-mtn{--network-color:#ffcc00;--network-ink:#171717;--network-soft:#fff9d6}
html[data-page="shop"] .bundle-group.network-telecel{--network-color:#e60000;--network-ink:#fff;--network-soft:#fff1f1}
html[data-page="shop"] .bundle-group.network-at{--network-color:#005baa;--network-ink:#fff;--network-soft:#eef6ff}
html[data-page="shop"] .bundle-group header{border-bottom:3px solid var(--network-color)}
html[data-page="shop"] .bundle-group header span{display:inline-flex;align-items:center;gap:8px}
html[data-page="shop"] .bundle-group header span:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--network-color);box-shadow:0 0 0 4px var(--network-soft)}
html[data-page="shop"] .bundle-group .package{border-top:4px solid var(--network-color)}
html[data-page="shop"] .bundle-group .package span{color:var(--network-color)}
html[data-page="shop"] .bundle-group.network-mtn .package span{color:#7a6100}
html[data-page="shop"] .bundle-group .package:hover{border-color:var(--network-color)}
html[data-page="shop"] .bundle-group .package.selected{border-color:var(--network-color);background:linear-gradient(145deg,var(--network-soft),#fff);box-shadow:0 0 0 2px var(--network-color),0 12px 24px #102a4314}
html[data-page="shop"] .bundle-group .package.selected:after{background:var(--network-color);color:var(--network-ink)}
html[data-page="shop"] .network-filter.network-mtn{border-color:#d8ad00;color:#6f5900}
html[data-page="shop"] .network-filter.network-telecel{border-color:#e60000;color:#b00000}
html[data-page="shop"] .network-filter.network-at{border-color:#005baa;color:#00509a}
html[data-page="shop"] .network-filter.network-mtn.active{background:#ffcc00;border-color:#ffcc00;color:#171717}
html[data-page="shop"] .network-filter.network-telecel.active{background:#e60000;border-color:#e60000;color:#fff}
html[data-page="shop"] .network-filter.network-at.active{background:#005baa;border-color:#005baa;color:#fff}
html[data-page="shop"] .order-panel{top:20px;padding:29px;border:0;border-radius:18px;background:linear-gradient(160deg,#102a43,#0b3544);box-shadow:10px 10px 0 var(--mint),0 18px 45px #102a4325}
html[data-page="shop"] .order-panel h2{padding-bottom:17px;border-bottom:1px solid #ffffff1f}
html[data-page="shop"] .recipient-field{color:#d9e8e7}
html[data-page="shop"] .recipient-field input{min-height:48px;padding:11px 13px;border:1px solid #ffffff45;border-radius:10px;background:#ffffff0d;color:#fff}
html[data-page="shop"] .recipient-field input:focus{border-color:var(--mint);box-shadow:0 0 0 3px #73e2d21f}
html[data-page="shop"] .empty-selection{margin-top:16px;padding:24px;border:1px dashed #ffffff2d;border-radius:11px;text-align:center}
html[data-page="shop"] .order-panel dl{margin-top:17px}
html[data-page="shop"] .order-panel .primary{min-height:49px;border-radius:10px;box-shadow:0 9px 20px #0002}
html[data-page="shop"] .message{border-radius:12px;box-shadow:0 8px 22px #102a430d}
@media(max-width:700px){
  .app-bar{padding:0 14px;position:relative}
  .nav-toggle{display:block;margin-left:auto}
  .app-bar nav{display:none;position:absolute;top:70px;left:0;right:0;background:var(--navy);padding:12px 18px 18px;z-index:20;box-shadow:0 16px 30px #071d3045;flex-direction:column;align-items:stretch;gap:2px}
  .app-bar nav.open{display:flex}
  .app-bar nav a,.app-bar nav .text-button{text-align:left;padding:11px 8px}
  .app-bar nav a:first-child{display:block}
}
@media(max-width:900px){html[data-page="shop"] .shop-layout{grid-template-columns:1fr}html[data-page="shop"] .order-panel{position:static;width:100%;max-width:none}}
@media(max-width:620px){html[data-page="shop"] main{padding:20px 14px 54px}html[data-page="shop"] .shop-heading{align-items:flex-start;margin-bottom:18px;padding:25px 21px;border-radius:17px}html[data-page="shop"] .shop-heading h1{font-size:36px;letter-spacing:-1.7px}html[data-page="shop"] .shop-heading .icon-button{width:41px;height:41px}html[data-page="shop"] .subscriber-profile{margin-bottom:18px;padding:15px}html[data-page="shop"] .catalog{padding:20px 15px;border-radius:15px}html[data-page="shop"] .section-title{align-items:flex-start}html[data-page="shop"] .section-title h2{font-size:24px}html[data-page="shop"] .bundle-group-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}html[data-page="shop"] .package{min-height:132px;padding:15px}html[data-page="shop"] .package strong{font-size:21px}html[data-page="shop"] .package span{margin-top:18px;font-size:13px}html[data-page="shop"] .order-panel{padding:23px 20px;border-radius:15px;box-shadow:6px 6px 0 var(--mint)}}
@media(max-width:390px){html[data-page="shop"] .bundle-group-grid{grid-template-columns:1fr}html[data-page="shop"] .package{min-height:116px}}
@media(max-width:560px){.history-page .section-title{align-items:flex-start;flex-direction:column}.primary.compact{width:100%;justify-content:center}}
@media(max-width:700px){html[data-page="login"],html[data-page="register"]{background:#eef5f3}html[data-page="login"] body,html[data-page="register"] body{min-height:100dvh;background:linear-gradient(160deg,#102a43 0,#0b4b50 31%,#eef5f3 31.2%,#f7faf9 100%)}html[data-page="login"] .app-bar,html[data-page="register"] .app-bar{height:64px;min-height:64px;padding:0 14px;background:transparent;border:0}html[data-page="login"] .brand,html[data-page="register"] .brand{font-size:17px}html[data-page="login"] .brand img,html[data-page="register"] .brand img{width:36px;height:36px;box-shadow:0 5px 16px #0003}html[data-page="login"] .app-bar nav,html[data-page="register"] .app-bar nav{top:64px;background:#102a43}html[data-page="login"] main,html[data-page="register"] main{display:grid;min-height:calc(100dvh - 64px);padding:14px 14px max(24px,env(safe-area-inset-bottom))}html[data-page="login"] .auth-layout,html[data-page="register"] .auth-layout{display:flex;min-height:0;flex-direction:column;justify-content:center;gap:16px;width:100%;max-width:470px;margin:auto}html[data-page="login"] .auth-intro,html[data-page="register"] .auth-intro{text-align:left;color:#fff;padding:4px 5px 0}html[data-page="login"] .auth-intro .eyebrow,html[data-page="register"] .auth-intro .eyebrow{color:#8ce3d7;font-size:9px;margin-bottom:7px}html[data-page="login"] .auth-intro h1,html[data-page="register"] .auth-intro h1{margin:0 0 8px;color:#fff;font-size:32px;line-height:1.05;letter-spacing:-1.3px}html[data-page="login"] .auth-intro>p:not(.eyebrow),html[data-page="register"] .auth-intro>p:not(.eyebrow){margin:0;color:#d5e6e7;font-size:13px;line-height:1.5}html[data-page="login"] .trust-list,html[data-page="register"] .trust-list{display:flex;justify-content:flex-start;flex-wrap:nowrap;gap:6px;margin-top:11px;overflow-x:auto;scrollbar-width:none}html[data-page="login"] .trust-list::-webkit-scrollbar,html[data-page="register"] .trust-list::-webkit-scrollbar{display:none}html[data-page="login"] .trust-list span,html[data-page="register"] .trust-list span{flex:none;padding:6px 8px;background:#ffffff16;color:#e2f4f1;border:1px solid #ffffff20;border-radius:999px;font-size:8px}html[data-page="login"] .auth-panel,html[data-page="register"] .auth-panel{width:100%;padding:23px 19px 20px;background:#fff;border:0;border-radius:18px;box-shadow:0 18px 55px #071d3030}html[data-page="login"] .auth-panel form,html[data-page="register"] .auth-panel form{display:grid;gap:3px}html[data-page="login"] .auth-panel h2,html[data-page="register"] .auth-panel h2{margin:0 0 15px;font-size:21px;letter-spacing:-.5px}html[data-page="login"] .auth-panel label,html[data-page="register"] .auth-panel label{margin:0 0 12px;color:#38534f;font-size:11px}html[data-page="login"] .auth-panel input,html[data-page="register"] .auth-panel input{min-height:48px;margin-top:6px;padding:11px 12px;background:#f7faf9;border:1px solid #cbd9d5;border-radius:10px;font-size:16px;line-height:1.25}html[data-page="login"] .auth-panel input:focus,html[data-page="register"] .auth-panel input:focus{border-color:#087c72;box-shadow:0 0 0 3px #087c7218}html[data-page="login"] .auth-panel .primary,html[data-page="register"] .auth-panel .primary{min-height:49px;margin-top:3px;border-radius:10px;font-size:15px;box-shadow:0 8px 20px #087c7230}html[data-page="login"] .form-switch,html[data-page="register"] .form-switch{margin:15px 0 0!important;font-size:12px!important}html[data-page="login"] .message,html[data-page="register"] .message{margin-bottom:13px;border-radius:9px;font-size:12px}}
@media(max-width:380px),(max-height:690px) and (max-width:700px){html[data-page="login"] .auth-intro>p:not(.eyebrow),html[data-page="register"] .auth-intro>p:not(.eyebrow){display:none}html[data-page="login"] .trust-list,html[data-page="register"] .trust-list{display:none}html[data-page="login"] .auth-layout,html[data-page="register"] .auth-layout{gap:10px}html[data-page="login"] .auth-intro h1,html[data-page="register"] .auth-intro h1{font-size:27px;margin:0}html[data-page="login"] .auth-panel,html[data-page="register"] .auth-panel{padding:19px 17px 17px}}