@import "tailwindcss";

:root {
  --navy: #082f49;
  --navy-deep: #052438;
  --navy-soft: #0d4664;
  --coral: #ef6b52;
  --coral-dark: #d6533c;
  --teal: #087f7c;
  --gold: #e8b95c;
  --cream: #f7f4ec;
  --ice: #edf6f7;
  --ink: #102a3a;
  --muted: #5e7180;
  --line: #dce5e8;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: #fff; font-family: Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
.container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }

.utility-bar { background: var(--navy-deep); color: #d6e6eb; font-size: 12px; }
.utility-inner { height: 34px; display: flex; align-items: center; justify-content: space-between; }
.utility-inner p, .utility-inner div, .utility-inner a { display: flex; align-items: center; gap: 7px; }
.utility-inner div { gap: 25px; }
.utility-inner a:hover { color: white; }
.lang-switcher-wrap { position: relative; }
.lang-btn, .portal-lang-btn { display: inline-flex; align-items: center; gap: 6px; border: 0; background: transparent; color: #d6e6eb; font-size: 11px; font-weight: 700; cursor: pointer; padding: 4px 6px; border-radius: 4px; }
.lang-btn:hover, .portal-lang-btn:hover { color: #fff; background: rgba(255,255,255,0.1); }
.portal-lang-btn { color: #4a6875; border: 1px solid #dce5e8; background: #fff; border-radius: 6px; padding: 6px 10px; font-size: 11px; }
.portal-lang-btn:hover { color: var(--navy); border-color: var(--teal); background: #f8fafb; }
.lang-dropdown { position: absolute; right: 0; top: 100%; margin-top: 6px; z-index: 100; min-width: 150px; background: #ffffff; border: 1px solid #dce5e8; border-radius: 6px; box-shadow: 0 10px 30px rgba(8,47,73,0.18); overflow: hidden; display: flex; flex-direction: column; padding: 4px; }
.lang-dropdown button { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 10px; border: 0; background: transparent; color: var(--navy); font-size: 11px; text-align: left; border-radius: 4px; cursor: pointer; }
.lang-dropdown button:hover { background: #edf6f7; color: var(--teal); }
.lang-dropdown button.active { background: #e5f4f3; color: var(--teal); font-weight: 800; }
.site-header { position: sticky; top: 0; z-index: 40; background: rgba(255,255,255,.97); border-bottom: 1px solid #e6ecee; backdrop-filter: blur(14px); }
.header-inner { height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; }
.brand-mark { width: 48px; height: 48px; display: grid; place-items: center; color: white; background: var(--navy); border-radius: 50% 50% 45% 45%; border: 3px solid #e2b55a; box-shadow: inset 0 0 0 2px rgba(255,255,255,.15); font-family: Georgia, serif; font-weight: 800; font-size: 15px; letter-spacing: -1px; }
.brand-mark.light { background: white; color: var(--navy); }
.brand-copy { display: flex; flex-direction: column; color: var(--navy); line-height: 1; letter-spacing: 1px; }
.brand-copy b { font-family: Georgia, serif; font-size: 16px; }
.brand-copy small { font-size: 10px; margin-top: 5px; letter-spacing: 5.2px; font-weight: 700; }
.desktop-nav { display: flex; height: 100%; align-items: center; gap: 34px; font-size: 14px; font-weight: 700; color: #284b60; }
.desktop-nav a { display: flex; align-items: center; gap: 5px; height: 100%; border-bottom: 3px solid transparent; }
.desktop-nav a:hover { color: var(--coral); border-color: var(--coral); }
.header-actions { display: flex; align-items: center; gap: 10px; }
.icon-button { border: 0; background: none; color: var(--navy); padding: 10px; }
.login-button { border: 0; color: white; background: var(--coral); border-radius: 5px; padding: 12px 18px; display: flex; align-items: center; gap: 8px; font-weight: 700; }
.login-button:hover, .button.coral:hover { background: var(--coral-dark); transform: translateY(-1px); }
.menu-button { display: none; background: transparent; border: 0; color: var(--navy); }
.mobile-nav { display: none; padding-block: 5px 18px; }
.mobile-nav a { padding: 14px 5px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; font-weight: 700; }

.hero { min-height: 610px; position: relative; overflow: hidden; background: var(--navy); color: white; }
.hero-image { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(4,35,53,.98) 0%, rgba(4,35,53,.91) 32%, rgba(4,35,53,.22) 64%, rgba(4,35,53,.04) 100%), url("https://images.pexels.com/photos/5638417/pexels-photo-5638417.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=900&w=1800") center 38% / cover; transform: scale(1.01); }
.hero-content { position: relative; min-height: 610px; display: flex; align-items: center; }
.hero-copy { width: 620px; padding: 72px 0 85px; }
.eyebrow { display: inline-block; font-weight: 800; color: var(--teal); letter-spacing: 2px; font-size: 12px; margin-bottom: 17px; }
.light-eyebrow { color: #79c8c6; }
.hero h1, h2 { font-family: Georgia, "Times New Roman", serif; letter-spacing: -.025em; }
.hero h1 { margin: 0; font-size: clamp(50px, 5.2vw, 76px); line-height: .99; font-weight: 500; }
.hero h1 em { color: #f4c46d; font-weight: 500; }
.hero-copy > p { font-size: 19px; line-height: 1.65; color: #d9e5e9; width: 530px; margin: 25px 0; }
.hero-buttons { display: flex; gap: 13px; margin-top: 30px; }
.button { min-height: 50px; padding: 0 23px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border-radius: 5px; border: 1px solid transparent; font-weight: 800; transition: .2s ease; }
.button.coral { background: var(--coral); color: white; border: 0; }
.button.white { background: white; color: var(--navy); }
.button.white:hover { background: #eef5f6; }
.button.navy { background: var(--navy); color: white; }
.button.navy:hover { background: var(--navy-soft); transform: translateY(-1px); }
.button.outline-light { border-color: rgba(255,255,255,.65); color: white; }
.button.full { width: 100%; }
.hero-copy .hero-note { font-size: 13px; margin: 19px 0 0; display: flex; align-items: center; gap: 7px; color: #bed2d8; }
.hero-note svg { color: #70c4a3; }
.hero-trust-card { position: absolute; right: 5%; bottom: 28px; display: flex; align-items: center; gap: 12px; color: var(--ink); background: white; padding: 14px 20px; border-radius: 5px; box-shadow: 0 12px 40px rgba(0,0,0,.2); }
.hero-trust-card svg { color: var(--teal); }
.hero-trust-card div { display: flex; flex-direction: column; gap: 4px; }
.hero-trust-card b { font-size: 13px; }
.hero-trust-card span { font-size: 11px; color: var(--muted); }
.quick-bar { background: white; border-bottom: 1px solid var(--line); box-shadow: 0 10px 30px rgba(8,47,73,.06); }
.quick-grid { min-height: 88px; display: grid; grid-template-columns: repeat(5,1fr); }
.quick-grid a { display: flex; align-items: center; justify-content: center; gap: 10px; border-right: 1px solid var(--line); color: #315669; font-size: 13px; font-weight: 700; }
.quick-grid a:first-child { border-left: 1px solid var(--line); }
.quick-grid a:hover { color: var(--coral); background: #fbfdfd; }
.quick-grid svg { color: var(--teal); }

.section { padding: 105px 0; }
.products-section { background: #fbfcfc; }
.section-heading { margin-bottom: 50px; }
.section-heading.centered { text-align: center; max-width: 720px; margin-inline: auto; }
.section-heading h2, .feature-copy h2, .digital-copy h2, .calculator-copy h2, .faq-grid h2, .cta-inner h2, .location-card h2 { font-size: clamp(37px, 4vw, 52px); line-height: 1.08; color: var(--navy); font-weight: 500; margin: 0; }
.section-heading p { color: var(--muted); font-size: 17px; line-height: 1.65; }
.product-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.product-card { min-height: 295px; background: white; border: 1px solid #e1e9eb; border-radius: 6px; padding: 32px; position: relative; transition: transform .25s, box-shadow .25s, border-color .25s; }
.product-card:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(8,47,73,.1); border-color: #aacccd; }
.product-icon { width: 53px; height: 53px; border-radius: 50%; display: grid; place-items: center; background: #e9f4f3; color: var(--teal); margin-bottom: 23px; }
.product-card h3 { margin: 0; font-family: Georgia, serif; color: var(--navy); font-size: 23px; }
.product-card p { color: var(--muted); line-height: 1.65; font-size: 14px; }
.product-card button, .rate-card button { position: absolute; bottom: 28px; left: 32px; border: 0; background: none; color: var(--teal); padding: 0; display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 13px; }

.feature-split { min-height: 690px; display: grid; grid-template-columns: 1fr 1fr; }
.feature-photo { min-height: 580px; position: relative; background-size: cover; background-position: center; }
.family-photo { background-image: url("https://images.pexels.com/photos/7854118/pexels-photo-7854118.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=900&w=1200"); }
.photo-label { position: absolute; left: 40px; bottom: 36px; display: flex; align-items: center; gap: 10px; background: white; color: var(--navy); border-radius: 4px; padding: 15px 18px; font-family: Georgia, serif; font-size: 16px; box-shadow: 0 10px 25px rgba(0,0,0,.15); }
.photo-label svg { color: var(--coral); }
.feature-copy { padding: 90px max(6vw, 55px); display: flex; flex-direction: column; justify-content: center; }
.navy-panel { background: var(--navy); color: white; }
.navy-panel h2, .calculator-copy h2 { color: white; }
.feature-copy > p { line-height: 1.7; font-size: 17px; color: #c9dbe0; max-width: 600px; }
.feature-copy ul { list-style: none; padding: 15px 0; margin: 0; display: flex; flex-direction: column; gap: 23px; }
.feature-copy li { display: flex; gap: 14px; }
.feature-copy li > span { flex: 0 0 26px; height: 26px; border-radius: 50%; background: #176078; display: grid; place-items: center; color: #9ed4c2; }
.feature-copy li svg { width: 15px; }
.feature-copy li div { display: flex; flex-direction: column; gap: 6px; }
.feature-copy li b { font-size: 15px; }
.feature-copy li small { color: #adc5cc; font-size: 13px; }
.text-link { font-weight: 800; font-size: 13px; display: flex; align-items: center; gap: 8px; margin-top: 15px; }
.light-link { color: #f4c46d; }

.rate-section { background: var(--cream); }
.split-heading { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 60px; }
.split-heading p { margin: 0; }
.rate-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 15px; }
.rate-card { height: 318px; padding: 31px 27px; background: white; border: 1px solid #e0ded7; border-radius: 6px; position: relative; }
.rate-card.featured { border: 2px solid var(--teal); }
.popular { position: absolute; right: 0; top: 0; background: var(--teal); color: white; font-size: 9px; font-weight: 800; padding: 7px 12px; border-radius: 0 4px 0 4px; letter-spacing: 1px; }
.rate-card h3 { font-family: Georgia, serif; color: var(--navy); font-size: 20px; text-transform: capitalize; margin: 8px 0 26px; }
.rate-card p { margin: 0; color: var(--muted); font-size: 12px; }
.rate-card strong { display: block; font-family: Georgia, serif; color: var(--navy); font-size: 39px; margin: 4px 0; }
.rate-card small { color: #7a8b94; font-size: 11px; }
.rate-card button { left: 27px; }
.rate-disclaimer { font-size: 10px; color: #78878e; margin-top: 22px; }
.rate-disclaimer a { text-decoration: underline; }

.digital-section { overflow: hidden; }
.digital-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 110px; }
.phone-visual { min-height: 620px; position: relative; display: grid; place-items: center; background: radial-gradient(circle, #d8eeec 0 45%, transparent 46%); }
.phone { width: 295px; border: 9px solid #102f40; border-radius: 37px; background: white; box-shadow: 0 30px 55px rgba(8,47,73,.22); overflow: hidden; transform: rotate(-3deg); }
.phone-top { height: 25px; width: 100px; border-radius: 0 0 16px 16px; background: #102f40; margin: 0 auto; }
.phone-screen { padding: 21px 16px 25px; min-height: 510px; background: #f7fbfb; }
.phone-brand { font-size: 11px; font-weight: 800; color: var(--navy); display: flex; align-items: center; gap: 8px; }
.phone-brand span { background: var(--navy); color: white; border-radius: 50%; width: 27px; height: 27px; display: grid; place-items: center; font-size: 8px; }
.balance-card { padding: 24px 18px; color: white; background: linear-gradient(135deg,var(--navy),#17617a); border-radius: 12px; margin-top: 19px; display: flex; flex-direction: column; }
.balance-card small { font-size: 8px; letter-spacing: 1px; color: #a9cad4; }
.balance-card strong { font-family: Georgia,serif; font-size: 28px; margin: 7px 0; }
.balance-card span { font-size: 9px; color: #c4d9df; }
.phone-actions { display: flex; justify-content: space-around; margin: 20px 0; }
.phone-actions > span { width: 42px; height: 42px; display: grid; place-items: center; background: #e1f1ef; border-radius: 50%; color: var(--teal); font-weight: 800; position: relative; }
.phone-actions small { position: absolute; top: 47px; color: var(--muted); font-size: 8px; }
.account-row { display: flex; align-items: center; justify-content: space-between; background: white; padding: 16px 12px; margin-top: 12px; border-radius: 8px; font-size: 9px; box-shadow: 0 5px 15px rgba(8,47,73,.05); }
.account-row span { display: flex; align-items: center; gap: 7px; }
.account-row i { width: 24px; height: 24px; border-radius: 50%; background: #e7f1f3; display: grid; place-items: center; color: var(--teal); }
.secure-badge { position: absolute; right: 4%; bottom: 12%; background: white; box-shadow: 0 12px 30px rgba(8,47,73,.15); border-radius: 5px; padding: 14px 19px; display: grid; grid-template-columns: auto auto; column-gap: 10px; }
.secure-badge svg { grid-row: 1/3; color: var(--teal); }
.secure-badge b { font-size: 12px; }
.secure-badge span { color: var(--muted); font-size: 9px; }
.digital-copy > p { color: var(--muted); font-size: 17px; line-height: 1.7; }
.check-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 28px 0 34px; }
.check-grid span { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; }
.check-grid svg { width: 20px; height: 20px; padding: 4px; border-radius: 50%; background: #e2f1ee; color: var(--teal); }
.app-links { display: flex; gap: 8px; margin-top: 20px; }
.app-links a { color: white; background: #111; border-radius: 6px; padding: 6px 13px; display: flex; align-items: center; gap: 8px; font-size: 9px; }
.app-links a:first-child { font-size: 22px; }
.app-links a span { font-size: 8px; }
.app-links b { font-size: 14px; }
.app-links .play { font-size: 18px; }

.calculator-section { padding: 95px 0; background: var(--navy); color: white; }
.calculator-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 100px; align-items: center; }
.calculator-copy p { color: #c4d5da; line-height: 1.7; max-width: 430px; }
.calc-note { display: flex; gap: 9px; align-items: center; font-size: 13px; }
.calc-note svg { color: #75c7a8; }
.calculator-card { background: white; color: var(--ink); border-radius: 7px; padding: 37px; box-shadow: 0 20px 50px rgba(0,0,0,.2); }
.calculator-card label { display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: 700; }
.calculator-card label b { font-family: Georgia,serif; color: var(--navy); font-size: 26px; }
.calculator-card input[type="range"] { width: 100%; accent-color: var(--coral); margin: 25px 0 5px; }
.range-labels { display: flex; justify-content: space-between; color: #83939b; font-size: 10px; }
.calculator-card .term-label { margin-top: 30px; }
.term-buttons { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin: 17px 0 25px; }
.term-buttons button { height: 38px; border: 1px solid var(--line); background: white; color: var(--muted); font-size: 11px; font-weight: 700; border-radius: 4px; }
.term-buttons button.active { background: var(--navy); color: white; border-color: var(--navy); }
.payment-result { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 22px 0; margin-bottom: 22px; display: flex; justify-content: space-between; align-items: center; }
.payment-result > span { font-weight: 700; font-size: 13px; }
.payment-result span small { display: block; color: var(--muted); font-weight: 400; margin-top: 4px; }
.payment-result strong { font-family: Georgia,serif; font-size: 31px; color: var(--navy); }
.payment-result strong small { font: 11px Arial; color: var(--muted); }

.business-feature { min-height: 650px; }
.cream-panel { background: var(--cream); }
.cream-panel > p { color: var(--muted); }
.business-photo { background-image: url("https://images.pexels.com/photos/3906984/pexels-photo-3906984.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=900&w=1200"); }
.business-stats { display: flex; gap: 50px; margin: 18px 0 34px; }
.business-stats div { display: flex; flex-direction: column; }
.business-stats strong { color: var(--teal); font: 29px Georgia,serif; }
.business-stats span { color: var(--muted); font-size: 11px; margin-top: 5px; }
.feature-copy .button { align-self: flex-start; }
.quote-card { position: absolute; bottom: 35px; left: 35px; max-width: 360px; background: rgba(255,255,255,.96); padding: 23px 26px; border-radius: 5px; box-shadow: 0 12px 35px rgba(0,0,0,.18); }
.quote-card svg { color: var(--coral); }
.quote-card p { font: 18px/1.4 Georgia,serif; color: var(--navy); margin: 8px 0; }
.quote-card b { font-size: 10px; color: var(--muted); }

.resource-section { background: #fafcfc; }
.resource-grid { display: grid; grid-template-columns: 1.4fr .8fr .8fr; gap: 18px; }
.resource-card { border: 1px solid var(--line); border-radius: 6px; background: white; padding: 28px; min-height: 360px; }
.featured-resource { padding: 0; overflow: hidden; }
.house-img { height: 180px; background: url("https://images.pexels.com/photos/8134821/pexels-photo-8134821.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=500&w=800") center/cover; }
.featured-resource > div:last-child { padding: 24px 28px; }
.resource-card > span, .featured-resource span { color: var(--teal); letter-spacing: 1px; font-size: 9px; font-weight: 800; }
.resource-card h3 { font: 23px/1.2 Georgia,serif; color: var(--navy); margin: 12px 0; }
.resource-card p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.resource-card a { display: flex; align-items: center; gap: 7px; color: var(--teal); font-weight: 800; font-size: 12px; margin-top: 24px; }
.resource-card a svg { width: 15px; }
.resource-icon { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: #e6f2f1; color: var(--teal); margin-bottom: 40px; }

.location-section { background: #e6f1f1; padding: 85px 0; }
.location-card { min-height: 415px; display: grid; grid-template-columns: 1fr 1fr; background: var(--navy); color: white; overflow: hidden; border-radius: 7px; box-shadow: 0 20px 45px rgba(8,47,73,.15); }
.location-card > div:first-child { padding: 65px; }
.location-card h2 { color: white; font-size: 40px; }
.location-card p { color: #c6d8de; line-height: 1.6; }
.location-search { height: 52px; background: white; border-radius: 4px; display: flex; align-items: center; padding-left: 15px; margin-top: 27px; }
.location-search svg { color: var(--teal); }
.location-search input { border: 0; outline: 0; flex: 1; padding: 0 10px; min-width: 0; }
.location-search button { align-self: stretch; border: 0; background: var(--coral); color: white; font-weight: 800; padding: 0 22px; }
.map-visual { position: relative; overflow: hidden; background-color: #d9e3dc; background-image: linear-gradient(30deg, transparent 49%, rgba(255,255,255,.45) 50%, transparent 51%), linear-gradient(-40deg, transparent 49%, rgba(255,255,255,.55) 50%, transparent 51%); background-size: 100px 80px, 130px 100px; }
.map-road { position: absolute; height: 14px; background: white; width: 130%; box-shadow: 0 0 0 1px #c9d4cd; }
.road-a { top: 30%; left: -15%; transform: rotate(19deg); }
.road-b { top: 65%; left: -15%; transform: rotate(-17deg); }
.road-c { top: 45%; left: -5%; transform: rotate(82deg); }
.pin { position: absolute; color: var(--coral); filter: drop-shadow(0 3px 3px rgba(0,0,0,.25)); }
.pin svg { width: 34px; height: 34px; fill: var(--coral); color: white; }
.pin-a { top: 23%; left: 27%; }.pin-b { top: 54%; left: 68%; }.pin-c { top: 33%; left: 75%; }
.map-info { position: absolute; left: 18%; bottom: 10%; background: white; color: var(--ink); padding: 14px 18px; border-radius: 4px; display: flex; flex-direction: column; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.map-info b { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.map-info b svg { width: 16px; color: var(--teal); }
.map-info span { color: var(--muted); font-size: 9px; margin-top: 5px; }

.faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 110px; }
.faq-grid > div:first-child p { color: var(--muted); }
.faq-grid > div:first-child a { display: flex; align-items: center; gap: 8px; color: var(--teal); font-size: 13px; font-weight: 800; }
.faq-list article { border-top: 1px solid var(--line); }
.faq-list article:last-child { border-bottom: 1px solid var(--line); }
.faq-list button { width: 100%; padding: 22px 0; display: flex; align-items: center; justify-content: space-between; text-align: left; border: 0; background: transparent; color: var(--navy); font-weight: 800; }
.faq-list button svg { width: 18px; transition: transform .2s; }
.faq-list article.open button svg { transform: rotate(180deg); }
.faq-list article p { color: var(--muted); line-height: 1.65; font-size: 14px; margin: -5px 35px 24px 0; }
.cta-section { padding: 65px 0; background: var(--navy-soft); color: white; }
.cta-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.cta-inner h2 { color: white; font-size: 40px; }
.cta-inner p { color: #c5dce2; margin-bottom: 0; }
.cta-inner > div:last-child { display: flex; gap: 10px; }

footer { background: var(--navy-deep); color: #bdd0d6; padding: 72px 0 30px; }
.footer-top { display: grid; grid-template-columns: 1.5fr repeat(3, .8fr) 1.25fr; gap: 48px; padding-bottom: 55px; }
.footer-brand p { max-width: 245px; font-size: 12px; line-height: 1.7; margin: 24px 0; }
.socials { display: flex; gap: 8px; }
.socials a { width: 32px; height: 32px; border-radius: 50%; border: 1px solid #547080; display: grid; place-items: center; }
.socials svg { width: 14px; }
.footer-column, .footer-contact { display: flex; flex-direction: column; gap: 12px; }
.footer-column h3, .footer-contact h3 { color: white; font-size: 13px; margin: 0 0 8px; }
.footer-column a { font-size: 11px; }
.footer-column a:hover { color: white; }
.footer-contact > a { display: flex; align-items: center; gap: 8px; color: white; font-weight: 800; font-size: 13px; }
.footer-contact > a svg { width: 17px; color: #7bc5c2; }
.footer-contact p { font-size: 10px; line-height: 1.6; }
.footer-contact button { display: flex; align-items: center; gap: 7px; color: #f3c46c; background: transparent; border: 0; padding: 0; font-size: 11px; font-weight: 700; }
.footer-contact button svg { width: 15px; }
.footer-bottom { border-top: 1px solid #315268; padding-top: 25px; display: grid; grid-template-columns: auto 1fr auto; gap: 25px; align-items: center; font-size: 9px; }
.footer-bottom > div { display: flex; gap: 15px; }
.footer-bottom span { display: flex; align-items: center; gap: 4px; }
.footer-bottom svg { width: 14px; }
.footer-bottom p { text-align: center; }
.footer-bottom nav { display: flex; gap: 15px; }
.footer-bottom small { grid-column: 1/-1; text-align: center; color: #7895a3; line-height: 1.5; }

.chat-button { position: fixed; right: 22px; bottom: 20px; z-index: 30; color: white; border: 0; border-radius: 30px; background: var(--coral); padding: 13px 18px; display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 800; box-shadow: 0 8px 24px rgba(8,47,73,.3); }
.chat-button svg { width: 19px; }
.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; background: rgba(3,25,39,.72); backdrop-filter: blur(5px); padding: 20px; overflow-y: auto; }
.modal-card { width: min(520px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; background: white; border-radius: 9px; padding: 40px 44px; position: relative; box-shadow: 0 30px 80px rgba(0,0,0,.3); animation: modalIn .25s ease-out; }

.email-label-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 2px; }
.email-badge { display: inline-flex; align-items: center; padding: 2px 7px; border-radius: 12px; font-size: 8px; font-weight: 800; letter-spacing: 0.3px; }
.email-badge.verified { background: #e3f5ed; color: #186a4e; }
.email-badge.pending { background: #fff3d6; color: #8a5814; }
.profile-email-wrap { display: inline-flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.resend-verify-btn { border: 0; background: transparent; color: var(--teal); font-size: 9px; font-weight: 800; cursor: pointer; text-decoration: underline; padding: 0; }
.resend-verify-btn:hover { color: var(--navy); }

/* Email Verification standalone page */
.verify-email-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: linear-gradient(135deg, #052338 0%, #082f49 50%, #0f4969 100%); color: var(--ink); }
.verify-email-card { width: min(500px, 100%); background: #ffffff; border-radius: 12px; padding: 40px 36px; box-shadow: 0 24px 60px rgba(0,0,0,0.28); text-align: center; }
.verify-seal { width: 54px; height: 54px; margin: 0 auto 16px; border-radius: 50%; background: #082f49; color: #ffffff; display: grid; place-items: center; font-family: Georgia, serif; font-size: 16px; font-weight: 800; border: 2px solid #e2b55a; }
.verify-eyebrow { font-size: 9px; font-weight: 800; color: var(--teal); letter-spacing: 1.5px; display: block; margin-bottom: 8px; }
.verify-email-card h1 { font-family: Georgia, serif; color: var(--navy); font-size: 28px; margin: 0 0 10px; }
.verify-sub { color: var(--muted); font-size: 12px; line-height: 1.5; margin: 0 0 24px; }
.verify-status-box { padding: 24px 20px; border-radius: 8px; margin-bottom: 24px; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.verify-status-box.verifying { background: #f0f7f9; color: var(--navy); }
.verify-status-box.success { background: #edf9f3; color: #17604e; }
.verify-status-box.error { background: #fff2f0; color: #a43729; }
.verify-status-box h2 { margin: 4px 0; font-family: Georgia, serif; font-size: 20px; }
.verify-status-box p { margin: 0; font-size: 12px; line-height: 1.5; }
.verify-next { font-size: 11px !important; color: #527568 !important; margin-top: 6px !important; }
.success-icon { color: #1c7d5c; }
.error-icon { color: #d32f2f; }
.verify-spinner { width: 36px; height: 36px; border: 3px solid #d0e4e8; border-top-color: var(--teal); border-radius: 50%; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.verify-manual-form { display: flex; flex-direction: column; gap: 14px; text-align: left; margin-bottom: 20px; }
.verify-manual-form label { font-size: 11px; font-weight: 700; color: var(--navy); display: flex; flex-direction: column; gap: 6px; }
.verify-manual-form input { height: 42px; border: 1px solid #cbd9dd; border-radius: 6px; padding: 0 12px; font-family: monospace; font-size: 13px; }
.verify-btn { height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border-radius: 6px; font-weight: 800; font-size: 12px; border: 0; cursor: pointer; text-decoration: none; padding: 0 20px; width: 100%; transition: all 0.2s ease; }
.verify-btn.primary { background: var(--teal); color: #ffffff; }
.verify-btn.primary:hover { background: #066b69; }
.verify-btn.secondary { background: var(--navy); color: #ffffff; }
.verify-btn.secondary:hover { background: var(--navy-soft); }
.verify-footer-links { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #e5ecee; padding-top: 18px; margin-top: 10px; font-size: 10px; color: var(--muted); }
.verify-footer-links a { color: var(--teal); font-weight: 700; display: inline-flex; align-items: center; gap: 4px; }
.verify-footer-links span { display: inline-flex; align-items: center; gap: 4px; }
@keyframes modalIn { from { opacity: 0; transform: translateY(16px) scale(.98); } }
.modal-close { position: absolute; top: 15px; right: 15px; width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: 50%; background: #edf3f4; color: var(--navy); }
.modal-header { text-align: center; }
.mini-mark { margin: 0 auto 15px; width: 45px; height: 45px; display: grid; place-items: center; border-radius: 50%; background: var(--navy); color: white; font: 12px Georgia,serif; }
.mini-mark svg { width: 20px; }
.modal-header .eyebrow { margin-bottom: 8px; }
.modal-header h2 { margin: 0; font: 34px Georgia,serif; color: var(--navy); }
.modal-header p { color: var(--muted); font-size: 13px; }
.login-form, .application-form { display: flex; flex-direction: column; gap: 15px; margin-top: 26px; }
.login-form label, .application-form label { font-size: 11px; font-weight: 800; color: #385464; }
.login-form input, .application-form input, .application-form select, .application-form textarea { width: 100%; padding: 12px 13px; border: 1px solid #cbd9dd; border-radius: 4px; margin-top: 6px; outline: none; color: var(--ink); background: white; }
.login-form input:focus, .application-form input:focus, .application-form select:focus, .application-form textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(8,127,124,.1); }
.password-input { position: relative; }
.password-input svg { position: absolute; right: 12px; top: 17px; width: 16px; color: #78909c; }
.form-between { display: flex; justify-content: space-between; font-size: 11px; }
.form-between .remember { display: flex; gap: 7px; align-items: center; font-weight: 500; }
.form-between input { width: auto; margin: 0; }
.form-between a, .login-enroll a { color: var(--teal); font-weight: 800; }
.login-enroll { text-align: center; font-size: 12px; }
.secure-line, .form-privacy { padding-top: 14px; border-top: 1px solid var(--line); color: #788d96; display: flex; justify-content: center; align-items: center; gap: 6px; font-size: 9px; }
.secure-line svg, .form-privacy svg { width: 14px; color: var(--teal); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.application-form label span { font-weight: 400; }
.application-form textarea { resize: vertical; }
.form-error { color: #b53b2d; background: #fff0ed; padding: 10px; font-size: 11px; margin: 0; }
.success-message { text-align: center; padding: 35px 10px 10px; }
.success-message > div { width: 55px; height: 55px; margin: 0 auto; border-radius: 50%; display: grid; place-items: center; background: #e3f3ed; color: var(--teal); }
.success-message h3 { font: 28px Georgia,serif; color: var(--navy); margin-bottom: 8px; }
.success-message p { color: var(--muted); line-height: 1.6; font-size: 13px; }
.success-message button { margin-top: 15px; }
.deposit-options { display: grid; gap: 9px; margin: 25px 0 18px; }
.deposit-options > button { width: 100%; min-height: 68px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; text-align: left; padding: 11px 14px; border: 1px solid #cfdbdf; border-radius: 6px; background: white; color: var(--ink); transition: .2s ease; }
.deposit-options > button:hover { border-color: var(--teal); background: #f7fbfb; }
.deposit-options > button.selected { border: 2px solid var(--teal); background: #f0f8f7; padding: 10px 13px; }
.deposit-option-icon { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #e5f2f0; color: var(--teal); }
.deposit-option-icon svg { width: 20px; }
.deposit-options > button > span:nth-child(2) { display: flex; flex-direction: column; gap: 5px; }
.deposit-options b { color: var(--navy); font-size: 13px; }
.deposit-options small { color: var(--muted); font-size: 10px; }
.radio-dot { width: 17px; height: 17px; border-radius: 50%; border: 2px solid #9aadb6; box-shadow: inset 0 0 0 3px white; }
.deposit-options button.selected .radio-dot { border-color: var(--teal); background: var(--teal); }
.currency-panel { padding: 16px; margin-bottom: 17px; border-radius: 6px; background: #f5f8f8; }
.currency-panel > label { display: block; color: #385464; font-size: 11px; font-weight: 800; margin-bottom: 11px; }
.currency-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.currency-grid button { display: flex; flex-direction: column; gap: 3px; padding: 10px 11px; text-align: left; border: 1px solid #cfdbdf; border-radius: 4px; color: var(--ink); background: white; }
.currency-grid button.selected { border: 2px solid var(--teal); padding: 9px 10px; background: #eaf6f4; }
.currency-grid b { color: var(--navy); font-size: 12px; }
.currency-grid small { color: var(--muted); font-size: 9px; }
.external-notice { display: flex; gap: 11px; padding: 13px 14px; margin-bottom: 16px; border: 1px solid #ead6a5; border-radius: 5px; background: #fff9ea; color: #694e16; }
.external-notice > svg { flex: 0 0 17px; margin-top: 2px; }
.external-notice p { display: flex; flex-direction: column; gap: 4px; margin: 0; font-size: 10px; line-height: 1.45; }
.external-notice b { font-size: 11px; }
.external-apply { margin-bottom: 14px; }
.wide-modal { width: min(780px, 100%); }
.opening-heading { text-align: center; }
.opening-heading .eyebrow { margin-bottom: 7px; }
.opening-heading h2, .account-created h2 { margin: 0; color: var(--navy); font: 34px Georgia,serif; }
.opening-heading p { margin: 8px 0 0; color: var(--muted); font-size: 11px; }
.step-track { position: relative; display: flex; justify-content: space-between; margin: 25px 10px 30px; }
.step-track:before { content: ""; position: absolute; top: 14px; left: 15px; right: 15px; height: 2px; background: #dce5e8; }
.step-track span { z-index: 1; width: 29px; height: 29px; display: grid; place-items: center; border-radius: 50%; background: #e8eef0; color: #71858f; font-size: 10px; font-weight: 800; }
.step-track span.active { background: var(--teal); color: white; }
.step-track svg { width: 14px; }
.opening-form section[hidden] { display: none; }
.form-grid { display: grid; gap: 15px; }
.form-grid.three { grid-template-columns: repeat(3,1fr); margin-bottom: 15px; }
.form-grid.two { grid-template-columns: 1fr 1fr; }
.form-grid.one { grid-template-columns: 1fr; }
.form-grid label { color: #385464; font-size: 11px; font-weight: 800; }
.form-grid label.wide { grid-column: 1/-1; }
.form-grid label > small { font-weight: 400; color: var(--muted); }
.form-grid input, .form-grid select { display: block; width: 100%; min-height: 44px; margin-top: 6px; padding: 10px 12px; border: 1px solid #cbd9dd; border-radius: 4px; background: white; color: var(--ink); outline: 0; }
.form-grid input:focus, .form-grid select:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(8,127,124,.1); }
.form-grid label > small:last-child { display: block; margin-top: 5px; line-height: 1.4; }
.secret-field { position: relative; }
.secret-field input { padding-right: 48px; }
.secret-field button { position: absolute; right: 6px; top: 12px; border: 0; background: transparent; color: var(--muted); }
.secret-field svg { width: 18px; }
.opening-deposit { display:grid;grid-template-columns:1fr 1.3fr;gap:14px;align-items:center;margin:18px 0;padding:15px;border:1px solid #e2cf9c;border-radius:6px;background:#fff9e9 }.opening-deposit label{color:#385464;font-size:10px;font-weight:800}.opening-deposit input{width:100%;margin-top:6px;padding:10px;border:1px solid #cdbd91;border-radius:4px}.opening-deposit p{display:flex;flex-direction:column;gap:4px;margin:0;color:#6c5620;font-size:9px;line-height:1.45}.opening-deposit b{font-size:10px}.opening-deposit.final-funding-notice{grid-template-columns:1fr}.info-callout, .credential-warning { display: flex; gap: 11px; padding: 13px 15px; margin-top: 18px; border-radius: 5px; background: #edf6f5; color: #285862; }
.info-callout > svg, .credential-warning > svg { flex: 0 0 18px; margin-top: 2px; color: var(--teal); }
.info-callout p, .credential-warning p { display: flex; flex-direction: column; gap: 4px; margin: 0; font-size: 10px; line-height: 1.5; }
.info-callout b, .credential-warning b { font-size: 11px; }
.identity-intro { display: flex; gap: 14px; padding: 16px; margin-bottom: 18px; border-left: 3px solid var(--gold); background: #fffaf0; }
.identity-intro > svg { color: var(--navy); flex: 0 0 23px; }
.identity-intro b { color: var(--navy); font-size: 12px; }
.identity-intro p { color: var(--muted); font-size: 10px; line-height: 1.5; margin: 5px 0 0; }
.document-upload { position: relative; min-height: 76px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 13px; margin-top: 18px; padding: 13px 15px; border: 1px dashed #9db4bd; border-radius: 6px; color: var(--ink); background: #f9fcfc; cursor: pointer; }
.document-upload:hover, .document-upload:focus-within { border-color: var(--teal); background: #f1f9f8; }
.document-upload input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.upload-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e3f2ef; }
.upload-icon svg { width: 20px; }
.document-upload > span:nth-of-type(2) { display: flex; flex-direction: column; gap: 5px; }
.document-upload b { color: var(--navy); font-size: 11px; overflow-wrap: anywhere; }
.document-upload small { color: var(--muted); font-size: 9px; line-height: 1.4; }
.upload-action { padding: 8px 10px; border-radius: 4px; color: white; background: var(--navy); font-size: 9px; font-weight: 800; }
.agreements { display: grid; gap: 12px; margin-top: 20px; }
.agreements label { display: flex; align-items: flex-start; gap: 10px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.agreements input { margin-top: 2px; accent-color: var(--teal); }
.opening-actions { display: flex; justify-content: flex-end; gap: 10px; padding-top: 22px; margin-top: 22px; border-top: 1px solid var(--line); }
.opening-actions .button { min-width: 145px; }
.opening-actions svg { width: 17px; }
.back-button { display: flex; align-items: center; gap: 6px; border: 0; background: transparent; color: var(--navy); font-weight: 800; font-size: 12px; }
.back-button svg { width: 16px; }
.opening-error { padding: 11px 13px; margin: 18px 0 0; border-radius: 4px; background: #fff0ed; color: #a43729; font-size: 11px; }
.account-created { text-align: center; }
.created-check { width: 58px; height: 58px; margin: 0 auto 15px; border-radius: 50%; display: grid; place-items: center; color: var(--teal); background: #e3f3ed; }
.account-created > p { color: var(--muted); font-size: 12px; line-height: 1.6; }
.account-receipt { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 1px; margin: 22px 0; background: var(--line); border: 1px solid var(--line); border-radius: 5px; overflow: hidden; text-align: left; }
.account-receipt div { display: flex; flex-direction: column; gap: 6px; padding: 16px; background: #f8fbfb; }
.account-receipt small { color: var(--muted); font-size: 8px; letter-spacing: 1px; }
.account-receipt b { color: var(--navy); font-size: 13px; }
.email-result { font-weight: 700; color: var(--navy) !important; }
.signed-in-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 25px; }
.signed-in-summary > div { padding: 15px; border: 1px solid var(--line); border-radius: 5px; display: flex; flex-direction: column; gap: 5px; }
.signed-in-summary small { font-size: 8px; letter-spacing: 1px; color: var(--muted); }
.signed-in-summary b { color: var(--navy); text-transform: capitalize; }
.signed-in-summary > p { grid-column: 1/-1; display: flex; gap: 8px; align-items: center; padding: 12px; background: #edf6f5; color: var(--teal); font-size: 10px; }
.signed-in-summary > p svg { width: 17px; }
.signed-in-summary > button { grid-column: 1/-1; }
.admin-login-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: linear-gradient(135deg,var(--navy-deep),var(--navy-soft)); }
.admin-login-card { width: min(420px,100%); padding: 42px; border-radius: 8px; background: white; text-align: center; box-shadow: 0 25px 70px rgba(0,0,0,.3); }
.admin-shield { width: 55px; height: 55px; display: grid; place-items: center; margin: auto; border-radius: 50%; color: white; background: var(--navy); }
.admin-login-card > span { display: block; margin-top: 18px; color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: 2px; }
.admin-login-card h1 { margin: 8px 0; color: var(--navy); font: 30px Georgia,serif; }
.admin-login-card > p { color: var(--muted); font-size: 11px; line-height: 1.5; }
.admin-login-card label { display: block; margin-top: 24px; text-align: left; color: var(--ink); font-size: 11px; font-weight: 800; }
.admin-login-card label div { position: relative; }
.admin-login-card input { width: 100%; height: 46px; margin-top: 7px; padding: 0 42px 0 38px; border: 1px solid var(--line); border-radius: 4px; font-size: 14px; }
.admin-pwd-input-wrap { position: relative; }
.admin-lock-icon { position: absolute; left: 12px; top: 20px; width: 16px; color: var(--muted); }
.admin-eye-btn { position: absolute; right: 8px; top: 14px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border: 0; background: transparent; color: #78909c; cursor: pointer; }
.admin-eye-btn:hover { color: var(--navy); }
.admin-hint-box { margin-top: 10px; padding: 6px 10px; border-radius: 4px; background: #eef6f8; color: #2b5668; text-align: center; }
.admin-hint-box code { font-weight: 800; color: #084c68; background: #d7ecf2; padding: 2px 6px; border-radius: 3px; font-family: monospace; font-size: 11px; }
.admin-login-card > button { width: 100%; height: 46px; margin-top: 16px; border: 0; border-radius: 4px; color: white; background: var(--coral); font-weight: 800; cursor: pointer; }
.admin-login-card > a { display: inline-block; margin-top: 20px; color: var(--teal); font-size: 11px; font-weight: 800; }
.admin-error { color: #a43729 !important; font-size: 12px; margin-top: 10px; }
.admin-page { min-height: 100vh; background: #f3f7f8; }
.admin-header { height: 72px; padding: 0 max(24px,4vw); display: flex; align-items: center; justify-content: space-between; color: white; background: var(--navy-deep); }
.admin-header > div { display: flex; align-items: center; gap: 12px; }
.admin-logo { width: 39px; height: 39px; display: grid; place-items: center; border: 2px solid var(--gold); border-radius: 50%; font: 11px Georgia,serif; }
.admin-header div div { display: flex; flex-direction: column; }.admin-header small { color: #9bb6c1; font-size: 9px; }.admin-header a, .admin-header > div:last-child > span { font-size: 10px; color: #c8d8dd; }
.admin-header form button { border: 1px solid #547080; background: transparent; color: #c8d8dd; font-size: 9px; }
.admin-container { width: min(1180px,calc(100% - 48px)); margin: auto; padding: 60px 0; }
.admin-title { display: flex; justify-content: space-between; align-items: end; margin-bottom: 30px; }
.admin-title span { color: var(--teal); font-size: 10px; font-weight: 800; letter-spacing: 2px; }.admin-title h1 { margin: 8px 0; color: var(--navy); font: 40px Georgia,serif; }.admin-title p { margin: 0; color: var(--muted); font-size: 12px; }
.admin-stat { min-width: 135px; padding: 15px 20px; border-radius: 5px; background: white; box-shadow: 0 5px 18px rgba(8,47,73,.08); }.admin-stat small { display: block; color: var(--muted); font-size: 9px; }.admin-stat b { color: var(--navy); font: 28px Georgia,serif; }
.admin-empty { padding: 60px; text-align: center; background: white; border-radius: 7px; }.admin-empty h2 { color: var(--navy); }.admin-empty p { color: var(--muted); }
.admin-records { display: grid; gap: 18px; }.admin-records article { padding: 27px; border: 1px solid var(--line); border-radius: 7px; background: white; box-shadow: 0 8px 25px rgba(8,47,73,.05); }
.admin-record-head { display: flex; justify-content: space-between; gap: 20px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }.admin-record-head h2 { margin: 8px 0 4px; color: var(--navy); font: 23px Georgia,serif; }.admin-record-head p { margin: 0; color: var(--muted); font-size: 11px; }.admin-record-head > div:last-child { display: flex; flex-direction: column; text-align: right; }.admin-record-head small { color: var(--muted); font-size: 8px; letter-spacing: 1px; }.admin-record-head b { margin: 4px 0; color: var(--navy); }
.status-pill { display: inline-block; padding: 5px 8px; border-radius: 20px; color: #27624f; background: #dff3e9; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; }
.admin-records dl { display: grid; grid-template-columns: repeat(4,1fr); gap: 25px; margin: 22px 0; }.admin-records dt { margin-bottom: 7px; color: var(--teal); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; }.admin-records dd { margin: 0; color: #4e6470; font-size: 11px; line-height: 1.65; }.document-link { display: inline-block; margin-top: 6px; color: var(--teal); font-weight: 800; text-decoration: underline; }.admin-records article footer { padding: 12px 0 0; color: #82939b; background: white; font-size: 9px; }

.login-atmosphere { height:110px; position:relative; overflow:hidden; margin:-40px -44px 25px; border-radius:9px 9px 0 0; background:linear-gradient(135deg,#77b8d3,#f2c681); }.login-atmosphere.morning{background:linear-gradient(135deg,#9dcfe2,#ffd29b)}.login-atmosphere.day{background:linear-gradient(135deg,#4fa1ca,#bce9ec)}.login-atmosphere.evening{background:linear-gradient(135deg,#674f87,#f19a73)}.login-atmosphere.night{background:linear-gradient(135deg,#101c3d,#303b6e)}.atmosphere-orb { position:absolute; right:48px; top:23px; width:45px; height:45px; border-radius:50%; background:#ffe8a0; box-shadow:0 0 35px rgba(255,225,130,.75); }.login-atmosphere.night .atmosphere-orb{background:#e4ecff;box-shadow:0 0 28px rgba(210,225,255,.6)}.login-atmosphere.autumn:after{content:"";position:absolute;inset:auto 0 0;height:24px;background:linear-gradient(15deg,#a95f38 48%,transparent 50%)}.login-atmosphere.winter:after{content:"";position:absolute;inset:auto 0 0;height:19px;background:white;border-radius:70% 70% 0 0}.login-atmosphere.spring:after,.login-atmosphere.summer:after{content:"";position:absolute;left:-5%;right:-5%;bottom:-15px;height:40px;border-radius:50%;background:#5a9a72}.login-atmosphere>span { position:absolute; left:25px; top:20px; color:rgba(255,255,255,.8); font-size:18px; }.particle { position:absolute; width:5px; height:5px; border-radius:50%; background:rgba(255,255,255,.75); animation:seasonFloat 4s ease-in-out infinite }.particle.p1{left:25%;top:30%}.particle.p2{left:48%;top:55%;animation-delay:1s}.particle.p3{left:68%;top:23%;animation-delay:2s}@keyframes seasonFloat{50%{transform:translateY(18px) rotate(90deg);opacity:.35}}.login-modal-header .eyebrow { font-size:9px; }
.admin-chat-widget { position:fixed; right:20px; bottom:18px; z-index:115; }.admin-chat-toggle { height:47px; display:flex; align-items:center; gap:7px; padding:0 16px; border:0; border-radius:25px; color:white; background:var(--coral); box-shadow:0 10px 25px rgba(8,47,73,.25); font-size:9px; font-weight:800; }.admin-chat-toggle svg{width:17px}.admin-chat-toggle i{min-width:17px;height:17px;display:grid;place-items:center;border-radius:12px;color:var(--coral);background:white;font-size:7px;font-style:normal}.admin-chat-panel { width:min(570px,calc(100vw - 25px)); height:min(500px,calc(100vh - 100px)); display:flex; flex-direction:column; margin-bottom:10px; overflow:hidden; border:1px solid #cbdcdf; border-radius:8px; background:white; box-shadow:0 20px 55px rgba(8,47,73,.28); }.admin-chat-panel>header{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;color:white;background:var(--navy)}.admin-chat-panel header>div{display:flex;align-items:center;gap:9px}.admin-chat-panel header svg{width:17px}.admin-chat-panel header p{display:flex;flex-direction:column;gap:3px;margin:0}.admin-chat-panel header b{font-size:9px}.admin-chat-panel header small{color:#b6ced5;font-size:7px}.admin-chat-panel header button{border:0;color:white;background:transparent}.admin-chat-body{flex:1;min-height:0;display:grid;grid-template-columns:180px 1fr}.admin-chat-body>aside{overflow-y:auto;border-right:1px solid #dce5e8;background:#f5f8f9}.admin-chat-body aside button{width:100%;display:flex;flex-direction:column;gap:4px;padding:11px;border:0;border-bottom:1px solid #e1e8ea;text-align:left;background:transparent}.admin-chat-body aside button.active{background:white;box-shadow:inset 3px 0 var(--teal)}.admin-chat-body aside b{color:var(--navy);font-size:8px}.admin-chat-body aside small{color:#7d9098;font-size:7px}.admin-chat-body>section{min-width:0;display:flex;flex-direction:column}.chat-delete-controls{display:flex;gap:5px;padding:7px;border-bottom:1px solid #dce5e8}.chat-delete-controls button{display:flex;align-items:center;gap:4px;padding:5px 7px;border:1px solid #e4b9b3;border-radius:3px;color:#9b3c31;background:white;font-size:7px;font-weight:800}.chat-delete-controls svg{width:12px}.admin-chat-thread{flex:1;overflow-y:auto;padding:13px;background:#f4f7f8}.admin-chat-thread p{max-width:82%;display:flex;flex-direction:column;gap:4px;padding:9px;margin:4px;border-radius:8px;font-size:8px}.admin-chat-thread small{font-size:6px;opacity:.7}.from-member{background:white;border:1px solid #dce5e8}.from-admin{margin-left:auto!important;color:white;background:var(--teal)}.admin-chat-body section form{display:flex;gap:6px;padding:9px;border-top:1px solid #dce5e8}.admin-chat-body section input{flex:1;min-width:0;padding:8px;border:1px solid #cbd9dd;border-radius:4px;font-size:8px}.admin-chat-body section form button{width:36px;border:0;border-radius:50%;color:white;background:var(--teal)}.admin-chat-body section svg{width:14px}.no-chat{display:grid;place-items:center;color:#7d9098;font-size:9px}
.record-formats { display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px }.record-formats button{height:42px;display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--teal);border-radius:4px;color:var(--teal);background:white;font-size:9px;font-weight:800}.record-formats button:hover{color:white;background:var(--teal)}.record-formats svg{width:14px}.table-receipt{border:0;background:transparent}.receipt-download{border:1px solid var(--teal);background:white}
@media(max-width:560px){.login-atmosphere{margin:-38px -22px 22px}.admin-chat-body{grid-template-columns:120px 1fr}.admin-chat-widget{right:10px}.admin-chat-toggle span{display:none}}

.login-countdown { display:flex; align-items:center; justify-content:center; gap:10px; margin:4px 0 14px; padding:9px; border-radius:5px; background:#edf6f5; }.login-countdown>span { width:27px; height:27px; display:grid; place-items:center; border-radius:50%; color:white; background:var(--teal); font-weight:800; }.login-countdown p { margin:0; color:#45666e; font-size:9px; }
.admin-bell-wrap { position:relative; }
.admin-bell-wrap>button { position:relative; width:36px; height:36px; display:grid; place-items:center; border:1px solid #dce5e8; border-radius:50%; color:#53707f; background:white; }
.admin-alert-panel { position:absolute; right:0; top:45px; width:min(360px,calc(100vw - 25px)); max-height:460px; overflow:auto; border:1px solid #d7e2e5; border-radius:7px; background:white; box-shadow:0 18px 45px rgba(8,47,73,.2); }
.admin-alert-panel>header { display:flex; justify-content:space-between; align-items:center; padding:13px 15px; border-bottom:1px solid #e4ebed; }
.admin-alert-panel header b { color:var(--navy); font-size:10px; }
.admin-alert-panel header small { color:#7b8e97; font-size:7px; }
.admin-alert-panel header button { border:0; color:var(--teal); background:transparent; font-size:8px; font-weight:800; cursor:pointer; }
.admin-alert-panel>button { width:100%!important; height:auto!important; display:flex!important; gap:9px; padding:12px 14px; border:0!important; border-bottom:1px solid #e9eef0!important; border-radius:0!important; text-align:left; background:white!important; }
.admin-alert-panel>button:hover { background:#f4f9f8!important; }
.admin-alert-panel button>svg { flex:0 0 15px; color:var(--teal); }
.admin-alert-panel button span { display:flex; flex-direction:column; gap:3px; }
.admin-alert-panel button b { color:var(--navy); font-size:8px; }
.admin-alert-panel button small { color:#7c8f98; font-size:7px; }
.admin-alert-panel>p { padding:25px; color:#7c8f98; text-align:center; font-size:8px; }

.card-choice { display:grid; grid-template-columns:1fr 1fr; gap:12px; max-width:760px; }
.card-choice button { min-height:78px; display:flex; align-items:center; gap:14px; padding:16px 20px; border:1px solid #d4e0e3; border-radius:7px; color:#536b77; background:white; text-align:left; }
.card-choice b { color:var(--navy); font-size:20px; }
.card-choice span { font-size:9px; font-weight:700; }
.card-status { max-width:760px; padding:10px; color:#27624f; background:#e6f4ed; font-size:9px; }
.issued-cards { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-top:18px; }
.card-management { padding:18px; border:1px solid #dce5e8; border-radius:10px; background:white; }
.virtual-card {
  cursor: pointer;
  aspect-ratio: 1.586;
  position: relative;
  overflow: hidden;
  padding: 24px 28px;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 14px;
  box-shadow: 0 16px 36px rgba(10, 25, 45, 0.22);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.virtual-card.visa {
  color: #ffd84d;
  background: #08223d;
  box-shadow: 0 16px 36px rgba(4, 20, 36, 0.28);
}
.virtual-card.mastercard {
  color: #fff0f5;
  background: #461424;
  box-shadow: 0 16px 36px rgba(45, 10, 20, 0.28);
}
.card-top-bar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.card-bank-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.card-bank-info b {
  color: #ffffff;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.5px;
}
.card-bank-info small {
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 1px;
}
.virtual-card.visa .card-bank-info small {
  color: #ffd84d;
}
.virtual-card.mastercard .card-bank-info small {
  color: #e59fb3;
}
.card-corner-brand {
  display: flex;
  align-items: center;
}
.visa-brand-text {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 22px;
  font-weight: 900;
  font-style: italic;
  letter-spacing: -0.5px;
  color: #ffffff;
}
.mc-brand-circles {
  position: relative;
  width: 44px;
  height: 26px;
}
.mc-brand-circles i {
  position: absolute;
  top: 0;
  width: 26px;
  height: 26px;
  border-radius: 50%;
}
.mc-red {
  left: 0;
  background: #eb001b;
}
.mc-gold {
  right: 0;
  background: #f79e1b;
  opacity: 0.95;
}
.card-mid-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 12px 0 8px;
}
.card-emv-chip {
  width: 44px;
  height: 32px;
  border-radius: 5px;
  background: linear-gradient(135deg, #f2df98, #bca157);
  border: 1px solid #786430;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  padding: 3px 4px;
}
.chip-g1, .chip-g2, .chip-g3 {
  height: 1px;
  background: rgba(90, 70, 25, 0.45);
  border-radius: 1px;
}
.card-wave-symbol {
  transform: rotate(90deg);
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -1px;
}
.virtual-card.visa .card-wave-symbol {
  color: #ffd84d;
}
.virtual-card.mastercard .card-wave-symbol {
  color: #fff0f5;
}
.card-status-tag {
  margin-left: auto;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 1px;
  text-transform: uppercase;
  opacity: 0.85;
}
.virtual-card.visa .card-status-tag {
  color: #ffd84d;
}
.virtual-card.mastercard .card-status-tag {
  color: #e59fb3;
}
.card-number-display {
  font-family: monospace, Courier, monospace;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 3px;
  white-space: nowrap;
  margin: 6px 0 14px;
}
.virtual-card.visa .card-number-display {
  color: #ffd84d;
}
.virtual-card.mastercard .card-number-display {
  color: #fff0f5;
}
.card-data-grid {
  display: grid;
  grid-template-columns: 2.2fr 1fr 1fr 0.8fr;
  gap: 12px;
  align-items: flex-end;
}
.card-grid-col {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.card-grid-col small {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  white-space: nowrap;
}
.virtual-card.visa .card-grid-col small {
  color: #ffd84d;
  opacity: 0.85;
}
.virtual-card.mastercard .card-grid-col small {
  color: #e59fb3;
}
.card-grid-col b {
  font-family: monospace, Courier, monospace;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.virtual-card.visa .card-grid-col b {
  color: #ffd84d;
}
.virtual-card.mastercard .card-grid-col b {
  color: #fff0f5;
}
.virtual-card.blocked, .virtual-card.reported {
  filter: saturate(0.35);
  opacity: 0.75;
}
.card-controls-panel {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 14px;
}
.card-action-bar {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.card-action-bar button {
  flex: 1;
  min-width: 120px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 0 12px;
  border-radius: 6px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}
.card-btn-primary {
  background: #edf6f7;
  color: var(--navy);
  border: 1px solid #c7dde0;
}
.card-btn-primary:hover {
  background: #dbeef0;
  border-color: var(--teal);
}
.card-btn-primary.revealed {
  background: var(--navy);
  color: #fff;
  border-color: var(--navy);
}
.card-btn-secondary {
  background: #fff;
  color: #385464;
  border: 1px solid #cbd9dd;
}
.card-btn-secondary:hover:not(:disabled) {
  background: #f4f8f9;
  border-color: #a8c1c7;
}
.card-btn-secondary.unblock {
  background: #e8f7f2;
  color: #17604e;
  border-color: #b3e3d3;
}
.card-btn-danger {
  background: #fff;
  color: #a43729;
  border: 1px solid #f2c7c2;
}
.card-btn-danger:hover:not(:disabled) {
  background: #fff2f0;
  border-color: #e59d94;
}
.card-btn-danger:disabled, .card-btn-secondary:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.card-mgmt-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.card-mgmt-card {
  padding: 14px 16px;
  background: #f8fafb;
  border: 1px solid #e2eaed;
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.mgmt-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--navy);
}
.mgmt-card-head svg {
  color: var(--teal);
  flex-shrink: 0;
}
.mgmt-card-head div {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mgmt-card-head b {
  font-size: 11px;
  font-weight: 800;
  color: var(--navy);
}
.mgmt-card-head small {
  font-size: 9px;
  color: var(--muted);
}
.mgmt-pin-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.mgmt-pin-row input {
  width: 110px;
  height: 38px;
  padding: 0 12px;
  border: 1px solid #cbd9dd;
  border-radius: 6px;
  font-family: monospace;
  font-size: 16px;
  letter-spacing: 4px;
  text-align: center;
  background: #fff;
}
.mgmt-pin-row button {
  height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 6px;
  background: var(--navy);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
}
.mgmt-pin-row button:hover {
  background: var(--navy-soft);
}
.mgmt-toggles-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 6px 0;
}
.toggle-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  font-weight: 600;
  color: #385464;
  cursor: pointer;
}
.toggle-row input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--teal);
  cursor: pointer;
  margin: 0;
}
.mgmt-limit-row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  padding-top: 8px;
  border-top: 1px solid #e6ecee;
}
.mgmt-limit-row label {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 10px;
  font-weight: 700;
  color: #486575;
}
.mgmt-limit-row input {
  height: 36px;
  padding: 0 10px;
  border: 1px solid #cbd9dd;
  border-radius: 6px;
  background: #fff;
  font-size: 12px;
  font-weight: 700;
}
.mgmt-limit-row button {
  height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 6px;
  background: var(--teal);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
}
.mgmt-limit-row button:hover {
  background: #066b69;
}
.code-gen-wrapper{display:flex;gap:6px;align-items:stretch;margin-top:5px}
.code-gen-wrapper input{flex:1;margin:0!important;font-family:monospace;font-size:12px;letter-spacing:1.5px;font-weight:700;color:var(--navy)}
.code-gen-wrapper button{display:flex;align-items:center;gap:5px;padding:0 12px;border:1px solid var(--teal);border-radius:4px;color:white;background:var(--teal);font-size:8px;font-weight:800;white-space:nowrap;cursor:pointer}
.code-gen-wrapper button:hover{background:#066a67}
.active-code-chip{display:inline-flex;align-items:center;flex-wrap:wrap;gap:5px;margin:2px 0}
.copy-code-btn{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border:1px solid #d4a742;border-radius:4px;color:#6d4e13;background:#fff8e6;font-size:8px;font-weight:800;cursor:pointer}
.copy-code-btn:hover{background:#ffecc0;border-color:#b58521}
.live-code-badge{display:inline-flex;align-items:center;gap:6px;margin-top:4px;padding:3px 8px;border-radius:4px;background:#fff0d4;color:#734f10;font-size:8px}
.live-code-badge button{border:1px solid #c9932d;border-radius:3px;background:white;color:#734f10;font-size:7px;font-weight:800;padding:1px 5px;cursor:pointer}
@media(max-width:760px){
  .issued-cards{grid-template-columns:1fr}
  .card-choice{grid-template-columns:1fr}
  .virtual-card{padding:17px}
  .virtual-card footer{left:17px;right:17px}
  .admin-alert-panel{position:fixed;right:8px;top:65px}
}

.idle-timeout{position:fixed;inset:0;z-index:220;display:grid;place-items:center;padding:20px;background:rgba(3,25,39,.75);backdrop-filter:blur(7px)}.idle-timeout>div{width:min(410px,100%);display:flex;flex-direction:column;align-items:center;padding:34px;border-radius:9px;background:white;text-align:center;box-shadow:0 25px 70px rgba(0,0,0,.3)}.idle-timeout svg{width:37px;height:37px;color:var(--teal)}.idle-timeout h2{margin:15px 0 7px;color:var(--navy);font:28px Georgia,serif}.idle-timeout p{margin:0;color:#667b86;font-size:10px;line-height:1.5}.idle-timeout strong{margin:18px 0 0;color:var(--coral);font:38px Georgia,serif}.idle-timeout small{color:#7a8d96;font-size:8px}.idle-timeout button{width:100%;height:44px;margin-top:20px;border:0;border-radius:4px;color:white;background:var(--navy);font-weight:800}.idle-timeout a{margin-top:13px;color:var(--teal);font-size:9px;font-weight:800;cursor:pointer}.returning-user{display:flex;align-items:center;gap:10px;padding:12px 15px;margin-bottom:18px;border:1px solid #9ccfbd;border-radius:6px;color:#315e53;background:#eaf7f1}.returning-user>svg{width:19px;color:#27805f}.returning-user p{flex:1;display:flex;flex-direction:column;gap:3px;margin:0}.returning-user b{font-size:10px}.returning-user span{font-size:8px}.returning-user button{border:0;color:#52736a;background:transparent}.returning-user button svg{width:15px}

.bank-signout{position:fixed;inset:0;z-index:300;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;color:white;background:radial-gradient(circle at 50% 40%,#15526b,#05283d 58%,#031d2d);text-align:center}.signout-seal{position:relative;width:105px;height:105px;display:grid;place-items:center}.signout-seal>span{width:72px;height:72px;display:grid;place-items:center;border:2px solid #e8b95c;border-radius:50%;font:bold 22px Georgia;color:#e8b95c}.signout-seal>i{position:absolute;inset:0;border:4px solid rgba(255,255,255,.14);border-top-color:#70c4a3;border-right-color:#e8b95c;border-radius:50%;animation:signoutSpin 1s linear infinite}.bank-signout h2{margin:24px 0 7px;font:30px Georgia}.bank-signout p{margin:0;color:#bbd0d8;font-size:10px}.bank-signout strong{margin-top:18px;font:34px Georgia;color:#e8b95c}.signout-progress{width:min(310px,75vw);height:4px;margin:15px 0;overflow:hidden;border-radius:5px;background:rgba(255,255,255,.16)}.signout-progress i{display:block;width:100%;height:100%;background:linear-gradient(90deg,#70c4a3,#e8b95c);transform-origin:left;animation:signoutProgress 3s linear forwards}.bank-signout small{color:#91aeb9;font-size:8px}@keyframes signoutSpin{to{transform:rotate(360deg)}}@keyframes signoutProgress{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Customer online banking */
.member-shell { min-height: 100vh; display: grid; grid-template-columns: 245px 1fr; color: #183243; background: #f2f6f7; }
.member-sidebar { position: sticky; top: 0; height: 100vh; z-index: 80; display: flex; flex-direction: column; color: #bfd1d8; background: #062f46; }
.member-brand { height: 74px; display: flex; align-items: center; gap: 10px; padding: 0 20px; border-bottom: 1px solid #254e61; }.member-brand>span { width: 40px; height: 40px; display: grid; place-items: center; border: 2px solid var(--gold); border-radius: 50%; color: white; font: 11px Georgia,serif; }.member-brand div { display: flex; flex-direction: column; gap: 4px; }.member-brand b { color: white; font: 13px Georgia,serif; }.member-brand small { font-size: 7px; letter-spacing: 1.5px; }.member-brand button { display: none; margin-left: auto; border: 0; color: white; background: transparent; }
.member-person { display: flex; align-items: center; gap: 10px; margin: 17px 14px; padding: 13px; border: 1px solid #2b596d; border-radius: 5px; background: #0c3b51; }.member-person>span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: #d7ece8; font-size: 9px; font-weight: 800; }.member-person div { display: flex; flex-direction: column; gap: 4px; }.member-person b { color: white; font-size: 10px; }.member-person small { font-size: 8px; }
.member-sidebar nav { display: grid; gap: 3px; padding: 0 12px; }.member-sidebar nav button { height: 44px; display: flex; align-items: center; gap: 11px; padding: 0 13px; border: 0; border-radius: 4px; color: #bfd1d8; background: transparent; font-size: 10px; font-weight: 700; }.member-sidebar nav button svg { width: 17px; }.member-sidebar nav button svg:last-child { width: 13px; margin-left: auto; opacity: .5; }.member-sidebar nav button.active { color: white; background: #15536b; box-shadow: inset 3px 0 var(--coral); }
.member-side-bottom { margin-top: auto; padding: 15px 13px 21px; border-top: 1px solid #254e61; }.member-side-bottom>div { display: flex; gap: 8px; padding: 9px; }.member-side-bottom svg { width: 17px; color: #72c6aa; }.member-side-bottom p { display: flex; flex-direction: column; gap: 3px; margin: 0; }.member-side-bottom b { color: white; font-size: 9px; }.member-side-bottom small { font-size: 7px; }.member-side-bottom>button { width: 100%; height: 39px; display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 8px; border: 1px solid #41677a; border-radius: 4px; color: #d7e3e7; background: transparent; font-size: 9px; font-weight: 700; }
.member-main { min-width: 0; }.member-top { height: 74px; position: sticky; top: 0; z-index: 60; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; border-bottom: 1px solid #dce5e8; background: rgba(255,255,255,.97); }.member-top>div { display: flex; flex-direction: column; gap: 3px; }.member-top small { color: var(--teal); font-size: 7px; letter-spacing: 1.3px; }.member-top b { color: var(--navy); font: 16px Georgia,serif; }.member-top>div:last-child { flex-direction: row; align-items: center; }.member-top>div:last-child button { width: 35px; height: 35px; display: grid; place-items: center; border: 1px solid #dbe4e7; border-radius: 50%; color: #58717d; background: white; }.member-top>div:last-child svg { width: 16px; }.member-top>div:last-child>span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--teal); font-size: 9px; font-weight: 800; }.member-menu { display: none; border: 0; background: transparent; color: var(--navy); }
.member-content { max-width: 1240px; margin: auto; padding: 36px 32px 70px; }.member-alert { display: flex; gap: 11px; padding: 14px 17px; margin-bottom: 22px; border: 1px solid #ecd491; border-radius: 6px; color: #6d5017; background: #fff6df; }.member-alert.danger { border-color: #efb6af; color: #8b352b; background: #fff0ee; }.member-alert svg { width: 19px; flex: 0 0 auto; }.member-alert b { font-size: 11px; }.member-alert p { margin: 4px 0 0; font-size: 9px; line-height: 1.5; }
.member-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 26px; }.member-title p { margin: 0; color: var(--teal); font-size: 8px; font-weight: 800; letter-spacing: 1.6px; }.member-title h1 { margin: 7px 0 5px; color: var(--navy); font: 34px Georgia,serif; }.member-title>div>span { color: #71858f; font-size: 10px; }.member-status { display: flex; align-items: center; gap: 6px; padding: 7px 11px; border-radius: 20px; color: #795718; background: #fff0cc; font-size: 8px; font-weight: 800; text-transform: uppercase; }.member-status i { width: 7px; height: 7px; border-radius: 50%; background: #d89d28; }.member-status.active { color: #24604f; background: #dff3e9; }.member-status.active i { background: #2d9d76; }
.member-balance-card { min-height: 190px; display: flex; align-items: center; justify-content: space-between; padding: 35px 40px; border-radius: 9px; color: white; background: linear-gradient(135deg,#07334a,#126178); box-shadow: 0 15px 35px rgba(8,47,73,.18); }.member-balance-card small { color: #9fc4cf; font-size: 8px; letter-spacing: 1.4px; }.member-balance-card h2 { margin: 12px 0 8px; font: 40px Georgia,serif; }.member-balance-card p { margin: 0; color: #c3d9df; font-size: 10px; }.balance-shield { display: flex; flex-direction: column; align-items: center; gap: 8px; color: #a9d5c4; font-size: 8px; }.balance-shield svg { width: 44px; height: 44px; }
.member-quick { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; margin: 18px 0; }.member-quick button { min-height: 75px; display: flex; align-items: center; gap: 13px; padding: 14px 18px; border: 1px solid #dce5e8; border-radius: 6px; color: var(--ink); background: white; text-align: left; }.member-quick button:disabled { opacity: .5; cursor: not-allowed; }.member-quick>button>svg { width: 21px; color: var(--teal); }.member-quick span { display: flex; flex-direction: column; gap: 4px; }.member-quick b { color: var(--navy); font-size: 10px; }.member-quick small { color: #788c95; font-size: 8px; }
.member-overview-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 17px; }.member-panel, .profile-panel, .secure-message-form, .message-history { overflow: hidden; border: 1px solid #dce5e8; border-radius: 7px; background: white; box-shadow: 0 5px 17px rgba(8,47,73,.04); }.member-panel>header { min-height: 68px; display: flex; align-items: center; justify-content: space-between; padding: 15px 20px; border-bottom: 1px solid #e5ebed; }.member-panel h3 { margin: 0 0 4px; color: var(--navy); font: 17px Georgia,serif; }.member-panel header p { margin: 0; color: #7b8d96; font-size: 8px; }.member-panel header button { border: 0; color: var(--teal); background: transparent; font-size: 8px; font-weight: 800; }.member-transaction { min-height: 64px; display: flex; align-items: center; gap: 10px; padding: 10px 20px; border-bottom: 1px solid #edf1f2; }.member-transaction>span { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: #a33d31; background: #ffebe8; }.member-transaction>span.credit { color: #28735a; background: #e2f3eb; }.member-transaction svg { width: 15px; }.member-transaction p { flex: 1; display: flex; flex-direction: column; gap: 4px; margin: 0; }.member-transaction b { font-size: 9px; }.member-transaction small { color: #84959c; font-size: 7px; }.member-transaction strong { color: #8f3930; font-size: 9px; }.positive { color: #28735a !important; }.member-empty { padding: 35px; color: #81949d; text-align: center; font-size: 9px; }.account-snapshot dl { display: grid; grid-template-columns: 1fr 1fr; margin: 0; }.account-snapshot dl div { padding: 16px 18px; border-right: 1px solid #edf1f2; border-bottom: 1px solid #edf1f2; }.account-snapshot dt, .profile-panel dt { color: #78909a; font-size: 7px; letter-spacing: 1px; }.account-snapshot dd { margin: 6px 0 0; color: var(--navy); font-size: 10px; font-weight: 800; text-transform: capitalize; }
.member-account-card { max-width: 680px; overflow: hidden; border: 1px solid #d9e4e7; border-radius: 8px; background: white; box-shadow: 0 9px 30px rgba(8,47,73,.08); }.member-account-card header { display: flex; align-items: center; gap: 13px; padding: 22px; color: white; background: var(--navy); }.member-account-card header>span { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%; background: #17566d; }.member-account-card header svg { width: 20px; }.member-account-card header div { flex: 1; display: flex; flex-direction: column; gap: 5px; }.member-account-card header small { color: #9ebec8; font-size: 7px; letter-spacing: 1px; }.member-account-card header b { font-size: 11px; }.member-account-card header em { padding: 6px 9px; border: 1px solid #4e7787; border-radius: 20px; font-size: 8px; font-style: normal; }.member-account-card>div { display: grid; grid-template-columns: 2fr 1fr 1fr; }.member-account-card>div p { display: flex; flex-direction: column; gap: 7px; margin: 0; padding: 22px; border-right: 1px solid #e4ebed; }.member-account-card>div small { color: #7b8e97; font-size: 7px; letter-spacing: 1px; }.member-account-card>div b { color: var(--navy); font: 16px Georgia,serif; text-transform: capitalize; }.member-account-card footer { display: flex; align-items: center; gap: 6px; padding: 12px 22px; color: #4f6975; background: #f7fafa; font-size: 8px; }.member-account-card footer svg { width: 14px; color: var(--teal); }
.member-table-wrap { overflow-x: auto; border: 1px solid #dce5e8; border-radius: 7px; background: white; }.member-table { width: 100%; min-width: 700px; border-collapse: collapse; }.member-table th { padding: 12px 16px; color: #758993; background: #f5f8f9; text-align: left; font-size: 7px; letter-spacing: 1px; }.member-table td { padding: 14px 16px; border-top: 1px solid #e5ebed; color: #526b77; font-size: 9px; }.member-table td b,.member-table td small { display: block; }.member-table td b { color: var(--navy); }.member-table td small { margin-top: 4px; color: #85969d; font-size: 7px; }.member-table td span { padding: 4px 7px; border-radius: 15px; background: #e8eff1; font-size: 7px; text-transform: uppercase; }
.profile-panel header { display: flex; align-items: center; gap: 13px; padding: 24px; color: white; background: var(--navy); }.profile-panel header>span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: #d9ece9; font-weight: 800; }.profile-panel h2 { margin: 0 0 5px; font: 21px Georgia,serif; }.profile-panel header p { margin: 0; color: #acc7cf; font-size: 8px; }.profile-panel>div { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; padding: 25px; }.profile-panel dl { margin: 0; }.profile-panel dd { margin: 7px 0 0; color: #506975; font-size: 9px; line-height: 1.65; }.profile-panel footer { display: flex; align-items: center; gap: 7px; padding: 13px 24px; color: #42636b; background: #eef7f5; font-size: 8px; }.profile-panel footer svg { width: 15px; color: var(--teal); }
.member-document { display: flex; align-items: center; gap: 14px; max-width: 760px; min-height: 78px; padding: 15px 18px; margin-bottom: 11px; border: 1px solid #dce5e8; border-radius: 6px; background: white; }.member-document>span { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e4f2f0; }.member-document>span svg { width: 18px; }.member-document div { flex: 1; }.member-document b { color: var(--navy); font-size: 10px; }.member-document p { margin: 5px 0 0; color: #7a8d96; font-size: 8px; }.member-document em { display: flex; align-items: center; gap: 5px; color: #277259; font-size: 8px; font-style: normal; font-weight: 800; }.member-document em svg { width: 14px; }.privacy-note { max-width: 760px; display: flex; gap: 10px; padding: 15px; margin-top: 18px; color: #3f636b; background: #eaf5f3; }.privacy-note svg { width: 18px; color: var(--teal); }.privacy-note p { display: flex; flex-direction: column; gap: 4px; margin: 0; }.privacy-note b { font-size: 9px; }.privacy-note span { font-size: 8px; }
.support-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 17px; }.secure-message-form, .message-history { padding: 23px; }.secure-message-form h2,.message-history h2 { margin: 0 0 18px; color: var(--navy); font: 19px Georgia,serif; }.secure-message-form label { display: block; margin-top: 13px; color: #385464; font-size: 9px; font-weight: 800; }.secure-message-form input,.secure-message-form textarea { width: 100%; margin-top: 6px; padding: 11px; border: 1px solid #ccdadd; border-radius: 4px; }.secure-message-form p { padding: 9px; color: #28624f; background: #e6f4ed; font-size: 8px; }.secure-message-form button { width: 100%; height: 43px; display: flex; align-items: center; justify-content: center; gap: 7px; margin-top: 15px; border: 0; border-radius: 4px; color: white; background: var(--coral); font-weight: 800; }.secure-message-form button svg { width: 16px; }.message-history>div { display: flex; gap: 10px; padding: 13px 0; border-top: 1px solid #e7edef; }.message-history>div>span { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e5f2f0; }.message-history svg { width: 14px; }.message-history p { flex: 1; display: flex; flex-direction: column; gap: 4px; margin: 0; }.message-history b { color: var(--navy); font-size: 9px; }.message-history small { color: #7d9098; font-size: 7px; }.message-history em { color: #536c78; font-size: 8px; font-style: normal; line-height: 1.5; }

.clickable { cursor: pointer; transition: transform .2s, box-shadow .2s; }.clickable:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(8,47,73,.12); }
.member-header-actions { position: relative; }.notification-wrap { position: relative; }.member-top .member-bell { position: relative; }.member-bell i { position: absolute; right: -5px; top: -5px; min-width: 17px; height: 17px; padding: 0 4px; display: grid; place-items: center; border: 2px solid white; border-radius: 15px; color: white; background: var(--coral); font-size: 7px; font-style: normal; }.notification-panel { position: absolute; right: 0; top: 47px; width: min(370px,calc(100vw - 25px)); max-height: 480px; overflow-y: auto; border: 1px solid #d8e3e6; border-radius: 7px; background: white; box-shadow: 0 18px 45px rgba(8,47,73,.2); }.notification-panel>header { position: sticky; top: 0; z-index: 1; display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid #e4ebed; background: white; }.notification-panel>header div { display: flex; flex-direction: column; gap: 3px; }.notification-panel header b { color: var(--navy); font-size: 11px; }.notification-panel header small { color: #7b8e97; font-size: 8px; }.notif-header-btns { display: flex; align-items: center; gap: 8px; }
.notification-panel header button { width: auto !important; height: auto !important; border: 0 !important; color: var(--teal) !important; font-size: 8px; font-weight: 800; cursor: pointer; }
.notif-clear-all { display: flex; align-items: center; gap: 4px; color: #a43729 !important; font-size: 8px; font-weight: 800; }
.notif-clear-all:hover { opacity: 0.85; }
.notification-panel article { display: flex; align-items: flex-start; gap: 10px; padding: 13px 15px; border-bottom: 1px solid #edf1f2; position: relative; }
.notif-delete-one { margin-left: auto; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; border: 0; background: transparent; color: #a0b2b8; border-radius: 4px; cursor: pointer; transition: all 0.2s ease; }
.notif-delete-one:hover { background: #ffebee; color: #d32f2f; }.notification-panel article.unread { background: #f0f8f7; box-shadow: inset 3px 0 var(--teal); }.notification-panel article>span { width: 31px; height: 31px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e3f1ef; }.notification-panel article span svg { width: 14px; }.notification-panel article div { display: flex; flex-direction: column; gap: 4px; }.notification-panel article b { color: var(--navy); font-size: 9px; }.notification-panel article p { margin: 0; color: #607681; font-size: 8px; line-height: 1.4; }.notification-panel article small { color: #87989f; font-size: 7px; }.notification-empty { padding: 30px; color: #7a8e97; text-align: center; font-size: 9px; }
.live-flash { position: fixed; z-index: 100; top: 86px; left: calc(245px + (100vw - 245px)/2); width: min(480px,calc(100vw - 30px)); transform: translateX(-50%); display: flex; align-items: center; gap: 12px; padding: 14px 16px; border: 1px solid #8bc9b3; border-radius: 7px; color: #234c42; background: #ebf8f2; box-shadow: 0 15px 35px rgba(8,47,73,.18); animation: flashDown .35s ease-out; }.live-flash>span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--teal); }.live-flash span svg { width: 16px; }.live-flash div { flex: 1; }.live-flash b { font-size: 10px; }.live-flash p { margin: 4px 0 0; font-size: 8px; }.live-flash button { border: 0; background: transparent; color: #58736c; }.live-flash button svg { width: 16px; } @keyframes flashDown { from { opacity: 0; transform: translate(-50%,-20px); } }
.payment-tabs { display: grid; grid-template-columns: repeat(4,1fr); max-width: 760px; margin-bottom: 15px; border: 1px solid #d7e2e5; border-radius: 6px; overflow: hidden; }.payment-tabs button { height: 43px; border: 0; border-right: 1px solid #dce5e8; color: #5d7480; background: white; font-size: 9px; font-weight: 800; }.payment-tabs button.active { color: white; background: var(--navy); }.payment-form { max-width: 760px; overflow: hidden; border: 1px solid #dce5e8; border-radius: 7px; background: white; box-shadow: 0 7px 25px rgba(8,47,73,.05); }.payment-source { display: flex; align-items: center; gap: 12px; padding: 18px 22px; color: white; background: linear-gradient(120deg,var(--navy),#165b72); }.payment-source>span { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 50%; background: #27667b; }.payment-source svg { width: 18px; }.payment-source div { flex: 1; display: flex; flex-direction: column; gap: 5px; }.payment-source small { color: #a9c8d1; font-size: 7px; letter-spacing: 1px; }.payment-source b { font-size: 10px; }.payment-source select{width:95px;margin-top:6px;padding:5px;border:1px solid rgba(255,255,255,.35);border-radius:4px;color:white;background:#174f65}.payment-source select option{color:#173142;background:white}.payment-source strong { font: 17px Georgia,serif; }.payment-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 23px; }.payment-fields label,.settings-card label { color: #385464; font-size: 9px; font-weight: 800; }.payment-fields .wide { grid-column: 1/-1; }.payment-fields input,.payment-fields select,.settings-card input { width: 100%; min-height: 43px; margin-top: 6px; padding: 10px; border: 1px solid #cbd9dd; border-radius: 4px; background: white; }.payment-pin{margin:0 23px 14px;padding:13px;border:1px solid #d6e2e5;border-radius:5px;background:#f7fafb}.payment-pin label{color:#385464;font-size:9px;font-weight:800}.payment-pin input{width:100%;height:42px;margin-top:6px;padding:10px;border:1px solid #cbd9dd;border-radius:4px;font-size:16px;letter-spacing:4px}.payment-pin small{display:block;margin-top:6px;color:#7c8f98;font-size:7px}.payment-security { display: flex; gap: 8px; margin: 0 23px; padding: 11px; color: #41656d; background: #eaf5f3; font-size: 8px; line-height: 1.45; }.payment-security svg { width: 16px; flex: 0 0 auto; color: var(--teal); }.payment-submit { width: calc(100% - 46px); height: 45px; margin: 16px 23px 23px; border: 0; border-radius: 4px; color: white; background: var(--coral); font-weight: 800; }.payment-submit:disabled { opacity: .5; }.payment-result-message,.settings-result { margin: 0 23px 15px; padding: 10px; color: #24604f; background: #e2f3eb; font-size: 9px; font-weight: 700; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }.settings-card { padding: 23px; border: 1px solid #dce5e8; border-radius: 7px; background: white; }.settings-card header { display: flex; gap: 11px; align-items: center; padding-bottom: 16px; border-bottom: 1px solid #e7edef; }.settings-card header>span { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e5f2f0; }.settings-card header svg { width: 18px; }.settings-card h2 { margin: 0 0 4px; color: var(--navy); font: 18px Georgia,serif; }.settings-card header p { margin: 0; color: #7a8e97; font-size: 8px; }.settings-card label { display: block; margin-top: 14px; }.settings-card>small { display: block; margin-top: 7px; color: #7b8e97; font-size: 8px; }.settings-card>button { width: 100%; height: 42px; margin-top: 17px; border: 0; border-radius: 4px; color: white; background: var(--navy); font-weight: 800; }.settings-result { max-width: 600px; margin: 17px 0; }
.bank-reply { display: flex; flex-direction: column; gap: 4px; margin-top: 8px; padding: 9px; border-left: 3px solid var(--teal); color: #315d61; background: #edf7f5; font-size: 8px; }.bank-reply b { color: var(--teal); font-size: 8px; }.bank-reply small { color: #7a8e97; }.admin-reply { padding: 10px; margin: 8px 0; color: #315d61; background: #edf7f5; font-size: 9px; }.admin-reply p { margin: 4px 0 0 !important; min-height: 0 !important; }.open-chat-button { display:flex;align-items:center;gap:6px;padding:8px 10px;margin:9px 0;border:1px solid var(--teal);border-radius:4px;color:var(--teal);background:white;font-size:8px;font-weight:800 }.open-chat-button svg{width:14px}.quick-reply { display: flex; gap: 7px; margin: 10px 0; }.quick-reply input { flex: 1; min-width: 0; padding: 8px; border: 1px solid #cbd9dd; border-radius: 4px; font-size: 8px; }.quick-reply button { border: 0; border-radius: 4px; color: white; background: var(--teal); font-size: 8px; font-weight: 800; }

.member-person img,.member-avatar img,.avatar-preview img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }.member-avatar { overflow: hidden; cursor: pointer; }.avatar-preview { overflow: hidden; }.avatar-settings input[type="file"] { padding: 8px; }
.transfer-processing { position: fixed; inset: 0; z-index: 150; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 25px; color: var(--navy); background: rgba(244,249,250,.96); backdrop-filter: blur(8px); text-align: center; }.transfer-spinner { position: relative; width: 110px; height: 110px; display: grid; place-items: center; }.transfer-spinner span { position: absolute; inset: 0; border: 7px solid #d9e9e9; border-top-color: var(--teal); border-right-color: var(--coral); border-radius: 50%; animation: bankSpin 1s linear infinite; }.transfer-spinner i { width: 68px; height: 68px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--navy); font: 17px Georgia,serif; }.transfer-processing h2 { margin: 24px 0 7px; font: 31px Georgia,serif; }.transfer-processing p { color: #607782; font-size: 11px; }.transfer-processing strong { margin: 15px 0 5px; color: var(--coral); font: 34px Georgia,serif; }.transfer-processing small { color: #70858f; font-size: 9px; }.transfer-challenge{position:fixed;inset:0;z-index:151;display:grid;place-items:center;padding:20px;background:rgba(3,25,39,.76);backdrop-filter:blur(8px)}.transfer-challenge form{width:min(430px,100%);display:flex;flex-direction:column;align-items:center;padding:32px;border-radius:9px;background:white;text-align:center;box-shadow:0 25px 70px rgba(0,0,0,.3)}.transfer-challenge form>svg{width:36px;height:36px;color:#b57a22}.transfer-challenge form>span{margin-top:12px;color:var(--teal);font-size:8px;font-weight:800;letter-spacing:1.5px}.transfer-challenge h2{margin:8px 0;color:var(--navy);font:26px Georgia,serif}.transfer-challenge p{color:#657b85;font-size:9px;line-height:1.55}.paused-progress{width:100%;height:28px;position:relative;overflow:hidden;margin:10px 0;border-radius:4px;background:#e8eef0}.paused-progress i{display:block;height:100%;background:linear-gradient(90deg,#ef6b52,#e8b95c)}.paused-progress b{position:absolute;inset:0;display:grid;place-items:center;color:#173142;font-size:8px}.transfer-challenge label{width:100%;margin-top:12px;color:#385464;text-align:left;font-size:9px;font-weight:800}.transfer-challenge input{width:100%;height:44px;margin-top:6px;padding:10px;border:1px solid #cbd9dd;border-radius:4px;font-size:16px;letter-spacing:2px}.transfer-challenge em{margin-top:9px;color:#9a382e;font-size:8px;font-style:normal}.transfer-challenge button{width:100%;height:44px;margin-top:15px;border:0;border-radius:4px;color:white;background:var(--teal);font-weight:800}.transfer-challenge small{margin-top:12px;color:#809199;font-size:8px}.transfer-processing em { margin-top: 25px; color: #7d8f97; font-size: 8px; font-style: normal; } @keyframes bankSpin { to { transform: rotate(360deg); } }
.receipt-download { display: flex; align-items: center; justify-content: center; gap: 7px; margin: 0 23px 14px; padding: 11px; border: 1px solid var(--teal); border-radius: 4px; color: var(--teal); font-size: 9px; font-weight: 800; }.receipt-download svg,.table-receipt svg { width: 14px; }.table-receipt { display: inline-flex; align-items: center; gap: 4px; color: var(--teal); font-size: 8px; font-weight: 800; }
.member-chat { position: fixed; right: 20px; bottom: 18px; z-index: 110; }.member-chat-toggle { min-width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 0 17px; border: 0; border-radius: 28px; color: white; background: var(--coral); box-shadow: 0 10px 28px rgba(8,47,73,.25); font-size: 9px; font-weight: 800; }.member-chat-toggle svg { width: 18px; }.member-chat-panel { width: min(370px,calc(100vw - 24px)); height: min(540px,calc(100vh - 110px)); display: flex; flex-direction: column; margin-bottom: 10px; overflow: hidden; border: 1px solid #cbdcdf; border-radius: 9px; background: white; box-shadow: 0 22px 55px rgba(8,47,73,.25); }.member-chat-panel>header { display: flex; justify-content: space-between; align-items: center; padding: 14px 15px; color: white; background: var(--navy); }.member-chat-panel header>div { display: flex; align-items: center; gap: 9px; }.member-chat-panel header span { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; background: #1c6075; }.member-chat-panel header svg { width: 15px; }.member-chat-panel header p { display: flex; flex-direction: column; gap: 3px; margin: 0; }.member-chat-panel header b { font-size: 9px; }.member-chat-panel header small { color: #adcad2; font-size: 7px; }.member-chat-panel header button { border: 0; color: white; background: transparent; }.chat-thread { flex: 1; overflow-y: auto; padding: 14px; background: #f3f7f8; }.chat-thread>div { display: flex; flex-direction: column; }.chat-thread p { max-width: 83%; display: flex; flex-direction: column; gap: 4px; padding: 9px 11px; margin: 4px 0; border-radius: 9px; font-size: 9px; line-height: 1.45; }.chat-thread small { opacity: .65; font-size: 6px; }.chat-member { align-self: flex-end; color: white; background: var(--teal); border-bottom-right-radius: 2px !important; }.chat-bank { align-self: flex-start; color: #38515d; background: white; border: 1px solid #dce5e8; border-bottom-left-radius: 2px !important; }.chat-bank b { color: var(--navy); }.chat-welcome { margin: 40px auto !important; color: #70858f; background: transparent !important; text-align: center; }.member-chat-panel>form { display: flex; gap: 7px; padding: 10px; border-top: 1px solid #dce5e8; }.member-chat-panel textarea { flex: 1; resize: none; padding: 9px; border: 1px solid #cbd9dd; border-radius: 5px; font-size: 9px; }.member-chat-panel form button { width: 39px; border: 0; border-radius: 50%; color: white; background: var(--teal); }.member-chat-panel form svg { width: 16px; }

.member-shell[data-theme="ocean"] { --member-primary:#062f46; --member-accent:#087f7c; --member-bg:#f2f6f7; --member-highlight:#ef6b52; --theme-image:url('/images/theme-ocean.jpg'); }
.member-shell[data-theme="emerald"] { --member-primary:#123d32; --member-accent:#25805f; --member-bg:#f1f7f3; --member-highlight:#d6a84e; --theme-image:url('/images/theme-emerald.jpg'); }
.member-shell[data-theme="midnight"] { --member-primary:#171c34; --member-accent:#655fd0; --member-bg:#f3f2f9; --member-highlight:#ef7f75; --theme-image:url('/images/theme-midnight.jpg'); }
.member-shell[data-theme="burgundy"] { --member-primary:#541f35; --member-accent:#a14262; --member-bg:#faf3f5; --member-highlight:#d99b48; --theme-image:url('/images/theme-burgundy.jpg'); }
.member-shell[data-theme] { position:relative;isolation:isolate;background:linear-gradient(rgba(247,250,251,.88),rgba(247,250,251,.94)),var(--theme-image) center/cover fixed; }
.member-shell[data-theme]:before{content:"";position:fixed;z-index:-1;inset:0;background:var(--theme-image) center/cover no-repeat;opacity:.28;filter:saturate(.9)}
.member-shell[data-theme]:after{content:"";position:fixed;z-index:-1;inset:0;pointer-events:none;background:radial-gradient(circle at 12% 90%,rgba(255,255,255,.6) 0 12px,transparent 13px),radial-gradient(circle at 88% 30%,rgba(255,255,255,.45) 0 22px,transparent 23px),radial-gradient(circle at 74% 76%,rgba(255,255,255,.35) 0 8px,transparent 9px);background-size:280px 280px,410px 410px,190px 190px;animation:themeBubbles 18s linear infinite}
.member-shell[data-theme="emerald"]:after,.member-shell[data-theme="burgundy"]:after{opacity:.45;animation:themeGlow 10s ease-in-out infinite alternate;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.22) 46%,transparent 67%)}
@keyframes themeBubbles{to{background-position:0 -280px,0 -410px,0 -190px}}@keyframes themeGlow{from{transform:translateX(-10%)}to{transform:translateX(10%)}}
.member-shell[data-theme] .member-content{position:relative}.member-shell[data-theme] .member-panel,.member-shell[data-theme] .profile-panel,.member-shell[data-theme] .member-account-card,.member-shell[data-theme] .member-table-wrap,.member-shell[data-theme] .payment-form,.member-shell[data-theme] .settings-card,.member-shell[data-theme] .card-management,.member-shell[data-theme] .member-document,.member-shell[data-theme] .conversion-form{background:rgba(255,255,255,.97);backdrop-filter:blur(10px)}.member-shell[data-theme] .member-sidebar,.member-shell[data-theme] .member-account-card header,.member-shell[data-theme] .profile-panel header { background:var(--member-primary); }.member-shell[data-theme] .member-balance-card { background:linear-gradient(135deg,var(--member-primary),var(--member-accent)); }.member-shell[data-theme] .member-status.active,.member-shell[data-theme] .member-document em { color:var(--member-accent); }.member-shell[data-theme] .member-chat-toggle,.member-shell[data-theme] .payment-submit { background:var(--member-highlight); }.member-shell[data-theme] .member-sidebar nav button.active { background:color-mix(in srgb,var(--member-accent),var(--member-primary) 45%); box-shadow:inset 3px 0 var(--member-highlight); }
.wallet-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:18px 0; }.wallet-grid article { display:flex; flex-direction:column; gap:7px; padding:18px; border:1px solid #dce5e8; border-radius:6px; background:white; }.wallet-grid small { color:#758b95; font-size:7px; letter-spacing:1px; }.wallet-grid b { color:var(--member-primary,var(--navy)); font:19px Georgia,serif; }.conversion-form { max-width:760px; padding:22px; border:1px solid #dce5e8; border-radius:7px; background:white; }.conversion-form h2 { margin:0 0 16px; color:var(--member-primary,var(--navy)); font:20px Georgia,serif; }.conversion-form>div { display:grid; grid-template-columns:1fr 1fr 1fr auto; gap:10px; align-items:end; }.conversion-form label { color:#385464; font-size:8px; font-weight:800; }.conversion-form input,.conversion-form select { width:100%; height:40px; margin-top:5px; padding:8px; border:1px solid #cbd9dd; border-radius:4px; }.conversion-form button { height:40px; padding:0 15px; border:0; border-radius:4px; color:white; background:var(--member-accent,var(--teal)); font-size:8px; font-weight:800; }.conversion-form>small { display:block; margin-top:12px; color:#7c8f98; font-size:7px; }.conversion-form>p { padding:9px; color:#27624f; background:#e7f4ee; font-size:8px; }
.recipient-verification { display:flex; align-items:center; gap:10px; margin:0 23px 14px; }.recipient-verification button { padding:9px 12px; border:1px solid var(--member-accent,var(--teal)); border-radius:4px; color:var(--member-accent,var(--teal)); background:white; font-size:8px; font-weight:800; }.recipient-verification p { margin:0; color:#41636b; font-size:8px; }
.clickable-row { cursor:pointer; }.clickable-row:hover { background:#f1f8f7; }.transaction-modal-backdrop { position:fixed; inset:0; z-index:160; display:grid; place-items:center; padding:20px; background:rgba(3,25,39,.72); }.transaction-modal { width:min(520px,100%); position:relative; padding:32px; border-radius:8px; background:white; }.transaction-modal>button:first-child { position:absolute; right:13px; top:13px; width:32px; height:32px; display:grid; place-items:center; border:0; border-radius:50%; background:#e9f0f2; }.transaction-modal>button svg { width:16px; }.transaction-modal>span { color:var(--teal); font-size:8px; font-weight:800; letter-spacing:1.5px; }.transaction-modal h2 { margin:8px 30px 20px 0; color:var(--navy); font:23px Georgia,serif; }.transaction-modal dl { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:#e1e9eb; border:1px solid #e1e9eb; }.transaction-modal dl div { padding:13px; background:#f8fbfb; }.transaction-modal dt { color:#7b8e97; font-size:7px; }.transaction-modal dd { margin:5px 0 0; color:var(--navy); font-size:9px; font-weight:800; text-transform:capitalize; }.transaction-modal>a,.download-record { width:100%; height:42px; display:flex; align-items:center; justify-content:center; gap:7px; margin-top:16px; border:0; border-radius:4px; color:white; background:var(--teal); font-size:9px; font-weight:800; }.transaction-modal a svg,.download-record svg { width:15px; }
.theme-settings { padding:13px; margin:15px 0; border:1px solid #dce5e8; border-radius:5px; }.theme-settings>b { display:block; margin-bottom:10px; color:var(--navy); font-size:9px; }.theme-settings>div { display:grid; grid-template-columns:1fr 1fr; gap:7px; }.theme-settings button { display:flex; align-items:center; gap:7px; padding:8px; border:1px solid #d3dfe3; border-radius:4px; background:white; color:#526b77; font-size:8px; }.theme-settings button.active { border-color:var(--teal); box-shadow:0 0 0 2px rgba(8,127,124,.1); }.theme-settings i { width:17px; height:17px; border-radius:50%; }.theme-settings i.ocean{background:#087f7c}.theme-settings i.emerald{background:#25805f}.theme-settings i.midnight{background:#655fd0}.theme-settings i.burgundy{background:#a14262}.settings-modal{width:min(720px,100%)}.deposit-setting-form{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;padding:13px;margin-bottom:13px;border:1px solid #dce5e8;border-radius:5px}.deposit-setting-form label{margin:0}.deposit-setting-form button,.settings-actions>button:last-child{height:42px;padding:0 12px;border:1px solid var(--teal);border-radius:4px;color:var(--teal);background:white;font-size:8px;font-weight:800}.admin-settings-section{padding:15px;margin-top:13px;border:1px solid #dce5e8;border-radius:5px}.admin-settings-section h3{display:flex;align-items:center;gap:7px;margin:0 0 12px;color:var(--navy);font:15px Georgia,serif}.admin-settings-section h3 svg{width:16px;color:var(--teal)}.admin-settings-section h3 span{margin-left:auto;padding:4px 7px;border-radius:12px;color:#83571a;background:#fff0cf;font:7px Arial}.admin-settings-section h3 span.configured{color:#28604f;background:#e1f3ea}.email-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.smtp-secure{display:flex!important;align-items:center;gap:7px}.smtp-secure input{width:auto!important;margin:0!important}.settings-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.settings-actions .ops-primary{margin-top:0}.kyc-grid dd{overflow-wrap:anywhere}@media(max-width:600px){.email-grid,.settings-actions,.deposit-setting-form{grid-template-columns:1fr}}
@media(max-width:700px){.wallet-grid{grid-template-columns:1fr 1fr}.conversion-form>div{grid-template-columns:1fr 1fr}.transaction-modal dl{grid-template-columns:1fr}}

.funding-notice{display:flex;gap:10px;padding:14px 16px;margin-bottom:16px;border:1px solid #e4cb89;border-radius:6px;color:#6e5319;background:#fff6dd}.funding-notice svg{width:20px;flex:0 0 auto}.funding-notice p{display:flex;flex-direction:column;gap:4px;margin:0}.funding-notice b{font-size:10px}.funding-notice span{font-size:8px;line-height:1.5}.funding-options{display:grid;grid-template-columns:1fr 1fr;gap:15px}.funding-options>article{padding:20px;border:1px solid #dce5e8;border-radius:7px;background:rgba(255,255,255,.97)}.funding-options article.check-funding{grid-column:1/-1}.funding-options header{display:flex;align-items:center;gap:10px;margin-bottom:14px}.crypto-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:50%;color:white;background:#ee941d;font-size:18px}.crypto-icon.usdt{background:#26a17b}.crypto-icon.check{background:var(--teal)}.funding-options h2{margin:0 0 3px;color:var(--navy);font:18px Georgia,serif}.funding-options header p{margin:0;color:#7b8e97;font-size:8px}.wallet-address{padding:11px;margin-bottom:14px;border-radius:5px;background:#eff4f5}.wallet-address small{display:block;margin-bottom:5px;color:#71858f;font-size:7px;letter-spacing:1px}.wallet-address code{display:block;overflow-wrap:anywhere;color:#173142;font-size:9px}.wallet-qr{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px;margin-bottom:12px;border:1px solid #dce5e8;border-radius:5px;background:white}.wallet-qr img{width:150px;height:150px;image-rendering:crisp-edges}.wallet-qr small{color:#607681;font-size:7px}.qr-unavailable{padding:18px;margin-bottom:12px;border:1px dashed #cbd9dd;color:#7b8e97;text-align:center;font-size:8px}.funding-options label{display:block;margin-top:10px;color:#385464;font-size:8px;font-weight:800}.funding-options input{width:100%;height:40px;margin-top:5px;padding:9px;border:1px solid #cbd9dd;border-radius:4px}.funding-options button{width:100%;height:41px;margin-top:13px;border:0;border-radius:4px;color:white;background:var(--teal);font-size:8px;font-weight:800}.funding-options button:disabled{opacity:.45}.funding-result{padding:10px;margin-top:14px;color:#27624f;background:#e7f4ee;font-size:9px}.funding-history{margin-top:18px;border:1px solid #dce5e8;border-radius:7px;background:white}.funding-history h2{margin:0;padding:15px 18px;border-bottom:1px solid #e5ebed;color:var(--navy);font:17px Georgia,serif}.funding-history article{display:flex;align-items:center;gap:12px;padding:12px 18px;border-bottom:1px solid #edf1f2}.funding-history article>span,.funding-history article>p{display:flex;flex-direction:column;gap:3px;margin:0}.funding-history article>p{flex:1;color:#526b77;font-size:9px}.funding-history b{color:var(--navy);font-size:9px}.funding-history small{color:#81939b;font-size:7px}.funding-history em{color:#76571b;font-size:7px;font-style:normal}.funding-history strong{padding:5px 7px;border-radius:12px;color:#805910;background:#fff0cc;font-size:7px;text-transform:uppercase}.funding-history strong.approved{color:#27624f;background:#dff3e9}.funding-history strong.rejected{color:#9a3428;background:#ffe3df}
.funding-review-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.funding-review-grid>article{padding:20px;border:1px solid #dce5e8;border-radius:7px;background:white}.funding-review-grid header{display:flex;justify-content:space-between;gap:10px;border-bottom:1px solid #e5ebed;padding-bottom:13px}.funding-review-grid h2{margin:7px 0 3px;color:var(--navy);font:17px Georgia,serif}.funding-review-grid header p{margin:0;color:#7b8e97;font-size:8px}.funding-review-grid header>strong{color:var(--navy);font:17px Georgia,serif}.funding-review-grid dl{display:grid;grid-template-columns:1fr 1fr;gap:12px}.funding-review-grid dt{color:var(--teal);font-size:7px;font-weight:800}.funding-review-grid dd{margin:5px 0 0;color:#536c77;font-size:8px;overflow-wrap:anywhere}.funding-document{display:flex;gap:8px;margin:10px 0}.funding-document a{padding:7px 9px;border:1px solid var(--teal);border-radius:4px;color:var(--teal);font-size:7px;font-weight:800}.funding-review-grid form label{display:block;margin-top:9px;color:#385464;font-size:8px;font-weight:800}.funding-review-grid form input{width:100%;height:38px;margin-top:5px;padding:8px;border:1px solid #cbd9dd;border-radius:4px}.funding-review-grid form>div{display:flex;gap:7px;margin-top:10px}.funding-review-grid form button{flex:1;height:37px;border:0;border-radius:4px;color:white;font-size:8px;font-weight:800}.approve-funding{background:var(--teal)}.reject-funding{background:#a94236}.funding-note{padding:8px;color:#536c77;background:#f4f7f8;font-size:8px}.admin-settings-section .modal-warning{margin-top:8px}@media(max-width:760px){.funding-options,.funding-review-grid{grid-template-columns:1fr}.funding-options article.check-funding{grid-column:auto}.live-transfer-panel article{grid-template-columns:1fr}.live-transfer-panel article button{width:max-content}.account-row-actions{flex-direction:column;align-items:flex-start}}

/* Internal banking operations */
.ops-shell { min-height: 100vh; display: grid; grid-template-columns: 250px 1fr; background: #f3f6f7; color: #173142; }
.ops-sidebar { position: sticky; top: 0; height: 100vh; z-index: 70; display: flex; flex-direction: column; color: #b9ccd4; background: #062b40; }
.ops-brand { height: 76px; display: flex; align-items: center; gap: 11px; padding: 0 20px; border-bottom: 1px solid #21475a; }
.ops-brand > span { width: 40px; height: 40px; display: grid; place-items: center; border: 2px solid var(--gold); border-radius: 50%; color: white; font: 11px Georgia,serif; }
.ops-brand div { display: flex; flex-direction: column; gap: 4px; }.ops-brand b { color: white; font: 13px Georgia,serif; letter-spacing: .5px; }.ops-brand small { font-size: 7px; letter-spacing: 1.5px; }.ops-brand button { display: none; margin-left: auto; border: 0; color: white; background: transparent; }
.ops-access { display: flex; align-items: center; gap: 10px; margin: 17px 14px; padding: 12px; border: 1px solid #2a576a; border-radius: 5px; background: #0b374c; }.ops-access svg { width: 19px; color: #71c6aa; }.ops-access div { display: flex; flex-direction: column; gap: 3px; }.ops-access b { color: white; font-size: 10px; }.ops-access small { font-size: 8px; }
.ops-sidebar nav { display: grid; gap: 3px; padding: 0 12px; }.ops-sidebar nav button, .ops-side-bottom button { min-height: 45px; display: flex; align-items: center; gap: 12px; padding: 0 13px; border: 0; border-radius: 4px; color: #b9ccd4; background: transparent; text-align: left; font-size: 11px; font-weight: 700; }.ops-sidebar nav button svg, .ops-side-bottom button svg { width: 18px; }.ops-sidebar nav button.active { color: white; background: #16526a; box-shadow: inset 3px 0 var(--coral); }.ops-sidebar nav button:hover, .ops-side-bottom button:hover { color: white; background: #103e53; }.ops-sidebar nav i { min-width: 19px; height: 19px; display: grid; place-items: center; margin-left: auto; border-radius: 20px; color: white; background: var(--coral); font-size: 8px; font-style: normal; }
.ops-side-bottom { margin-top: auto; padding: 10px 12px 20px; border-top: 1px solid #21475a; }.ops-side-bottom button { width: 100%; }.ops-side-bottom p { margin: 12px; color: #698b9a; font-size: 8px; line-height: 1.6; }
.ops-main { min-width: 0; }.ops-topbar { height: 76px; position: sticky; top: 0; z-index: 50; display: flex; align-items: center; justify-content: space-between; padding: 0 30px; border-bottom: 1px solid #dce5e8; background: rgba(255,255,255,.96); backdrop-filter: blur(12px); }.ops-menu { display: none; border: 0; background: transparent; color: var(--navy); }.ops-search { width: min(460px,48vw); display: flex; align-items: center; gap: 9px; padding: 0 13px; border: 1px solid #d3dfe3; border-radius: 5px; background: #f8fafb; }.ops-search svg { width: 16px; color: #718892; }.ops-search input { width: 100%; height: 39px; border: 0; outline: 0; background: transparent; font-size: 11px; }.ops-top-actions, .ops-top-actions > div { display: flex; align-items: center; gap: 11px; }.ops-top-actions > button { position: relative; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid #dce5e8; border-radius: 50%; color: #53707f; background: white; }.ops-top-actions button svg { width: 16px; }.ops-top-actions button i { position: absolute; right: -3px; top: -3px; width: 15px; height: 15px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--coral); font-size: 7px; font-style: normal; }.ops-top-actions > div > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; color: white; background: var(--teal); font-size: 10px; font-weight: 800; }.ops-top-actions p { display: flex; flex-direction: column; gap: 3px; margin: 0; }.ops-top-actions b { font-size: 10px; }.ops-top-actions small { color: #7d9099; font-size: 8px; }
.ops-content { max-width: 1500px; margin: auto; padding: 35px 32px 70px; }.ops-page-title { display: flex; justify-content: space-between; align-items: center; gap: 25px; margin-bottom: 27px; }.ops-page-title > div > span { color: var(--teal); font-size: 9px; font-weight: 800; letter-spacing: 1.8px; }.ops-page-title h1 { margin: 7px 0 5px; color: var(--navy); font: 34px Georgia,serif; }.ops-page-title p { margin: 0; color: #687d88; font-size: 11px; }.ops-page-title > b { color: var(--navy); font-size: 12px; }.title-actions{display:flex;align-items:center;gap:12px}.title-actions>b{color:var(--navy);font-size:11px}.title-actions button{display:flex;align-items:center;gap:6px;padding:9px 12px;border:0;border-radius:4px;color:white;background:var(--teal);font-size:8px;font-weight:800}.title-actions svg{width:14px}.admin-check{display:flex!important;align-items:center;gap:8px;padding:10px;border:1px solid #dce5e8;border-radius:4px;background:#f6f9fa}.admin-check input{width:auto!important;min-height:auto!important;margin:0!important}.admin-alert-panel>header{flex-direction:row;align-items:center}.admin-alert-panel>header>div{display:flex;flex-direction:column;gap:3px}.admin-alert-panel>header button{margin-left:auto;border:0;color:var(--teal);background:transparent;font-size:7px;font-weight:800}
.ops-badge { width: max-content; display: inline-flex; align-items: center; padding: 5px 8px; border-radius: 20px; color: #17604e; background: #dff2e9; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .5px; white-space: nowrap; }.ops-badge.amber { color: #805910; background: #fff1ce; }.ops-badge.red { color: #9a3428; background: #ffe3df; }.ops-badge.slate { color: #536b77; background: #e8eef0; }
.ops-stats { display: grid; grid-template-columns: repeat(5,1fr); gap: 12px; margin-bottom: 20px; }.ops-stats article { min-height: 118px; display: flex; align-items: flex-start; gap: 13px; padding: 21px 17px; border: 1px solid #dee7e9; border-radius: 6px; background: white; box-shadow: 0 5px 16px rgba(8,47,73,.04); }.ops-stats article > span { width: 37px; height: 37px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e7f3f1; }.ops-stats article svg { width: 18px; }.ops-stats article div { display: flex; flex-direction: column; }.ops-stats small { color: #78909a; font-size: 7px; font-weight: 800; letter-spacing: 1px; }.ops-stats b { margin: 7px 0 5px; color: var(--navy); font: 24px Georgia,serif; }.ops-stats em { color: #77909a; font-size: 8px; font-style: normal; }
.ops-overview-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }.ops-panel { border: 1px solid #dce5e8; border-radius: 6px; background: white; box-shadow: 0 5px 18px rgba(8,47,73,.04); }.ops-panel-head { min-height: 70px; display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid #e3eaec; }.ops-panel-head h2 { margin: 0 0 4px; color: var(--navy); font: 18px Georgia,serif; }.ops-panel-head p { margin: 0; color: #7a8d96; font-size: 9px; }.ops-panel-head button { display: flex; align-items: center; gap: 3px; border: 0; color: var(--teal); background: transparent; font-size: 9px; font-weight: 800; }.ops-panel-head button svg { width: 14px; }
.ops-list > div, .ops-timeline > div { min-height: 67px; display: flex; align-items: center; gap: 11px; padding: 11px 20px; border-bottom: 1px solid #edf1f2; }.avatar { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: #e2eeee; font-size: 9px; font-weight: 800; }.avatar.large { width: 45px; height: 45px; }.ops-list p, .ops-timeline p { flex: 1; display: flex; flex-direction: column; gap: 4px; margin: 0; }.ops-list b, .ops-timeline b { font-size: 10px; }.ops-list small, .ops-timeline small { color: #7a8d96; font-size: 8px; }.ops-timeline > div > span { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e6f3f0; }.ops-timeline span.debit { color: #b34a3c; background: #ffebe8; }.ops-timeline svg { width: 15px; }.empty-line { padding: 25px; color: #83959d; font-size: 10px; text-align: center; }
.customer-grid, .application-list, .message-list { display: grid; gap: 15px; }.customer-card, .application-list article, .message-list article { border: 1px solid #dce5e8; border-radius: 7px; background: white; box-shadow: 0 5px 18px rgba(8,47,73,.04); }.customer-card > header { display: flex; align-items: center; gap: 12px; padding: 19px 22px; border-bottom: 1px solid #e4ebed; }.customer-card header div { flex: 1; }.customer-card h2, .message-list h2 { margin: 0 0 4px; color: var(--navy); font: 18px Georgia,serif; }.customer-card header p, .message-list header p { margin: 0; color: #718690; font-size: 9px; }.kyc-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; padding: 21px 22px; }.kyc-grid dl { margin: 0; }.kyc-grid dt { margin-bottom: 6px; color: var(--teal); font-size: 7px; font-weight: 800; letter-spacing: 1px; }.kyc-grid dd { margin: 0; color: #526b77; font-size: 9px; line-height: 1.65; }.customer-card footer { display: flex; justify-content: space-between; padding: 13px 22px; background: #f8fafb; }.customer-card footer span, .customer-card footer a { display: flex; align-items: center; gap: 6px; color: #526b77; font-size: 9px; font-weight: 700; }.customer-card footer a { color: var(--teal); }.customer-card footer svg { width: 14px; }.customer-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }.customer-actions button { display: flex; align-items: center; gap: 5px; padding: 6px 8px; border: 1px solid #c5d5da; border-radius: 4px; color: var(--navy); background: white; font-size: 8px; font-weight: 800; }.customer-actions button:hover { border-color: var(--teal); color: var(--teal); }.customer-actions button.delete-customer{color:#9f392e;border-color:#e5b7b0}.customer-actions button.delete-customer:hover{color:white;background:#a94236;border-color:#a94236}.customer-modal { width: min(720px,100%); }.customer-edit-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 15px; }.customer-edit-grid label { margin-top: 0; }.customer-edit-grid .wide { grid-column: 1/-1; }.field-help { display: block; margin-top: 5px; color: #72868f; font-size: 8px; font-weight: 400; }
.live-transfer-panel{margin-bottom:16px;border:1px solid #e5c77c;border-radius:7px;background:#fff9e8;box-shadow:0 6px 18px rgba(112,79,18,.08)}.live-transfer-panel>header{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-bottom:1px solid #ead99f}.live-transfer-panel header>div{display:flex;align-items:center;gap:9px}.live-transfer-panel header div div{display:flex;flex-direction:column;gap:3px}.live-transfer-panel header b{color:#684c17;font-size:10px}.live-transfer-panel header small{color:#846b38;font-size:8px}.live-dot{width:10px;height:10px;border-radius:50%;background:#e45e47;box-shadow:0 0 0 5px rgba(228,94,71,.15);animation:livePulse 1.2s ease-in-out infinite}@keyframes livePulse{50%{box-shadow:0 0 0 9px rgba(228,94,71,0)}}.live-transfer-panel article{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;padding:12px 16px;border-bottom:1px solid #f0e3bd}.live-transfer-panel article:last-child{border-bottom:0}.live-transfer-panel article>div{display:flex;flex-direction:column;gap:4px}.live-transfer-panel article b{color:var(--navy);font-size:9px}.live-transfer-panel article small{color:#7c6c48;font-size:8px}.live-transfer-panel article strong{color:#6b4c12;font:15px Georgia,serif}.live-transfer-panel article button,.intercept-button{display:flex;align-items:center;gap:5px;padding:8px 10px;border:0;border-radius:4px;color:white;background:#b74938;font-size:8px;font-weight:800}.live-transfer-panel article button svg,.intercept-button svg{width:13px}.account-row-actions{display:flex;gap:5px;align-items:center}.challenge-policy-button{padding:7px 9px;border:1px solid #b98a2c;border-radius:4px;color:#765517;background:#fff7df;font-size:7px;font-weight:800}.challenge-policy-button.enabled{color:#9a3428;border-color:#dfaaa3;background:#fff0ed}
.accounts-table-wrap, .transaction-panel { overflow-x: auto; border: 1px solid #dce5e8; border-radius: 6px; background: white; }.ops-table { width: 100%; border-collapse: collapse; min-width: 760px; }.ops-table th { padding: 12px 15px; color: #70858f; background: #f5f8f9; text-align: left; font-size: 7px; letter-spacing: 1px; }.ops-table td { padding: 14px 15px; border-top: 1px solid #e5ebed; color: #4c6470; font-size: 9px; }.ops-table td b, .ops-table td small { display: block; }.ops-table td b { color: var(--navy); font-size: 10px; }.ops-table td small { margin-top: 4px; color: #83949c; font-size: 8px; }.ops-table strong { color: var(--navy); font: 14px Georgia,serif; }.account-flags { display: flex; flex-wrap: wrap; gap: 4px; }.manage-button { padding: 7px 10px; border: 1px solid var(--teal); border-radius: 4px; color: var(--teal); background: white; font-size: 8px; font-weight: 800; }.transaction-panel { margin-top: 20px; }
.application-list article > header { display: flex; align-items: center; justify-content: space-between; padding: 18px 21px; border-bottom: 1px solid #e5ebed; }.application-list h2 { margin: 8px 0 3px; color: var(--navy); font: 18px Georgia,serif; }.application-list header p { margin: 0; color: #7a8d96; font-size: 8px; }.application-list header > div:last-child { display: flex; flex-direction: column; text-align: right; gap: 4px; }.application-list header b { color: var(--navy); font-size: 11px; }.application-list header span { color: #71858f; font-size: 8px; }.activate-button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin-top: 9px; padding: 8px 11px; border: 0; border-radius: 4px; color: white; background: var(--teal); font-size: 8px; font-weight: 800; }.activate-button:hover { background: #076966; }.activate-button:disabled { opacity: .6; }.activate-button svg { width: 14px; }.application-list article > div { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; padding: 19px 21px; }.application-list article > div p { margin: 0; color: #536a75; font-size: 9px; line-height: 1.7; }.application-list article small { display: block; color: var(--teal); font-size: 7px; font-weight: 800; letter-spacing: 1px; }.application-list a { display: inline-flex; align-items: center; gap: 5px; color: var(--teal); font-weight: 800; }.application-list a svg { width: 13px; }.application-document{display:flex;flex-direction:column;gap:5px}.application-document img{width:100%;max-width:190px;height:120px;margin:6px 0;border:1px solid #d5e0e3;border-radius:4px;object-fit:cover;background:#f1f5f6}.application-document>b{color:var(--navy);font-size:8px;overflow-wrap:anywhere}.application-document .pdf-thumb{width:100%;max-width:190px;height:95px;display:flex;align-items:center;justify-content:center;gap:7px;margin:6px 0;border:1px solid #d5e0e3;border-radius:4px;color:#607680;background:#f1f5f6}.portal-copyright{display:flex;align-items:center;justify-content:center;gap:6px;padding:24px 10px 0;margin-top:35px;border-top:1px solid rgba(117,139,149,.25);color:#71858f;font-size:8px}.portal-copyright svg{width:13px;color:var(--teal)}
.document-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.document-gallery article{overflow:hidden;border:1px solid #dce5e8;border-radius:7px;background:white;box-shadow:0 5px 18px rgba(8,47,73,.05)}.document-gallery header{display:flex;align-items:center;gap:10px;padding:13px 16px;border-bottom:1px solid #e4ebed}.document-gallery header div{display:flex;flex-direction:column;gap:4px}.document-gallery header b{color:var(--navy);font-size:10px}.document-gallery header small{color:#7b8e97;font-size:8px}.document-preview{height:300px;display:grid;place-items:center;padding:14px;background:#edf2f3}.document-preview img,.document-preview iframe{width:100%;height:100%;border:0;object-fit:contain;background:white}.document-gallery footer{display:flex;align-items:center;justify-content:space-between;padding:12px 16px}.document-gallery footer>div{display:flex;gap:7px}.document-gallery footer span{color:#7a8e97;font-size:8px}.document-gallery footer a,.document-gallery footer button{display:flex;align-items:center;gap:5px;border:0;color:var(--teal);background:transparent;font-size:8px;font-weight:800}.document-gallery footer button{color:#a33d31}.document-gallery footer svg{width:13px}.document-preview{width:100%;border:0;cursor:zoom-in}.document-lightbox{position:fixed;inset:0;z-index:180;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px;background:rgba(2,18,29,.9);backdrop-filter:blur(7px);cursor:zoom-out}.document-lightbox img,.document-lightbox iframe{max-width:min(1100px,94vw);max-height:84vh;width:auto;height:auto;border:6px solid white;border-radius:5px;background:white;box-shadow:0 25px 65px rgba(0,0,0,.45)}.document-lightbox iframe{width:min(1000px,94vw);height:84vh}.document-lightbox p{color:#d5e2e7;font-size:9px}@media(max-width:750px){.document-gallery{grid-template-columns:1fr}.document-preview{height:260px}}
.notice-list { overflow: hidden; border: 1px solid #dce5e8; border-radius: 6px; background: white; }.notice-row{display:grid;grid-template-columns:1fr auto;border-bottom:1px solid #e7edef}.notice-row>button:first-child { width: 100%; min-height: 70px;display:flex;align-items:center;gap:13px;padding:13px 18px;border:0;color:var(--ink);background:white;text-align:left}.notice-row>button:first-child:hover{background:#f8fbfb}.notice-row>button:first-child>div{flex:1;display:flex;flex-direction:column;gap:5px}.notice-row>button:first-child>svg{width:15px;color:#8fa0a7}.notice-delete{width:44px;border:0;color:#a33d31;background:white}.notice-delete:hover{background:#fff0ed}.notice-delete svg{width:15px}.title-actions .danger-action{background:#a94236}.notice-list > button { width: 100%; min-height: 70px; display: flex; align-items: center; gap: 13px; padding: 13px 18px; border: 0; border-bottom: 1px solid #e7edef; color: var(--ink); background: white; text-align: left; }.notice-list > button:hover { background: #f8fbfb; }.mail-icon { width: 38px; height: 38px; display: grid; place-items: center; border-radius: 50%; color: var(--teal); background: #e5f2f0; }.mail-icon svg { width: 17px; }.notice-list button > div { flex: 1; display: flex; flex-direction: column; gap: 5px; }.notice-list b { color: var(--navy); font-size: 10px; }.notice-list small { color: #7a8d96; font-size: 8px; }.notice-list button > svg { width: 15px; color: #8fa0a7; }
.message-list { grid-template-columns: 1fr 1fr; }.message-list article { padding: 20px; }.message-list header { display: flex; align-items: center; gap: 11px; }.message-list header > div { flex: 1; }.message-list article > p { min-height: 50px; color: #546d78; font-size: 10px; line-height: 1.6; }.message-list footer { display: flex; justify-content: space-between; align-items: center; padding-top: 13px; border-top: 1px solid #e4ebed; }.message-list footer small { color: #81939b; font-size: 8px; }.message-list select { padding: 7px; border: 1px solid #cfdbdf; border-radius: 4px; color: var(--navy); background: white; font-size: 8px; }.appointment { display: flex; align-items: center; gap: 7px; padding: 9px; margin: 10px 0; color: #735311; background: #fff3d5; font-size: 9px; }.appointment svg { width: 14px; }.ops-empty { grid-column: 1/-1; padding: 55px; border: 1px dashed #cbd9dd; border-radius: 6px; color: #7b8e97; background: white; text-align: center; font-size: 11px; }
.ops-modal-backdrop { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 20px; background: rgba(3,25,39,.7); backdrop-filter: blur(4px); }.ops-modal { width: min(480px,100%); max-height: calc(100vh - 40px); overflow-y: auto; position: relative; padding: 32px; border-radius: 8px; background: white; box-shadow: 0 25px 70px rgba(0,0,0,.3); }.ops-close { position: absolute; right: 13px; top: 13px; width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: 50%; color: var(--navy); background: #eaf0f2; }.ops-close svg { width: 17px; }.ops-modal h2 { margin: 0 0 6px; color: var(--navy); font: 27px Georgia,serif; }.ops-modal > p { color: #71858f; font-size: 10px; }.ops-modal label { display: block; margin-top: 14px; color: #385464; font-size: 9px; font-weight: 800; }.ops-modal input, .ops-modal select, .ops-modal textarea { width: 100%; min-height: 42px; margin-top: 6px; padding: 10px; border: 1px solid #cbd9dd; border-radius: 4px; background: white; }.ops-modal textarea { resize: vertical; }.ops-primary { width: 100%; height: 44px; margin-top: 18px; border: 0; border-radius: 4px; color: white; background: var(--coral); font-weight: 800; }.modal-warning { display: flex; align-items: flex-start; gap: 8px; margin-top: 16px; padding: 11px; color: #7b5918; background: #fff4d9; font-size: 9px; line-height: 1.45; }.modal-warning svg { width: 16px; flex: 0 0 auto; }.modal-warning.safe { color: #27624f; background: #e7f4ee; }.ops-feedback { padding: 10px !important; color: var(--navy) !important; background: #e8f3f3; font-weight: 800; }.password-rule { display: flex; gap: 7px; align-items: center; margin-top: 13px; color: #71858f; font-size: 8px; }.password-rule svg { width: 14px; }.notice-preview { width: min(650px,100%); }.notice-meta { padding-bottom: 13px; border-bottom: 1px solid #e2eaec; }.notice-preview pre { padding: 18px; border-radius: 5px; white-space: pre-wrap; color: #435d69; background: #f5f8f9; font: 10px/1.7 Arial,sans-serif; }

:focus-visible { outline: 3px solid #e8b95c; outline-offset: 3px; }
@media (max-width: 1000px) {
  .profile-panel>div { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 800px) {
  .member-shell { grid-template-columns: 1fr; }.live-flash { left: 50%; }.member-sidebar { position: fixed; left: -260px; width: 245px; transition: left .2s; box-shadow: 15px 0 40px rgba(0,0,0,.22); }.member-sidebar.open { left: 0; }.member-brand button,.member-menu { display: grid; }.member-top { padding: 0 16px; }.member-content { padding: 28px 18px 60px; }.member-overview-grid,.support-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .member-content { padding-inline: 12px; }.payment-tabs { grid-template-columns: 1fr 1fr; }.payment-fields,.settings-grid { grid-template-columns: 1fr; }.payment-fields .wide { grid-column: auto; }.payment-source { align-items: flex-start; }.payment-source strong { font-size: 13px; }.notification-panel { position: fixed; top: 67px; right: 8px; }.member-title { align-items: flex-start; }.member-title h1 { font-size: 29px; }.member-balance-card { min-height: 170px; padding: 27px 22px; }.member-balance-card h2 { font-size: 32px; }.balance-shield { display: none; }.member-quick { grid-template-columns: 1fr; }.member-account-card>div { grid-template-columns: 1fr; }.member-account-card>div p { border-right: 0; border-bottom: 1px solid #e4ebed; }.profile-panel>div { grid-template-columns: 1fr; }.profile-panel header { align-items: flex-start; }.member-document { align-items: flex-start; }.member-document em { display: none; }
}
@media (max-width: 1150px) {
  .ops-stats { grid-template-columns: repeat(3,1fr); }
  .kyc-grid { grid-template-columns: 1fr 1fr; }
  .application-list article > div { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 850px) {
  .ops-shell { grid-template-columns: 1fr; }
  .ops-sidebar { position: fixed; left: -270px; width: 250px; transition: left .2s ease; box-shadow: 15px 0 40px rgba(0,0,0,.2); }.ops-sidebar.open { left: 0; }.ops-brand button, .ops-menu { display: grid; }
  .ops-topbar { padding: 0 18px; }.ops-menu { place-items: center; }.ops-search { width: min(420px,55vw); }.ops-content { padding-inline: 18px; }
  .ops-overview-grid { grid-template-columns: 1fr; }.message-list { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .ops-top-actions p { display: none; }.ops-search { width: 58vw; }.ops-topbar { gap: 8px; padding-inline: 10px; }.ops-content { padding: 25px 12px 60px; }
  .ops-page-title { align-items: flex-start; }.ops-page-title h1 { font-size: 28px; }.ops-page-title p { max-width: 240px; }
  .ops-stats { grid-template-columns: 1fr 1fr; }.ops-stats article { min-height: 105px; padding: 16px 12px; }.ops-stats b { font-size: 19px; }
  .kyc-grid, .application-list article > div, .customer-edit-grid { grid-template-columns: 1fr; }.customer-edit-grid .wide { grid-column: auto; }.customer-card > header { align-items: flex-start; flex-wrap: wrap; }.customer-card footer { flex-direction: column; gap: 10px; }.customer-actions { width: 100%; }
  .application-list article > header { align-items: flex-start; }.application-list header > div:last-child { max-width: 45%; }
  .ops-modal { padding: 30px 20px 22px; }.notice-list .ops-badge { display: none; }
}
@media (max-width: 1050px) {
  .desktop-nav { gap: 16px; }
  .desktop-nav a { font-size: 12px; }
  .rate-grid { grid-template-columns: 1fr 1fr; }
  .digital-grid { gap: 40px; }
  .footer-top { grid-template-columns: 1.5fr repeat(2,1fr); }
  .footer-contact { grid-column: 2; }
}
@media (max-width: 820px) {
  .container { width: min(100% - 32px, 680px); }
  .utility-inner p { display: none; }
  .utility-inner { justify-content: flex-end; }
  .utility-inner div { gap: 15px; }
  .desktop-nav, .search-button { display: none; }
  .menu-button { display: block; }
  .mobile-nav { display: block; }
  .hero, .hero-content { min-height: 650px; }
  .hero-image { background: linear-gradient(90deg, rgba(4,35,53,.98), rgba(4,35,53,.74)), url("https://images.pexels.com/photos/5638417/pexels-photo-5638417.jpeg?auto=compress&cs=tinysrgb&fit=crop&h=900&w=1000") 58% center/cover; }
  .hero-copy { width: 100%; padding-top: 60px; }
  .hero-copy > p { width: min(100%,530px); }
  .hero-trust-card { display: none; }
  .quick-grid { grid-template-columns: repeat(3,1fr); padding: 10px 0; }
  .quick-grid a { min-height: 65px; border: 0; justify-content: flex-start; }
  .quick-grid a:first-child { border: 0; }
  .section { padding: 75px 0; }
  .product-grid { grid-template-columns: 1fr 1fr; }
  .feature-split, .digital-grid, .calculator-grid, .location-card, .faq-grid { grid-template-columns: 1fr; }
  .feature-photo { min-height: 500px; }
  .feature-copy { padding: 65px 40px; }
  .digital-grid { gap: 30px; }
  .phone-visual { order: 2; }
  .calculator-grid { gap: 40px; }
  .resource-grid { grid-template-columns: 1fr 1fr; }
  .featured-resource { grid-column: 1/-1; }
  .location-card > div:first-child { padding: 45px; }
  .map-visual { min-height: 330px; }
  .faq-grid { gap: 45px; }
  .cta-inner { align-items: flex-start; flex-direction: column; }
  .footer-top { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-brand { grid-column: 1/-1; }
  .footer-contact { grid-column: auto; }
}
@media (max-width: 560px) {
  .utility-inner a:first-child { display: none; }
  .header-inner { height: 68px; }
  .brand-mark { width: 41px; height: 41px; }
  .brand-copy b { font-size: 13px; }.brand-copy small { font-size: 8px; letter-spacing: 4.3px; }
  .login-button { padding: 10px 12px; font-size: 0; }.login-button svg { margin: 0; }
  .hero, .hero-content { min-height: 610px; }
  .hero h1 { font-size: 45px; }
  .hero-copy > p { font-size: 16px; }
  .hero-buttons { flex-direction: column; align-items: stretch; width: min(100%,340px); }
  .quick-grid { grid-template-columns: 1fr 1fr; }
  .quick-grid a { font-size: 11px; }
  .quick-grid a:last-child { grid-column: 1/-1; }
  .product-grid, .rate-grid, .resource-grid { grid-template-columns: 1fr; }
  .product-card { min-height: 275px; }
  .split-heading { grid-template-columns: 1fr; gap: 10px; }
  .feature-photo { min-height: 400px; }
  .feature-copy { padding: 55px 25px; }
  .section-heading h2, .feature-copy h2, .digital-copy h2, .calculator-copy h2, .faq-grid h2, .location-card h2 { font-size: 36px; }
  .phone-visual { min-height: 570px; }
  .phone { width: 270px; }
  .secure-badge { right: 0; }
  .check-grid { grid-template-columns: 1fr; }
  .calculator-card { padding: 25px 20px; }
  .term-buttons { gap: 4px; }
  .term-buttons button { font-size: 9px; }
  .payment-result { align-items: flex-start; flex-direction: column; gap: 12px; }
  .business-stats { gap: 20px; }
  .resource-card { min-height: auto; }
  .resource-icon { margin-bottom: 25px; }
  .location-card > div:first-child { padding: 38px 24px; }
  .location-search button { padding: 0 12px; }
  .cta-inner > div:last-child { flex-direction: column; width: 100%; }.cta-inner .button { width: 100%; }
  .footer-top { grid-template-columns: 1fr 1fr; gap: 35px 25px; }
  .footer-brand { grid-column: 1/-1; }.footer-contact { grid-column: 1/-1; }
  .footer-bottom { grid-template-columns: 1fr; text-align: center; }.footer-bottom > div, .footer-bottom nav { justify-content: center; }.footer-bottom p { margin: 0; }
  .chat-button span { display: none; }.chat-button { width: 48px; height: 48px; padding: 0; justify-content: center; }
  .modal-card { padding: 38px 22px 25px; }
  .form-row { grid-template-columns: 1fr; }
  .wide-modal { padding-inline: 18px; }
  .opening-deposit { grid-template-columns:1fr; }
  .opening-heading h2, .account-created h2 { font-size: 28px; }
  .form-grid.three, .form-grid.two { grid-template-columns: 1fr; }
  .form-grid label.wide { grid-column: auto; }
  .opening-actions { justify-content: space-between; }
  .opening-actions .button { min-width: 130px; padding-inline: 14px; }
  .account-receipt { grid-template-columns: 1fr; }
  .admin-header { height: auto; padding-block: 15px; align-items: flex-start; }
  .admin-header > div:last-child { flex-direction: column; align-items: flex-end; }
  .admin-container { width: calc(100% - 28px); padding: 35px 0; }
  .admin-title { align-items: flex-start; gap: 20px; }.admin-title h1 { font-size: 31px; }
  .admin-record-head { flex-direction: column; }.admin-record-head > div:last-child { text-align: left; }
  .admin-records dl { grid-template-columns: 1fr 1fr; }
}