/* ============================================
   VARDYNI CAPITAL — Design System
   ============================================ */
:root{
  --green:#0f4c15;
  --green-deep:#0a3510;
  --green-soft:#e9f1ea;
  --gold:#ce9d41;
  --gold-light:#e8c273;
  --gold-soft:#f6ecd6;
  --ink:#1c211d;
  --muted:#5c665e;
  --paper:#ffffff;
  --canvas:#f7f8f5;
  --line:#e4e8e2;
  --radius:14px;
  --shadow:0 10px 40px rgba(15,76,21,.08);
  --shadow-lg:0 24px 60px rgba(15,76,21,.14);
  --serif:'Fraunces',Georgia,serif;
  --sans:'Plus Jakarta Sans',system-ui,sans-serif;
  --wrap:1240px;
  --shadow-glow:0 0 0 1px rgba(206,157,65,.28),0 20px 50px rgba(206,157,65,.18),0 8px 24px rgba(15,76,21,.08);
  --shadow-glow-hover:0 0 0 1px rgba(206,157,65,.4),0 28px 64px rgba(206,157,65,.28),0 12px 32px rgba(15,76,21,.1);
  --gold-ring:0 0 0 1px rgba(206,157,65,.2);
  --gold-glow-sm:0 4px 22px rgba(206,157,65,.16),0 0 20px rgba(206,157,65,.08);
  --gold-glow-md:0 8px 36px rgba(206,157,65,.22),0 0 32px rgba(206,157,65,.1);
  --gold-glow-lg:0 16px 56px rgba(206,157,65,.26),0 0 48px rgba(206,157,65,.12);
  --gold-glow-xl:0 24px 72px rgba(206,157,65,.3),0 0 64px rgba(206,157,65,.14);
  --grad-gold:linear-gradient(120deg,var(--gold),var(--gold-light) 50%,var(--gold));
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--sans);color:var(--ink);line-height:1.6;overflow-x:hidden;
  background:
    radial-gradient(1200px 800px at 12% -10%,rgba(15,76,21,.035),transparent 55%),
    radial-gradient(1000px 700px at 100% 8%,rgba(206,157,65,.045),transparent 55%),
    var(--canvas);
}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
section{position:relative}

/* Premium golden glow surfaces */
.glow-surface{box-shadow:var(--gold-glow-md)}
.glow-bar{box-shadow:var(--gold-glow-md),inset 0 -1px 0 rgba(206,157,65,.18)}
.brand img{box-shadow:var(--gold-glow-sm),0 0 24px rgba(206,157,65,.2)}

/* Typography */
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.1;letter-spacing:-.01em}
.eyebrow{font-family:var(--sans);font-weight:700;font-size:.78rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:14px;display:inline-block;text-shadow:0 0 24px rgba(206,157,65,.25)}
.lead{font-size:1.12rem;color:var(--muted);max-width:620px}
.lead a{color:var(--green);font-weight:600}
.lead ul,.lead ol{margin:12px 0;padding-left:22px}
.lead li{margin:4px 0}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 30px;border-radius:40px;font-family:var(--sans);font-weight:600;font-size:.95rem;cursor:pointer;border:none;transition:.35s cubic-bezier(.2,.8,.2,1);white-space:nowrap;position:relative;overflow:hidden;box-shadow:var(--gold-glow-sm)}
.btn[disabled]{opacity:.7;cursor:not-allowed;transform:none!important}
.btn .btn-label{display:inline-flex;align-items:center;gap:10px}
.btn-primary{background:var(--green);color:#fff}
.btn-primary:hover{background:var(--gold);transform:translateY(-2px);box-shadow:var(--gold-glow-md)}
.btn-gold{background:var(--gold);color:var(--green-deep)}
.btn-gold:hover{background:var(--gold-light);transform:translateY(-2px);box-shadow:var(--gold-glow-md)}
.btn-ghost{background:transparent;color:var(--green);border:1.5px solid var(--green);box-shadow:none}
.btn-ghost:hover{background:var(--green);color:#fff;box-shadow:var(--gold-glow-sm)}
.btn-light{background:#fff;color:var(--green)}
.btn-light:hover{background:var(--gold-soft);box-shadow:var(--gold-glow-sm)}
.btn-primary::after,.btn-gold::after,.btn-light::after{content:'';position:absolute;top:0;left:-60%;width:45%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.45),transparent);transform:skewX(-20deg);transition:left .65s cubic-bezier(.2,.8,.2,1)}
.btn-primary:hover::after,.btn-gold:hover::after,.btn-light:hover::after{left:130%}

/* ============ HEADER ============ */
.site-header-wrap{position:fixed;top:0;left:0;width:100%;z-index:1000}
.nav-utility{background:linear-gradient(90deg,var(--green-deep),var(--green));color:#fff;border-bottom:1px solid rgba(206,157,65,.2);box-shadow:0 4px 24px rgba(206,157,65,.12)}
.nav-utility-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:40px;font-size:.82rem}
.nav-utility-note{display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.82);font-weight:500}
.nav-utility-note i{color:var(--gold)}
.nav-utility-links{display:flex;align-items:center;gap:10px}
.util-link{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:30px;font-weight:700;color:#fff;border:1px solid rgba(206,157,65,.35);background:rgba(206,157,65,.12);transition:.25s;box-shadow:0 0 20px rgba(206,157,65,.15)}
.util-link:hover{background:var(--gold);color:var(--green-deep);border-color:var(--gold);box-shadow:var(--gold-glow-md)}
.util-login{background:rgba(255,255,255,.1)}
.util-logout{background:transparent;border-color:transparent;box-shadow:none;padding:7px 10px;opacity:.8}
.util-logout:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2);color:#fff;box-shadow:none;opacity:1}
header{position:relative;width:100%;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-bottom:1px solid rgba(206,157,65,.14);transition:.35s;box-shadow:var(--gold-glow-md)}
header.scrolled,.site-header-wrap.scrolled header{box-shadow:var(--gold-glow-lg);border-bottom:1px solid rgba(206,157,65,.22)}
header .wrap{max-width:1360px}
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:88px;padding:10px 0}
.brand{display:flex;align-items:center;gap:16px;flex-shrink:0}
.brand img{height:50px;width:auto;border-radius:8px}
.brand .bt{display:flex;flex-direction:column;line-height:1}
.brand .bt b{font-family:var(--serif);font-size:1.28rem;color:var(--green);letter-spacing:-.02em;text-shadow:0 0 28px rgba(206,157,65,.15)}
.brand .bt span{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-top:4px;text-shadow:0 0 20px rgba(206,157,65,.25)}
.menu{display:flex;align-items:center;gap:4px;list-style:none;flex:1;justify-content:center;min-width:0}
.menu li{padding:0 2px}
.menu a{font-weight:600;font-size:.9rem;color:var(--ink);position:relative;padding:10px 12px;border-radius:10px;transition:.25s;white-space:nowrap}
.menu a::after{content:'';position:absolute;left:12px;right:12px;bottom:6px;height:2px;background:var(--gold);border-radius:2px;transform:scaleX(0);transition:.3s;box-shadow:0 0 12px rgba(206,157,65,.55)}
.menu a:hover::after,.menu a.active::after{transform:scaleX(1)}
.menu a:hover,.menu a.active{color:var(--green);background:rgba(206,157,65,.08);box-shadow:0 0 20px rgba(206,157,65,.08)}
.menu a.active{color:var(--green)}
.menu-cta-item{display:none}
.nav-drop{position:relative}
.nav-drop-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:none;cursor:pointer;font:inherit;font-weight:600;font-size:.9rem;color:var(--ink);padding:10px 12px;border-radius:10px;transition:.25s;white-space:nowrap}
.nav-drop-btn i{font-size:.68rem;transition:.25s}
.nav-drop.open .nav-drop-btn,.nav-drop:hover .nav-drop-btn,.nav-drop.active .nav-drop-btn{color:var(--green);background:rgba(206,157,65,.08)}
.nav-drop.open .nav-drop-btn i{transform:rotate(180deg)}
.nav-drop-menu{position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(8px);min-width:200px;background:#fff;border:1px solid rgba(206,157,65,.16);border-radius:14px;box-shadow:var(--gold-glow-lg);padding:8px;list-style:none;opacity:0;visibility:hidden;transition:.25s;z-index:20}
.nav-drop.open .nav-drop-menu,.nav-drop:hover .nav-drop-menu{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.nav-drop-menu a{display:block;padding:11px 14px;border-radius:10px;font-size:.9rem;font-weight:600;color:var(--ink);white-space:nowrap}
.nav-drop-menu a:hover,.nav-drop-menu a.active{background:rgba(206,157,65,.1);color:var(--green)}
.nav-cta{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-phone{padding:11px 18px!important;font-size:.84rem!important}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px;flex-shrink:0}
.burger span{width:26px;height:2.5px;background:var(--green);border-radius:2px;transition:.3s;box-shadow:0 0 8px rgba(206,157,65,.3)}

/* ============ HERO ============ */
.hero{min-height:100vh;display:flex;align-items:center;padding:168px 0 100px;background:
  radial-gradient(900px 500px at 15% 20%,rgba(206,157,65,.12),transparent 60%),
  radial-gradient(1200px 600px at 80% -10%,rgba(206,157,65,.18),transparent 60%),
  linear-gradient(180deg,#fbfcfa,#f2f5ef)}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:60px;align-items:center}
.hero h1{font-size:clamp(2.6rem,5.4vw,4.4rem);color:var(--green-deep)}
.hero h1 em{font-style:normal;color:var(--gold);position:relative;text-shadow:0 0 40px rgba(206,157,65,.35)}
.hero h1 em::after{content:'';position:absolute;left:0;right:0;bottom:-4px;height:8px;background:radial-gradient(ellipse at center,rgba(206,157,65,.35),transparent 70%);filter:blur(4px);pointer-events:none}
.hero p.lead{margin:26px 0 34px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-stats{display:flex;gap:40px;margin-top:52px;flex-wrap:wrap}
.hero-stats .s b{font-family:var(--serif);font-size:2rem;color:var(--green);display:block;text-shadow:0 0 24px rgba(206,157,65,.12)}
.hero-stats .s span{font-size:.82rem;color:var(--muted);font-weight:600}
.hero-visual{position:relative;padding:36px 32px 52px 24px}
.hero-card{background:#fff;border-radius:24px;box-shadow:var(--gold-glow-xl);padding:34px 34px 42px;position:relative;overflow:visible;border:1px solid rgba(206,157,65,.2);min-height:420px}
.hero-card::before{content:'';position:absolute;top:-50px;right:-50px;width:220px;height:220px;background:radial-gradient(circle,rgba(206,157,65,.28),transparent 68%);pointer-events:none}
.hero-card::after{content:'';position:absolute;inset:-1px;border-radius:24px;padding:1px;background:linear-gradient(145deg,rgba(206,157,65,.35),rgba(206,157,65,.05) 40%,rgba(206,157,65,.2));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.hero-card .chip{display:inline-flex;align-items:center;gap:8px;background:var(--green-soft);color:var(--green);font-weight:700;font-size:.78rem;padding:7px 14px;border-radius:30px;margin-bottom:20px;box-shadow:var(--gold-glow-sm)}
.mini-chart{display:flex;align-items:flex-end;gap:10px;height:150px;margin:10px 0 24px}
.mini-chart span{flex:1;background:linear-gradient(var(--green),var(--gold));border-radius:8px 8px 0 0;animation:grow 1.1s cubic-bezier(.2,.8,.2,1) backwards;box-shadow:0 0 16px rgba(206,157,65,.2)}
@keyframes grow{from{height:0!important;opacity:.3}}
.hero-card .row{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid var(--line)}
.hero-card .row:last-of-type{margin-bottom:8px}
.hero-card .row b{color:var(--green)}
.hero-card .row b.gain{color:var(--gold);text-shadow:0 0 20px rgba(206,157,65,.4)}
.floaty{position:absolute;background:#fff;border-radius:14px;box-shadow:var(--gold-glow-md);padding:14px 18px;display:flex;align-items:center;gap:12px;font-weight:600;font-size:.9rem;border:1px solid rgba(206,157,65,.18);z-index:2}
.floaty i{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--gold-soft);color:var(--gold);box-shadow:0 0 16px rgba(206,157,65,.25)}
.floaty.f1{top:-20px;left:-20px;animation:bob 4s ease-in-out infinite}
.floaty.f2{bottom:-18px;right:-18px;animation:bob 4s ease-in-out infinite .8s}
@keyframes bob{50%{transform:translateY(-12px)}}

/* ============ SECTION BASICS ============ */
.sec{padding:100px 0}
.sec-head{text-align:center;max-width:680px;margin:0 auto 60px}
.sec-head h2{font-size:clamp(2rem,3.6vw,2.9rem);color:var(--green-deep)}
.sec-head p{color:var(--muted);margin-top:16px;font-size:1.05rem;line-height:1.7}
.bg-white{background:var(--paper)}
.bg-green{background:var(--green);color:#fff}
.bg-green .sec-head h2,.bg-green .eyebrow{color:#fff}
.bg-green .eyebrow{color:var(--gold)}

/* Cards grid */
.grid{display:grid;gap:26px}
.g4{grid-template-columns:repeat(4,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}

.card{background:#fff;border:1px solid rgba(206,157,65,.1);border-radius:var(--radius);padding:34px 28px;transition:.35s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden;box-shadow:var(--gold-glow-sm)}
.card::before{content:'';position:absolute;top:-36px;right:-36px;width:130px;height:130px;background:radial-gradient(circle,var(--gold-soft),transparent 70%);opacity:0;transition:.4s}
.card::after{content:'';position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--gold);transition:.35s}
.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-glow-hover);border-color:rgba(206,157,65,.22)}
.card:hover::before{opacity:1}
.card:hover::after{width:100%}
.card .ic{width:60px;height:60px;border-radius:14px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;font-size:1.5rem;margin-bottom:22px;transition:.3s;position:relative}
.card:hover .ic{background:var(--gold);color:#fff;transform:rotate(-6deg)}
.card h3{font-size:1.25rem;margin-bottom:10px;color:var(--ink);position:relative}
.card p{color:var(--muted);font-size:.96rem;line-height:1.65;position:relative}
.card .more{margin-top:16px;color:var(--green);font-weight:700;font-size:.9rem;display:inline-flex;gap:6px;align-items:center;position:relative}

/* Life goals */
.goals{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.goal{text-align:center;padding:30px 20px;border-radius:var(--radius);background:var(--canvas);transition:.35s;border:1px solid rgba(206,157,65,.08);box-shadow:var(--gold-glow-sm)}
.goal:hover{background:#fff;box-shadow:var(--gold-glow-md);border-color:rgba(206,157,65,.18);transform:translateY(-6px)}
.goal .gic{width:72px;height:72px;margin:0 auto 18px;border-radius:50%;background:var(--gold-soft);display:grid;place-items:center;font-size:1.8rem;color:var(--gold)}
.goal h4{font-family:var(--serif);font-size:1.15rem;color:var(--green-deep);margin-bottom:8px}
.goal p{color:var(--muted);font-size:.9rem}

/* About split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.split-img{border-radius:20px;overflow:hidden;box-shadow:var(--shadow-lg);position:relative;aspect-ratio:4/3}
.split-img img{width:100%;height:100%;object-fit:cover}
.tick{display:flex;gap:14px;margin-top:20px}
.tick i{color:var(--green);background:var(--green-soft);width:34px;height:34px;border-radius:9px;display:grid;place-items:center;flex-shrink:0}
.tick b{display:block;margin-bottom:2px}
.tick span{color:var(--muted);font-size:.92rem}

/* Founders */
.founders{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.founder{text-align:center;padding:28px 22px 32px;background:#fff;border:1px solid rgba(206,157,65,.12);border-radius:var(--radius);box-shadow:var(--gold-glow-sm);transition:.35s}
.founder:hover{transform:translateY(-6px);box-shadow:var(--gold-glow-md);border-color:rgba(206,157,65,.22)}
.founder-photo{width:100%;aspect-ratio:4/5;max-width:260px;margin:0 auto 22px;border-radius:16px;overflow:hidden;box-shadow:var(--gold-glow-md);border:2px solid rgba(206,157,65,.18)}
.founder-photo img{width:100%;height:100%;object-fit:cover;object-position:center top}
.founder h3{font-family:var(--serif);font-size:1.2rem;color:var(--green-deep);margin-bottom:12px}
.founder p{color:var(--muted);font-size:.94rem;line-height:1.7;text-align:left}

/* Stats band */
.band{background:var(--green-deep);color:#fff;border-radius:24px;padding:56px 40px;display:grid;grid-template-columns:repeat(4,1fr);gap:30px;text-align:center;box-shadow:var(--gold-glow-lg);border:1px solid rgba(206,157,65,.15)}
.band .st b{font-family:var(--serif);font-size:2.6rem;color:var(--gold);display:block}
.band .st span{font-size:.9rem;color:rgba(255,255,255,.75);font-weight:600}

/* Calculator */
.calc-wrap{max-width:900px;margin:0 auto}
.calc-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:34px}
.calc-tabs button{padding:11px 22px;border-radius:30px;border:1.5px solid var(--line);background:#fff;font-weight:600;cursor:pointer;transition:.25s;color:var(--muted)}
.calc-tabs button.active{background:var(--green);color:#fff;border-color:var(--green)}
.calc-card{background:#fff;border-radius:20px;box-shadow:var(--gold-glow-md);padding:40px;display:grid;grid-template-columns:1fr 1fr;gap:44px;border:1px solid rgba(206,157,65,.1)}
.calc-inputs .field{margin-bottom:26px}
.calc-inputs label{display:flex;justify-content:space-between;font-weight:600;font-size:.92rem;margin-bottom:12px}
.calc-inputs label b{color:var(--green)}
.calc-inputs input[type=range]{width:100%;accent-color:var(--gold);height:6px}
.calc-result{background:linear-gradient(160deg,var(--green),var(--green-deep));border-radius:16px;color:#fff;padding:34px;display:flex;flex-direction:column;justify-content:center;box-shadow:inset 0 0 40px rgba(206,157,65,.08),var(--gold-glow-sm);border:1px solid rgba(206,157,65,.12)}
.calc-result .big{font-family:var(--serif);font-size:2.6rem;color:var(--gold);margin:6px 0 20px}
.calc-result .rr{display:flex;justify-content:space-between;padding:12px 0;border-top:1px solid rgba(255,255,255,.14);font-size:.95rem}
.calc-result .rr span{color:rgba(255,255,255,.7)}
.calc-result .chart-wrap{border-top:1px solid rgba(255,255,255,.14);margin-top:14px;padding-top:16px}
.calc-result canvas{width:100%;height:110px;display:block}

/* Testimonials */
.quote{background:#fff;border-radius:var(--radius);padding:34px;border:1px solid rgba(206,157,65,.1);position:relative;box-shadow:var(--gold-glow-sm)}
.quote .qm{font-family:var(--serif);font-size:3.4rem;color:var(--gold-soft);line-height:.6;position:absolute;top:22px;right:26px}
.quote p{color:var(--ink);font-size:1rem;position:relative;z-index:1}
.quote .who{display:flex;align-items:center;gap:12px;margin-top:22px}
.quote .av{width:46px;height:46px;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-weight:700;font-family:var(--serif)}
.quote .who b{display:block;font-size:.95rem}
.quote .who span{font-size:.82rem;color:var(--muted)}

/* CTA strip */
.cta-strip{background:linear-gradient(120deg,var(--green),var(--green-deep));border-radius:24px;padding:60px;text-align:center;color:#fff;position:relative;overflow:hidden;box-shadow:var(--gold-glow-lg);border:1px solid rgba(206,157,65,.18)}
.cta-strip::before{content:'';position:absolute;top:-60px;right:-40px;width:260px;height:260px;background:radial-gradient(circle,rgba(206,157,65,.3),transparent 70%)}
.cta-strip h2{font-size:clamp(1.9rem,3.4vw,2.7rem);position:relative}
.cta-strip p{color:rgba(255,255,255,.82);margin:16px auto 30px;max-width:520px;position:relative}

/* Page hero (inner pages) */
.phero{padding:188px 0 70px;background:linear-gradient(180deg,#fbfcfa,#f2f5ef);text-align:center}
.phero h1{font-size:clamp(2.2rem,4.4vw,3.4rem);color:var(--green-deep)}
.phero .crumb{color:var(--muted);font-size:.9rem;margin-top:14px}
.phero .crumb a{color:var(--green);font-weight:600}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:50px;align-items:start}
.info-card{background:#fff;border:1px solid rgba(206,157,65,.1);border-radius:var(--radius);padding:26px;display:flex;gap:16px;margin-bottom:18px;box-shadow:var(--gold-glow-sm)}
.info-card i{width:48px;height:48px;border-radius:12px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;font-size:1.2rem;flex-shrink:0}
.info-card b{display:block;margin-bottom:4px}
.info-card span,.info-card a{color:var(--muted);font-size:.94rem}
.form{background:#fff;border:1px solid rgba(206,157,65,.1);border-radius:var(--radius);padding:38px;box-shadow:var(--gold-glow-sm)}
.form .fr{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form .f{margin-bottom:18px}
.form label{font-weight:600;font-size:.9rem;display:block;margin-bottom:8px}
.form input,.form select,.form textarea{width:100%;padding:13px 16px;border:1.5px solid var(--line);border-radius:10px;font-family:var(--sans);font-size:.95rem;transition:.2s;background:var(--canvas)}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(206,157,65,.12)}
.form textarea{resize:vertical;min-height:120px}
.alert{padding:14px 18px;border-radius:10px;margin-bottom:22px;font-weight:600;font-size:.92rem}
.alert.ok{background:var(--green-soft);color:var(--green);border:1px solid #bcd6be}
.alert.err{background:#fdecec;color:#b93a3a;border:1px solid #f3c6c6}
.alert.warn{background:#fff8e6;color:#9a6b00;border:1px solid #f3d08a}

.vd-modal-overlay{position:fixed;inset:0;background:rgba(15,36,25,.55);display:flex;align-items:center;justify-content:center;z-index:2000;padding:20px}
.vd-modal{background:#fff;border-radius:16px;padding:26px 28px;max-width:440px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.25)}
.vd-modal h3{font-family:var(--serif);color:var(--green-deep);font-size:1.2rem;margin-bottom:8px}
.vd-modal p{color:var(--muted);font-size:.9rem;line-height:1.5;margin-bottom:14px}
.vd-modal-link{background:var(--canvas);border:1px solid var(--line);border-radius:8px;padding:10px 12px;font-size:.78rem;word-break:break-all;color:var(--ink);margin-bottom:18px;max-height:80px;overflow-y:auto}
.vd-modal-actions{display:flex;flex-wrap:wrap;gap:10px}

.sync-progress{margin-top:14px}
.sync-progress-bar{height:10px;border-radius:6px;background:var(--canvas);border:1px solid var(--line);overflow:hidden}
.sync-progress-fill{height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--green-deep));transition:width .25s ease;border-radius:6px}
.sync-progress-label{font-size:.8rem;color:var(--muted);margin-top:6px}

.ekyc-opt{display:flex;gap:10px;align-items:flex-start;padding:11px 13px;margin-bottom:10px;
  border:1px solid var(--line);border-radius:10px;background:var(--canvas);cursor:pointer;transition:.2s}
.ekyc-opt:hover{border-color:rgba(206,157,65,.4)}
.ekyc-opt input{margin-top:3px;flex-shrink:0}
.ekyc-opt span{font-size:.8rem;color:var(--muted);line-height:1.5}
.ekyc-opt b{display:block;color:var(--green-deep);font-size:.86rem;margin-bottom:2px}

/* Product list page */
.prod{display:grid;grid-template-columns:auto 1fr;gap:24px;background:#fff;border:1px solid rgba(206,157,65,.1);border-radius:var(--radius);padding:30px;transition:.35s;position:relative;overflow:hidden;box-shadow:var(--gold-glow-sm)}
.prod::before{content:'';position:absolute;top:-36px;right:-36px;width:130px;height:130px;background:radial-gradient(circle,var(--gold-soft),transparent 70%);opacity:0;transition:.4s}
.prod:hover{box-shadow:var(--shadow-glow-hover);transform:translateY(-4px);border-color:rgba(206,157,65,.2)}
.prod:hover::before{opacity:1}
.prod .pic{width:70px;height:70px;border-radius:16px;background:var(--green-soft);color:var(--green);display:grid;place-items:center;font-size:1.8rem;position:relative;transition:.3s}
.prod:hover .pic{background:var(--gold);color:#fff;transform:rotate(-6deg)}
.prod h3{color:var(--green-deep);margin-bottom:8px;position:relative}
.prod p{color:var(--muted);font-size:.96rem;line-height:1.65;position:relative}

/* Trust strip */
.trust-strip{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:48px;position:relative}
.trust-chip{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid rgba(206,157,65,.12);border-radius:40px;padding:12px 22px;font-weight:600;font-size:.85rem;color:var(--ink);box-shadow:var(--gold-glow-sm);transition:.3s}
.trust-chip:hover{transform:translateY(-3px);box-shadow:var(--gold-glow-md)}
.trust-chip i{color:var(--gold);font-size:1rem}
.trust-chip.placeholder{font-style:italic;color:var(--muted);border-style:dashed;background:var(--canvas);box-shadow:none}

/* Duotone image treatment */
.duotone{position:relative}
.duotone::after{content:'';position:absolute;inset:0;background:linear-gradient(160deg,rgba(15,76,21,.32),rgba(206,157,65,.18));mix-blend-mode:multiply;pointer-events:none}

/* ============ AUTH (client login) ============ */
.auth-shell{min-height:100vh;display:flex}

/* Left brand panel */
.auth-side{flex:1 1 44%;background:linear-gradient(160deg,var(--green),var(--green-deep));color:#fff;padding:56px 60px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.auth-side::before{content:'';position:absolute;top:-90px;right:-90px;width:320px;height:320px;background:radial-gradient(circle,rgba(206,157,65,.28),transparent 70%)}
.auth-side::after{content:'';position:absolute;bottom:-110px;left:-70px;width:300px;height:300px;background:radial-gradient(circle,rgba(255,255,255,.07),transparent 70%)}
.auth-side-top,.auth-side-body,.auth-side-foot{position:relative}
.auth-side-body{margin:50px 0}
.auth-side-body h2{font-family:var(--serif);font-weight:600;font-size:2.1rem;line-height:1.25;margin-bottom:16px}
.auth-side-body p{color:rgba(255,255,255,.78);margin-bottom:8px;max-width:420px;font-size:1.02rem}
.tick-light{display:flex;gap:14px;margin-top:22px}
.tick-light i{color:#fff;background:rgba(255,255,255,.14);width:36px;height:36px;border-radius:10px;display:grid;place-items:center;flex-shrink:0}
.tick-light b{display:block;margin-bottom:2px;color:#fff;font-size:.98rem}
.tick-light span{color:rgba(255,255,255,.68);font-size:.88rem}
.auth-side-foot{font-size:.8rem;color:rgba(255,255,255,.55)}
.auth-mini-chart{display:flex;align-items:flex-end;gap:8px;height:70px;margin-top:36px;max-width:320px}
.auth-mini-chart span{flex:1;background:linear-gradient(#fff,var(--gold));opacity:.85;border-radius:6px 6px 0 0}

/* Right form panel */
.auth-form-side{flex:1 1 56%;display:flex;align-items:center;justify-content:center;padding:48px 24px;background:var(--canvas)}
.auth-card{background:#fff;border-radius:24px;box-shadow:var(--gold-glow-lg);padding:46px 44px;max-width:440px;width:100%;border:1px solid rgba(206,157,65,.12)}
.auth-logo{display:flex;align-items:center;gap:12px}
.auth-logo img{height:46px;width:auto;border-radius:6px}
.auth-logo .bt{display:flex;flex-direction:column;line-height:1}
.auth-logo .bt b{font-family:var(--serif);font-size:1.15rem;color:var(--green)}
.auth-logo .bt span{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);font-weight:700;margin-top:3px}
.auth-logo-light .bt b{color:#fff}
.auth-h1{font-family:var(--serif);font-size:1.7rem;color:var(--green-deep);margin-top:26px}
.auth-sub{color:var(--muted);margin:8px 0 26px;font-size:.92rem}
.auth-form .f{margin-bottom:18px}
.auth-form label{font-weight:600;font-size:.9rem;display:block;margin-bottom:8px}
.auth-form input{width:100%;padding:13px 16px;border:1.5px solid var(--line);border-radius:10px;font-family:var(--sans);font-size:.95rem;transition:.2s;background:var(--canvas)}
.auth-form input:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(206,157,65,.12)}
.pwd-wrap{position:relative}
.pwd-wrap input{padding-right:46px}
.pwd-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--muted);cursor:pointer;padding:6px;display:flex}
.pwd-toggle:hover{color:var(--green)}
.auth-row{display:flex;justify-content:space-between;align-items:center;margin:2px 0 22px;font-size:.86rem;flex-wrap:wrap;gap:8px}
.auth-check{display:flex;align-items:center;gap:8px;color:var(--muted);cursor:pointer}
.auth-check input{width:16px;height:16px;accent-color:var(--green)}
.auth-row a{color:var(--green);font-weight:600}
.auth-note{margin-top:22px;font-size:.82rem;color:var(--muted);text-align:center}
.auth-note a{color:var(--green);font-weight:600}

.auth-tabs{display:flex;gap:8px;margin-bottom:18px;background:var(--bg);padding:4px;border-radius:12px;border:1px solid var(--line)}
.auth-tab{flex:1;text-align:center;padding:10px 12px;border-radius:9px;font-size:.86rem;font-weight:700;color:var(--muted);text-decoration:none}
.auth-tab.active{background:#fff;color:var(--green-deep);box-shadow:0 1px 4px rgba(12,24,18,.06)}
/* The tabs began life as links. As <button> they need the UA styles reset,
   or they render grey, boxed and in the browser's default font. */
button.auth-tab{border:0;background:transparent;font-family:var(--sans);cursor:pointer;transition:background .15s,color .15s}
button.auth-tab:hover:not(.active){color:var(--green-deep)}
button.auth-tab:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
/* "PAN & Password" wraps to two lines on a narrow phone and leaves the tab
   strip looking lopsided against the single-line one beside it. */
@media(max-width:420px){.auth-tab{font-size:.78rem;padding:10px 6px;white-space:nowrap}}

/* ── OTP widget ───────────────────────────────────────────────────────────
   The code entry used to be a bare <input maxlength="6"> that inherited no
   styling at all, because the form-field rules are scoped to .auth-form and
   this markup sits outside one. */
.otp .f{margin-bottom:16px}
.otp .f label{display:block;margin-bottom:7px;font-size:.82rem;font-weight:600;color:var(--green-deep)}
.otp-hint{margin:7px 0 0;font-size:.78rem;color:var(--muted)}
.otp-foot{margin-top:18px}

.otp-text-input{width:100%;padding:13px 16px;border:1.5px solid var(--line);border-radius:10px;
  font-family:var(--sans);font-size:.95rem;background:var(--canvas);color:inherit}
.otp-text-input:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(206,157,65,.12)}
#otpPan{letter-spacing:.12em;font-weight:600}

.otp-primary{width:100%;justify-content:center}
.otp-primary.is-busy{opacity:.65;pointer-events:none}

/* Channel chooser */
.otp-channels{display:flex;gap:10px;margin-bottom:18px}
.otp-channel{flex:1;display:flex;align-items:center;gap:10px;padding:12px 13px;border:1.5px solid var(--line);
  border-radius:12px;background:var(--canvas);cursor:pointer;font-family:var(--sans);text-align:left;
  transition:border-color .15s,background .15s,box-shadow .15s}
.otp-channel i{font-size:1rem;color:var(--muted);flex:0 0 auto}
.otp-channel span{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.otp-channel b{font-size:.85rem;font-weight:700;color:var(--green-deep)}
.otp-channel small{font-size:.72rem;color:var(--muted)}
.otp-channel.active{border-color:var(--green);background:#fff;box-shadow:0 0 0 3px rgba(30,58,36,.07)}
.otp-channel.active i{color:var(--green)}
.otp-channel:disabled{opacity:.45;cursor:not-allowed}
.otp-channel:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

.otp-notice{margin-bottom:14px;padding:10px 13px;border-radius:10px;background:rgba(206,157,65,.09);
  border:1px solid rgba(206,157,65,.28);font-size:.82rem;color:var(--green-deep)}

/* Two-step progress on the change-password page. Both steps are always
   listed, so the second one is visibly pending rather than absent. */
.cp-steps{display:flex;gap:8px;list-style:none;margin:0 0 22px;padding:0}
.cp-steps li{flex:1;display:flex;align-items:center;gap:9px;padding:10px 12px;border-radius:11px;
  background:var(--bg);border:1.5px solid var(--line);font-size:.82rem;font-weight:600;color:var(--muted)}
.cp-step-n{flex:0 0 auto;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;
  background:var(--line);color:#fff;font-size:.74rem;font-weight:700}
.cp-steps li.current{border-color:var(--green);background:#fff;color:var(--green-deep)}
.cp-steps li.current .cp-step-n{background:var(--green)}
.cp-steps li.done{border-color:rgba(30,58,36,.25);color:var(--green-deep)}
.cp-steps li.done .cp-step-n{background:var(--green)}
@media(max-width:520px){
  .cp-steps{gap:6px}
  .cp-steps li{flex-direction:column;align-items:flex-start;gap:5px;padding:9px;font-size:.74rem;line-height:1.25}
}

.otp-sent{margin:0 0 16px;font-size:.88rem;color:var(--muted);text-align:center;line-height:1.5}
.otp-sent b{color:var(--green-deep);font-size:.95rem}

/* Six boxes, not one field. */
.otp-boxes{display:flex;gap:9px;justify-content:center;margin:0 0 20px}
.otp-box{width:48px;height:56px;text-align:center;font-size:1.4rem;font-weight:700;
  font-family:var(--sans);color:var(--green-deep);
  border:1.5px solid var(--line);border-radius:12px;background:var(--canvas);
  transition:border-color .12s,box-shadow .12s,background .12s}
.otp-box:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(206,157,65,.14)}
.otp-box.filled{border-color:var(--green);background:#fff}
/* Number spinners in a one-character box are noise. */
.otp-box::-webkit-outer-spin-button,.otp-box::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

.otp-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px}
.otp-link{background:none;border:0;padding:4px 2px;font-family:var(--sans);font-size:.82rem;font-weight:600;
  color:var(--green);cursor:pointer}
.otp-link:hover:not(:disabled){text-decoration:underline}
.otp-link:disabled{color:var(--muted);cursor:default}
.otp-link:focus-visible{outline:2px solid var(--gold);outline-offset:2px}

@media(max-width:420px){
  .otp-boxes{gap:6px}
  .otp-box{width:100%;max-width:48px;height:50px;font-size:1.2rem}
  .otp-channel{padding:10px;gap:8px}
  .otp-channel small{display:none}
}

.phone-row{display:flex;gap:8px}
.phone-country{flex:0 0 108px;padding:13px 10px;border:1.5px solid var(--line);border-radius:10px;background:var(--canvas);font-family:var(--sans)}
.phone-row input{flex:1;padding:13px 16px;border:1.5px solid var(--line);border-radius:10px;font-family:var(--sans);font-size:.95rem;background:var(--canvas)}
.phone-row input:focus,.phone-country:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(206,157,65,.12)}
/* No min-height: an empty reCAPTCHA slot left a 78px hole above the button,
   which is the gap that made the form look broken before it had rendered. */
.recaptcha-box:not(:empty){margin:12px 0 16px}
.otp .alert.err{white-space:pre-wrap;margin-bottom:14px}
.phone-account-select{width:100%;padding:13px 16px;border:1.5px solid var(--line);border-radius:10px;background:var(--canvas);font-family:var(--sans);font-size:.95rem}
.phone-account-select:focus{outline:none;border-color:var(--gold);background:#fff;box-shadow:0 0 0 4px rgba(206,157,65,.12)}

@media(max-width:860px){
  .auth-side{display:none}
  .auth-form-side{min-height:100vh}
}

/* ============ FOOTER ============ */
footer{background:var(--green-deep);color:#fff;padding:70px 0 26px}
.fgrid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:40px;padding-bottom:44px;border-bottom:1px solid rgba(255,255,255,.12)}
.fbrand img{height:52px;background:#fff;padding:8px;border-radius:10px;margin-bottom:18px}
.fbrand p{color:rgba(255,255,255,.7);font-size:.94rem;max-width:280px}
.fcol h4{color:var(--gold);font-size:.85rem;letter-spacing:.12em;text-transform:uppercase;margin-bottom:20px}
.fcol ul{list-style:none}
.fcol ul li{margin-bottom:12px}
.fcol ul a{color:rgba(255,255,255,.78);font-size:.94rem;transition:.2s}
.fcol ul a:hover{color:var(--gold);padding-left:5px}
.fcol .fi{display:flex;gap:10px;margin-bottom:14px;font-size:.9rem;color:rgba(255,255,255,.78)}
.fcol .fi i{color:var(--gold);margin-top:3px}
.fsoc{display:flex;gap:12px;margin-top:18px}
.fsoc a{width:40px;height:40px;border-radius:10px;background:rgba(255,255,255,.08);display:grid;place-items:center;transition:.3s}
.fsoc a:hover{background:var(--gold);color:var(--green-deep)}
.fbot{display:flex;justify-content:space-between;align-items:center;padding-top:24px;flex-wrap:wrap;gap:12px}
.fbot p{color:rgba(255,255,255,.6);font-size:.88rem}
.fbot .lk{display:flex;gap:22px}
.fbot .lk a{color:rgba(255,255,255,.6);font-size:.88rem}
.fbot .lk a:hover{color:var(--gold)}

/* Reveal animation */
.reveal{opacity:0;transform:translateY(30px);transition:.7s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ============ RESPONSIVE ============ */
@media(max-width:1320px){
  .menu a{padding:9px 10px;font-size:.86rem}
  .nav-drop-btn{padding:9px 10px;font-size:.86rem}
  .nav-phone{padding:10px 14px!important;font-size:.8rem!important}
  .nav-phone-text{display:none}
  .nav-phone i{margin:0}
}
@media(max-width:1180px){
  .nav-utility-note{display:none}
  /* backdrop-filter on <header> must go at these widths.
     It creates a containing block for position:fixed DESCENDANTS, exactly as
     transform does — so .menu below was positioning against the ~80px header
     instead of the viewport. top:128px with bottom:0 inside an 80px box
     collapses to nothing, which is why the open menu was a thin strip showing
     only the first item. The blur is decorative; the menu is not. */
  header{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}

  /* Top offset comes from the real header height (set by JS), not a hardcoded
     128px that was only ever right for one viewport. */
  .menu{
    position:fixed;top:var(--hdr-h,128px);right:0;bottom:0;left:0;
    background:#fff;flex-direction:column;padding:20px 20px 28px;gap:4px;
    box-shadow:var(--gold-glow-lg);transform:translateX(110%);transition:.35s;
    border-top:1px solid rgba(206,157,65,.16);z-index:999;
    justify-content:flex-start;align-items:stretch;
    /* Scrolls when the list is taller than the space, and min-height:0 is what
       lets it: a flex child defaults to min-height:auto and refuses to shrink
       below its content, so overflow-y would never engage. */
    min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    padding-bottom:calc(28px + env(safe-area-inset-bottom,0px))
  }
  @supports (height:100dvh){
    /* dvh so the last item is not left under the browser's address bar. */
    .menu{max-height:calc(100dvh - var(--hdr-h,128px))}
  }
  .menu.open{transform:none}
  .menu li{width:100%;padding:0;flex-shrink:0}
  .menu a{padding:14px 16px;width:100%;border-bottom:1px solid var(--line);white-space:normal}
  .menu a::after{left:16px;right:16px;bottom:10px}
  .nav-drop{width:100%}
  .nav-drop-btn{width:100%;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--line);border-radius:0}
  .nav-drop-menu{position:static;transform:none;opacity:1;visibility:visible;display:none;box-shadow:none;border:none;padding:0 0 8px;margin-top:-4px}
  .nav-drop.open .nav-drop-menu{display:block}
  .nav-drop-menu a{padding:12px 16px 12px 28px}
  .menu-cta-item{display:block;margin-top:8px}
  .menu-cta-item a{display:flex;align-items:center;gap:10px;background:rgba(206,157,65,.08);border:1px solid rgba(206,157,65,.16);box-shadow:var(--gold-glow-sm)}
  .burger{display:flex}
  .nav-phone{display:none!important}
}
@media(max-width:960px){
  .hero-grid,.split,.contact-grid{grid-template-columns:1fr;gap:40px}
  .g4,.goals,.band,.founders{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:1fr}
  .calc-card{grid-template-columns:1fr}
  .fgrid{grid-template-columns:1fr 1fr}
  .hero-visual{order:-1;padding:28px 12px 40px}
  .hero-card{min-height:380px}
}
@media(max-width:720px){
  .g4,.goals,.band,.g2,.form .fr,.fgrid,.founders{grid-template-columns:1fr}
  .hero-stats{gap:24px}
  .sec{padding:70px 0}
  .cta-strip,.band{padding:40px 24px}
  .fbot{flex-direction:column;text-align:center}
  .trust-strip{gap:10px}
  .trust-chip{font-size:.78rem;padding:10px 16px}
  .ticket-track-grid,.admin-ticket-grid{grid-template-columns:1fr}
  .admin-stat-row{grid-template-columns:repeat(2,1fr)}
}

/* ============ SUPPORT TICKETS ============ */
.ticket-wrap{max-width:980px;margin:0 auto}
.ticket-tabs{display:flex;gap:10px;justify-content:center;margin-bottom:32px;flex-wrap:wrap}
.ticket-tab{display:inline-flex;align-items:center;gap:10px;padding:12px 24px;border-radius:30px;border:1.5px solid rgba(206,157,65,.14);background:#fff;font-weight:600;color:var(--muted);transition:.25s;box-shadow:var(--gold-glow-sm)}
.ticket-tab:hover,.ticket-tab.active{background:var(--green);color:#fff;border-color:var(--green);box-shadow:var(--gold-glow-md)}
.ticket-form{max-width:100%}
.ticket-ref-card{background:linear-gradient(160deg,var(--green),var(--green-deep));color:#fff;border-radius:20px;padding:36px;text-align:center;margin-bottom:28px;box-shadow:var(--gold-glow-lg);border:1px solid rgba(206,157,65,.2)}
.ticket-ref-num{font-family:var(--serif);font-size:2.4rem;color:var(--gold);margin:10px 0 14px;letter-spacing:.04em}
.ticket-ref-card p{color:rgba(255,255,255,.8);margin-bottom:22px}
.ticket-track-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:28px;align-items:start}
.ticket-detail{background:#fff;border:1px solid rgba(206,157,65,.1);border-radius:var(--radius);padding:28px;box-shadow:var(--gold-glow-sm)}
.ticket-detail-head{margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.ticket-meta{color:var(--muted);font-size:.9rem;margin-top:8px}
.ticket-thread{display:flex;flex-direction:column;gap:14px;margin-bottom:22px;max-height:480px;overflow-y:auto}
.ticket-msg{padding:16px 18px;border-radius:12px;border:1px solid var(--line);background:var(--canvas)}
.ticket-msg.is-admin{background:var(--green-soft);border-color:#bcd6be}
.ticket-msg-head{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px;font-size:.82rem}
.ticket-msg-head b{color:var(--green-deep)}
.ticket-msg-head span{color:var(--muted)}
.ticket-msg p{color:var(--ink);font-size:.95rem;line-height:1.65}
.ticket-reply-form{padding-top:18px;border-top:1px solid var(--line)}
.ticket-closed-note{margin-top:18px;padding:14px 16px;background:var(--canvas);border-radius:10px;color:var(--muted);font-size:.92rem}
.ticket-closed-note a{color:var(--green);font-weight:600}
.ticket-badge{display:inline-flex;align-items:center;padding:5px 12px;border-radius:30px;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.ticket-badge.status-open{background:#eafbf2;color:#0d8a4e}
.ticket-badge.status-in_progress{background:#eef4ff;color:#2f5fd4}
.ticket-badge.status-resolved{background:var(--gold-soft);color:#8a6420}
.ticket-badge.status-closed{background:#f1f3f0;color:var(--muted)}
.ticket-badge.priority-low{background:#f1f3f0;color:var(--muted)}
.ticket-badge.priority-medium{background:var(--gold-soft);color:#8a6420}
.ticket-badge.priority-high{background:#fdecec;color:#b93a3a}

/* ============ ADMIN ============ */
.admin-body{background:var(--canvas);min-height:100vh}
.admin-topbar{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid rgba(206,157,65,.1);padding:16px 0;box-shadow:var(--gold-glow-sm)}
.admin-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px}
.admin-brand{display:flex;align-items:center;gap:12px;color:var(--green-deep)}
.admin-brand img{height:40px;border-radius:6px;box-shadow:var(--gold-glow-sm)}
.admin-main{padding:36px 24px 60px}
.admin-page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.admin-page-head h1{font-size:clamp(1.8rem,3vw,2.4rem);color:var(--green-deep)}
.admin-stat-row{display:flex;gap:10px;flex-wrap:wrap}
.admin-stat{display:flex;flex-direction:column;align-items:center;min-width:88px;padding:12px 16px;background:#fff;border:1px solid rgba(206,157,65,.1);border-radius:12px;text-align:center;transition:.2s;box-shadow:var(--gold-glow-sm)}
.admin-stat b{font-family:var(--serif);font-size:1.5rem;color:var(--green)}
.admin-stat span{font-size:.72rem;color:var(--muted);font-weight:600;margin-top:4px}
.admin-stat.on,.admin-stat:hover{border-color:rgba(206,157,65,.28);box-shadow:var(--gold-glow-md)}
.admin-table-wrap{background:#fff;border:1px solid rgba(206,157,65,.1);border-radius:var(--radius);overflow:auto;box-shadow:var(--gold-glow-sm)}
.admin-table{width:100%;border-collapse:collapse;min-width:900px}
.admin-table th,.admin-table td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.admin-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);background:var(--canvas)}
.admin-table td{font-size:.9rem}
.admin-mono{font-family:ui-monospace,monospace}
.admin-sub{font-size:.8rem;color:var(--muted);margin-top:3px}
.admin-empty{padding:40px;text-align:center;color:var(--muted)}
.admin-ticket-grid{display:grid;grid-template-columns:1fr 320px;gap:24px;align-items:start}
.admin-side-panel{position:sticky;top:90px}
.admin-side-meta{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);display:flex;flex-direction:column;gap:14px}
.admin-side-meta div{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.88rem}
.admin-side-meta span{color:var(--muted)}

/* ============ TOUCH & MOBILE FRIENDLY ============ */
html{-webkit-text-size-adjust:100%}
/* overflow:hidden alone. touch-action:none here blocked touch scrolling for
   every descendant too — including the open menu, which needs to scroll when
   the list is taller than the screen. Scroll chaining is prevented on .menu
   itself with overscroll-behavior instead, which does not have that effect. */
body.menu-open{overflow:hidden}
.btn-block{width:100%;justify-content:center}
.alert-break{word-break:break-word;overflow-wrap:anywhere;line-height:1.55}

/* 16px inputs prevent iOS zoom on focus */
.form input,.form select,.form textarea,.auth-form input{font-size:16px}
@media(min-width:768px){
  .form input,.form select,.form textarea,.auth-form input{font-size:.95rem}
}

/* Touch targets (44px minimum) */
@media(hover:none) and (pointer:coarse){
  .btn,.ticket-tab,.util-link,.burger,.nav-drop-btn,.menu a,.pwd-toggle{
    min-height:44px;touch-action:manipulation;-webkit-tap-highlight-color:rgba(206,157,65,.15)
  }
  .menu a{display:flex;align-items:center}
  .burger{min-width:44px;justify-content:center}
  .form select,.form input,.form textarea{min-height:48px}
  .btn:hover,.ticket-tab:hover,.card:hover,.goal:hover{transform:none}
}

/* Ticket page — mobile */
@media(max-width:768px){
  .ticket-page .sec{padding:48px 0 64px}
  .ticket-page-hero{padding:150px 0 40px}
  .ticket-wrap{padding:0}
  .ticket-tabs{gap:8px;margin-bottom:22px}
  .ticket-tab{flex:1;justify-content:center;padding:14px 12px;font-size:.88rem;min-width:0}
  .ticket-form{padding:22px 18px}
  .ticket-form h2{font-size:1.35rem}
  .ticket-form .fr{grid-template-columns:1fr!important;gap:0}
  .ticket-ref-card{padding:28px 20px;border-radius:16px}
  .ticket-ref-num{font-size:1.75rem;word-break:break-all}
  .ticket-track-grid{grid-template-columns:1fr;gap:20px}
  .ticket-detail{padding:18px 16px;border-radius:12px}
  .ticket-detail-head h2{font-size:1.25rem;line-height:1.3}
  .ticket-meta{font-size:.82rem;line-height:1.6}
  .ticket-detail-head .ticket-badge{margin-bottom:6px;margin-right:4px}
  .ticket-thread{max-height:min(55vh,420px);-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding-right:4px}
  .ticket-msg{padding:14px 14px}
  .ticket-msg-head{flex-direction:column;align-items:flex-start;gap:4px}
  .ticket-msg p{font-size:.92rem}
  .ticket-reply-form textarea{min-height:120px}
  .ticket-reply-form .btn-block{margin-top:4px}
}

@media(max-width:480px){
  .wrap{padding:0 14px}
  .nav-utility-inner{min-height:auto;padding:8px 0;flex-wrap:wrap;justify-content:center}
  .nav-utility-links{width:100%;justify-content:center;gap:8px}
  .util-link{flex:1;justify-content:center;padding:10px 12px;font-size:.8rem;max-width:48%}
  .brand .bt span{display:none}
  .brand img{height:42px}
  .nav{min-height:72px;padding:8px 0}
  .phero{padding:140px 0 48px}
  .phero h1{font-size:1.85rem}
  .ticket-tab{font-size:.82rem;padding:12px 8px}
  .ticket-tab i{display:none}
  .form{padding:22px 16px}
  .alert{padding:12px 14px;font-size:.88rem}
}

/* Admin mobile */
@media(max-width:768px){
  .admin-main{padding:20px 14px 48px}
  .admin-page-head{flex-direction:column;gap:16px}
  .admin-stat-row{width:100%;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
  .admin-stat{min-width:0;padding:10px 8px}
  .admin-stat b{font-size:1.2rem}
  .admin-table{min-width:680px;font-size:.85rem}
  .admin-ticket-grid{grid-template-columns:1fr}
  .admin-side-panel{position:static}
  .admin-brand b{font-size:.95rem}
  .admin-topbar-actions .btn span{display:none}
}

/* Auth mobile */
@media(max-width:480px){
  .auth-card{padding:28px 20px;border-radius:16px}
  .auth-h1{font-size:1.45rem}
}

/* ============ PANEL LAYOUT (admin + client) ============ */
.panel-body{background:var(--canvas);min-height:100vh;margin:0}
.panel-app{display:flex;min-height:100vh}
.panel-side{
  width:260px;flex-shrink:0;background:#fff;border-right:1px solid rgba(206,157,65,.12);
  display:flex;flex-direction:column;position:fixed;top:0;left:0;bottom:0;z-index:200;
  box-shadow:var(--gold-glow-sm);transition:transform .28s ease;
  /* The drawer must never grow past the viewport — its children scroll instead. */
  max-height:100vh;overflow:hidden
}
@supports (height:100dvh){
  /* dvh excludes the mobile browser's collapsing address bar. With vh alone the
     drawer is laid out taller than the visible area and the last item sits
     under the chrome. */
  .panel-side{max-height:100dvh}
}
.panel-side-head{
  display:flex;align-items:center;justify-content:space-between;padding:18px 16px;
  border-bottom:1px solid var(--line);flex-shrink:0
}
.panel-brand{display:flex;align-items:center;gap:10px;color:var(--green-deep)}
.panel-brand img{height:36px;border-radius:6px}
.panel-brand b{display:block;font-size:.95rem}
.panel-brand small{display:block;font-size:.72rem;color:var(--muted);font-weight:600}
.panel-close{display:none;background:none;border:none;font-size:1.2rem;color:var(--muted);padding:8px;cursor:pointer}
.panel-nav{
  flex:1;padding:14px 10px;display:flex;flex-direction:column;gap:4px;overflow-y:auto;
  /* min-height:0 is what makes the scroll work at all.
     A flex child defaults to min-height:auto, which refuses to shrink below its
     own content — so with twenty-odd nav items the list grew taller than the
     drawer, overflow-y:auto never engaged, and everything past the fold
     (including Logout) was simply unreachable on a short screen. */
  min-height:0;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior:contain
}
.panel-link{
  display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;
  color:var(--muted);font-weight:600;font-size:.9rem;transition:.2s
}
.panel-link i{width:20px;text-align:center;color:var(--green)}
.panel-link:hover,.panel-link.active{background:var(--green-soft);color:var(--green-deep)}
.panel-link.active{border:1px solid rgba(206,157,65,.2);box-shadow:var(--gold-glow-sm)}
.panel-side-foot{
  padding:12px 10px 18px;border-top:1px solid var(--line);flex-shrink:0;
  /* Clear of the home indicator on a notched phone. */
  padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))
}
.panel-logout{color:#b93a3a}
.panel-logout i{color:#b93a3a}
.panel-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:150;opacity:0;transition:opacity .25s}
.panel-overlay.open{display:block;opacity:1}
.panel-main{flex:1;margin-left:260px;display:flex;flex-direction:column;min-width:0}
.panel-topbar{
  position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid rgba(206,157,65,.1);
  padding:16px 24px;display:flex;align-items:center;gap:16px;box-shadow:var(--gold-glow-sm)
}
.panel-toggle{display:none;background:none;border:1px solid var(--line);border-radius:8px;padding:10px 12px;cursor:pointer;color:var(--green-deep)}
.panel-topbar-titles{flex:1;min-width:0}
.panel-topbar-titles h1{font-size:1.35rem;color:var(--green-deep);margin:0;line-height:1.2}
.panel-topbar-titles p{margin:4px 0 0;font-size:.85rem;color:var(--muted)}
.panel-top-cta{padding:8px 16px;font-size:.82rem}
.panel-content{padding:24px;flex:1}
.impersonate-banner{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#fff6e0;border:1px solid #e8cc8f;color:#7a5b12;border-radius:10px;padding:10px 16px;margin-bottom:18px;font-size:.85rem}
.impersonate-banner b{font-family:ui-monospace,monospace}
.impersonate-exit{margin-left:auto;font-weight:700;color:#7a5b12;text-decoration:underline}
.impersonate-banner .impersonate-exit + .impersonate-exit{margin-left:14px}
.impersonate-note{opacity:.8;font-size:.78rem}

/* UCC registration form — section headings and per-field validation. */
.ucc-h{margin:22px 0 10px;padding-bottom:6px;border-bottom:1px solid var(--line);
  font-size:.78rem;letter-spacing:.6px;text-transform:uppercase;color:var(--green-deep);font-weight:700}
.ucc-h span{font-weight:400;text-transform:none;letter-spacing:0;color:var(--muted);font-size:.75rem}
.f.has-err input,.f.has-err select{border-color:#C0392B;background:#fff7f6}
.f-err{display:block;margin-top:4px;color:#C0392B;font-size:.74rem;line-height:1.4}
.f-hint{display:block;margin-top:4px;color:var(--muted);font-size:.73rem;line-height:1.4}

/* Order entry — the review step is deliberately loud: it is the last stop
   before a live order against a client's money. */
.ord-review{border:2px solid var(--gold);background:#fffdf7;margin-bottom:20px}
.ord-review-table{margin-top:12px;font-size:.82rem}
.ord-review-table td{padding:6px 10px;border-bottom:1px solid #f0f3f1}
.ord-review-table td:first-child{color:var(--muted);width:40%}
.ord-confirm{display:flex;gap:10px;justify-content:flex-end;margin-top:16px}
.ord-status{display:inline-block;padding:2px 9px;border-radius:20px;font-size:.72rem;font-weight:700;text-transform:capitalize}
.ord-success{background:#e6f5ec;color:#166b41}
.ord-failed,.ord-error{background:#fdecea;color:#a02c22}
.ord-pending{background:#fff4e0;color:#8a5b12}
.ord-unknown{background:#eceff1;color:#455a64}



/* ── Admin client directory ─────────────────────────────────────────── */
.cl-topbar{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.cl-toggle{display:inline-flex;border:1px solid var(--line,#dfe5e0);border-radius:22px;overflow:hidden}
.cl-toggle-opt{padding:7px 16px;font-size:.8rem;font-weight:600;color:var(--muted,#6b7a70);text-decoration:none;white-space:nowrap}
.cl-toggle-opt:hover{background:rgba(27,64,32,.06)}
.cl-toggle-opt.is-on{background:#1B4020;color:#fff}
.cl-search{position:relative;display:flex;align-items:center;gap:8px;flex:1 1 320px;min-width:260px}
.cl-search > i{position:absolute;left:12px;color:var(--muted,#6b7a70);font-size:.8rem;pointer-events:none}
.cl-search input{flex:1;padding:9px 12px 9px 32px;border:1px solid var(--line,#dfe5e0);border-radius:22px;font-size:.85rem}
.cl-search input:focus{outline:none;border-color:#1B4020;box-shadow:0 0 0 3px rgba(27,64,32,.1)}
/* Name suggestions under the client search box. Fed from the same response
   that refreshes the table, so typing costs one request, not two. */
.cl-suggest{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:40;background:#fff;
  border:1px solid var(--line,#dfe5e0);border-radius:12px;box-shadow:0 12px 32px rgba(15,23,42,.13);
  max-height:340px;overflow-y:auto;padding:4px}
.cl-suggest-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:8px;cursor:pointer}
.cl-suggest-item:hover,.cl-suggest-item.is-active{background:rgba(27,64,32,.07)}
.cl-suggest-name{font-weight:600;font-size:.85rem;color:var(--ink,#0f172a);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl-suggest-meta{margin-left:auto;font-size:.72rem;color:var(--muted,#6b7a70);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;white-space:nowrap}
.cl-suggest-more{padding:8px 11px;font-size:.72rem;color:var(--muted,#6b7a70);border-top:1px solid var(--line,#dfe5e0);margin-top:4px}
.cl-suggest mark{background:rgba(201,168,76,.32);color:inherit;border-radius:2px;padding:0 1px}
.cl-topbar-actions{display:flex;gap:8px;margin-left:auto}

.cl-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:.8rem;color:var(--muted,#6b7a70);margin-bottom:10px}
.cl-meta-sep{opacity:.5}
.cl-meta-hint{margin-left:auto;color:#1B4020;font-weight:600}
/* --- Legal page editor --- */
.lg-intro{margin-bottom:20px;font-size:.9rem;color:var(--muted,#6b7a70)}
.lg-intro p{margin:0 0 6px}
.lg-hint code{background:#f2f5f2;border-radius:4px;padding:1px 5px;font-size:.82em}
.lg-card{background:#fff;border:1px solid var(--line,#d8e0d8);border-radius:12px;
  padding:20px 22px;margin-bottom:22px}
.lg-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin-bottom:16px}
.lg-head h2{margin:4px 0 0;font-size:1.15rem}
.lg-state{font-size:.75rem;font-weight:600;display:inline-flex;align-items:center;gap:6px;
  padding:4px 10px;border-radius:20px;white-space:nowrap}
.lg-state.is-default{background:#f2f5f2;color:#6b7a70}
.lg-state.is-custom{background:#eaf3ec;color:#1B4020}
.lg-label{display:block;font-size:.76rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted,#6b7a70);margin:12px 0 5px}
.lg-input,.lg-text{width:100%;box-sizing:border-box;border:1px solid var(--line,#d8e0d8);
  border-radius:8px;padding:10px 12px;font:inherit;font-size:.92rem;background:#fdfdfd}
.lg-text{line-height:1.65;resize:vertical;min-height:190px;font-family:inherit}
.lg-input:focus,.lg-text:focus{outline:none;border-color:#1B4020;background:#fff}
.lg-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px}
.lg-dirty{font-size:.76rem;font-weight:600;color:#a05a00}
.lg-preview{margin-top:18px;border-top:1px dashed var(--line,#d8e0d8);padding-top:16px}
.lg-preview-head{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted,#6b7a70);margin-bottom:10px}
.lg-preview-body .lead{font-size:1rem}

.cl-reindex-form{display:none}
.cl-idx{display:inline-flex;align-items:center;gap:5px;color:#1B4020;font-weight:600}
.cl-idx i{font-size:.7rem}
.cl-idx.is-off{color:#a05a00}
.cl-idx-btn{border:1px solid var(--line,#d8e0d8);background:#fff;color:var(--muted,#6b7a70);
  border-radius:6px;padding:1px 8px;font:inherit;font-size:.72rem;cursor:pointer}
.cl-idx-btn:hover{border-color:#1B4020;color:#1B4020}

.cl-tablewrap{overflow:auto;border:1px solid var(--line,#dfe5e0);border-radius:12px;background:#fff}
.cl-table{width:100%;border-collapse:collapse;font-size:.82rem;white-space:nowrap}
.cl-table thead th{position:sticky;top:0;z-index:2;background:#f4f7f5;border-bottom:1px solid var(--line,#dfe5e0);
  padding:10px 12px;text-align:left;font-weight:700;color:#0F2419}
.cl-table th.r,.cl-table td.r{text-align:right}
.cl-table th.c,.cl-table td.c{text-align:center}
.cl-table tbody td{padding:9px 12px;border-bottom:1px solid #f0f3f1;vertical-align:middle}
.cl-table tbody tr:nth-child(even){background:#fbfcfb}
.cl-table tbody tr:hover{background:#f2f8f3}
.cl-table td.mono,.cl-table .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem}
.cl-sort{color:#0F2419;text-decoration:none;display:inline-flex;align-items:center;gap:5px}
.cl-sort i{opacity:.35;font-size:.7rem}
.cl-sort.is-on i,.cl-sort:hover i{opacity:1}
.cl-filterrow td{background:#fff;border-bottom:1px solid var(--line,#dfe5e0);padding:6px 8px}
.cl-colsearch{width:100%;min-width:90px;padding:5px 8px;border:1px solid var(--line,#dfe5e0);border-radius:6px;font-size:.75rem}
.cl-colsearch:focus{outline:none;border-color:#1B4020}
.cl-name a{color:#1B4020;font-weight:700;text-decoration:none}
.cl-name a:hover{text-decoration:underline}
.cl-noname{color:var(--muted,#6b7a70);font-weight:400;font-style:italic}
.cl-badge{margin-left:6px;color:#C9A44C;font-size:.72rem}
.cl-muted{color:var(--muted,#6b7a70)}
.cl-invite{color:#b0791b;font-size:.75rem}
.cl-aum-wait{color:#c3cdc6}
/* A quiet placeholder the width of a number, instead of a progress bar or a
   blinking ellipsis — the row is readable while the total catches up. */
.cl-aum-skel{display:inline-block;width:82px;height:11px;border-radius:6px;vertical-align:middle;
  background:linear-gradient(90deg,#eef1ee 25%,#e2e7e3 37%,#eef1ee 63%);
  background-size:400% 100%;animation:cl-shimmer 1.4s ease infinite}
@keyframes cl-shimmer{0%{background-position:100% 50%}100%{background-position:0 50%}}
@media (prefers-reduced-motion:reduce){.cl-aum-skel{animation:none}}
/* A value that's being refreshed in the background stays readable. */
.cl-aum-stale{opacity:.55}
.cl-actions{white-space:nowrap}
.cl-act{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin:0 1px;
  border:none;background:transparent;color:var(--muted,#6b7a70);border-radius:6px;cursor:pointer;font-size:.78rem;text-decoration:none}
.cl-act:hover{background:#e8f0ea;color:#1B4020}
.cl-empty{text-align:center;padding:34px 12px;color:var(--muted,#6b7a70)}
.cl-pager{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:14px;font-size:.82rem}
.cl-pager .is-off{opacity:.4;pointer-events:none}

.panel-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px}
.panel-card{
  display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:20px;
  background:#fff;border:1px solid rgba(206,157,65,.12);border-radius:var(--radius);
  box-shadow:var(--gold-glow-sm);transition:.2s;color:inherit
}
.panel-card:hover{box-shadow:var(--gold-glow-md);border-color:rgba(206,157,65,.25);transform:translateY(-2px)}
.panel-card i{font-size:1.4rem;color:var(--gold)}
.panel-card b{font-family:var(--serif);font-size:1.5rem;color:var(--green-deep)}
.panel-card span{font-size:.78rem;color:var(--muted);font-weight:600}
.panel-split{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
/* ── NSE order result ─────────────────────────────────────────────────────
   Placing an order is the one action on this panel that moves a client's
   money, and it used to end in raw JSON. The verdict and the order number get
   the weight here; everything else is confirmation. */
.nov-card{border:1px solid var(--line);border-radius:12px;padding:16px 18px;margin-bottom:12px;background:#fff}
.nov-card.nov-ok{border-left:3px solid var(--green)}
.nov-card.nov-bad{border-left:3px solid #b93a3a}
.nov-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}
.nov-icon{flex:0 0 auto;width:30px;height:30px;border-radius:50%;display:flex;
  align-items:center;justify-content:center;font-size:.95rem;font-weight:800;color:#fff}
.nov-ok .nov-icon{background:var(--green)}
.nov-bad .nov-icon{background:#b93a3a}
.nov-head-t b{display:block;font-size:1rem;font-weight:800}
.nov-ok .nov-head-t b{color:var(--green-deep)}
.nov-bad .nov-head-t b{color:#8f2b2b}
.nov-head-t span{display:block;font-size:.76rem;color:var(--muted);margin-top:2px}

/* The number somebody comes back to this screen looking for. */
.nov-order{display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  background:var(--canvas);border:1px solid var(--line);border-radius:10px;
  padding:11px 14px;margin-bottom:14px}
.nov-order span{font-size:.68rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.07em;color:var(--muted)}
.nov-order b{font-family:ui-monospace,Menlo,monospace;font-size:1.05rem;
  letter-spacing:.02em;color:var(--ink)}
.nov-copy{font:inherit;font-size:.72rem;font-weight:700;padding:4px 11px;border-radius:7px;
  border:1px solid var(--line);background:#fff;color:var(--green-deep);cursor:pointer;margin-left:auto}
.nov-copy:hover{border-color:var(--gold)}

.nov-remark{background:#fdeeee;border:1px solid rgba(185,58,58,.25);border-radius:8px;
  padding:9px 12px;margin-bottom:14px;font-size:.8rem;line-height:1.6;color:#8f2b2b}

.nov-group{margin-bottom:13px}
.nov-group:last-child{margin-bottom:0}
.nov-group-t{font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;
  color:var(--gold);margin-bottom:6px}
.nov-grid{display:grid;grid-template-columns:minmax(120px,auto) 1fr;gap:5px 16px;margin:0}
.nov-grid dt{font-size:.78rem;color:var(--muted)}
.nov-grid dd{font-size:.82rem;color:var(--ink);margin:0;font-weight:600;overflow-wrap:anywhere}
.nov-grid dt.mono{font-family:ui-monospace,Menlo,monospace;font-size:.72rem}

/* A batch can be part-accepted, and "some worked" must never read as "it worked". */
.nov-batch{font-size:.84rem;font-weight:700;padding:10px 14px;border-radius:10px;margin-bottom:12px}
.nov-batch.nov-ok{background:var(--green-soft);color:var(--green-deep)}
.nov-batch.nov-part{background:#fdf7e8;color:#8a6215;border:1px solid rgba(206,157,65,.35)}
.nov-batch.nov-bad{background:#fdeeee;color:#8f2b2b}

@media(max-width:560px){
  .nov-grid{grid-template-columns:1fr;gap:2px}
  .nov-grid dd{margin-bottom:6px}
  .nov-copy{margin-left:0}
}

.panel-json-out{position:sticky;top:90px}
.json-pre{
  background:var(--canvas);border:1px solid var(--line);border-radius:10px;padding:16px;
  font-size:.78rem;line-height:1.5;overflow:auto;max-height:min(70vh,560px);white-space:pre-wrap;word-break:break-word
}
.hide-mobile{display:inline}
@media(max-width:900px){
  .panel-side{transform:translateX(-100%)}
  .panel-side.open{transform:translateX(0)}
  .panel-close{display:block}
  .panel-main{margin-left:0}
  .panel-toggle{display:inline-flex;align-items:center}
  .panel-content{padding:18px 14px}
  .panel-split{grid-template-columns:1fr}
  .panel-json-out{position:static}
  .hide-mobile{display:none}
  /* Lock the page, not the drawer. Without position:fixed here iOS Safari
     still scrolls the body behind the overlay, and closing the menu returns
     you somewhere other than where you were. */
  body.panel-open{overflow:hidden;position:fixed;width:100%}
}

/* ── Small phones ──────────────────────────────────────────────────────────
   260px leaves "Data Import & Sync" and "Duplicate Holdings" wrapping onto two
   lines on a 360px screen, which is what made the menu look truncated. Give
   the drawer most of the width it has, but never more than it needs, and keep
   a strip of the page visible so it still reads as a drawer over content. */
@media(max-width:600px){
  .panel-side{width:min(84vw,300px)}
  .panel-link{padding:13px 14px;font-size:.92rem}
  .panel-nav{padding:10px 8px;gap:2px}
  .panel-side-head{padding:14px 14px}
  .panel-brand img{height:32px}
  .panel-topbar{padding:12px 14px;gap:10px}
  .panel-topbar-titles h1{font-size:1.05rem}
  .panel-topbar-titles p{font-size:.76rem}
  /* Tap targets: 44px is the smallest reliably hittable control. */
  .panel-toggle{padding:11px 13px;min-width:44px;min-height:44px;justify-content:center}
  .panel-close{padding:10px;min-width:44px;min-height:44px}
}

/* Short screens — a landscape phone is ~375px tall, so the nav gets almost no
   room. Tighten the rows so more of them fit before scrolling starts. */
@media(max-height:560px) and (max-width:900px){
  .panel-link{padding:9px 14px;font-size:.86rem}
  .panel-nav{gap:1px}
  .panel-side-head{padding:10px 14px}
  .panel-brand img{height:28px}
  .panel-brand small{display:none}
  .panel-side-foot{padding:8px 8px 12px}
}

.is-hidden{display:none!important}
.nse-env-switch{display:flex;align-items:center;gap:6px;background:var(--canvas);border:1px solid var(--line);border-radius:999px;padding:4px}
.nse-env-label{font-size:.72rem;font-weight:700;color:var(--muted);padding:0 6px}
.nse-env-btn{
  display:inline-flex;align-items:center;justify-content:center;min-width:52px;padding:8px 12px;
  border-radius:999px;font-size:.78rem;font-weight:700;color:var(--muted);transition:.2s
}
.nse-env-btn:hover{color:var(--green-deep)}
.nse-env-btn.active{background:var(--green);color:#fff;box-shadow:var(--gold-glow-sm)}
.nse-env-btn.active:last-child{background:#b93a3a}
.json-textarea{min-height:320px}
.panel-tabs{display:flex;gap:10px;flex-wrap:wrap}

.nse-hide-empty{display:flex;align-items:center;gap:6px;font-size:.78rem;color:var(--muted);margin-bottom:12px;cursor:pointer}
.nse-records{display:flex;flex-direction:column;gap:14px}
.nse-card{border:1px solid var(--line);border-radius:10px;padding:14px 16px;background:var(--canvas)}
.nse-card h4{font-family:var(--serif);color:var(--green-deep);font-size:1.05rem;margin-bottom:10px}
.nse-section{margin-bottom:10px}
.nse-section:last-child{margin-bottom:0}
.nse-section h5{font-size:.7rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
.nse-field{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border-bottom:1px dashed rgba(0,0,0,.06);font-size:.82rem}
.nse-field:last-child{border-bottom:none}
.nse-field-k{color:var(--muted);font-weight:600}
.nse-field-v{text-align:right;word-break:break-word}
.nse-field.is-empty .nse-field-v{color:var(--muted)}
.nse-field.is-hidden{display:none}

.scheme-list{display:flex;flex-direction:column;gap:10px}
.scheme-row{border:1px solid var(--line);border-radius:12px;overflow:hidden;transition:.2s}
.scheme-row:hover{border-color:rgba(206,157,65,.35)}
.scheme-row-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;cursor:pointer;flex-wrap:wrap}
.scheme-row-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.scheme-row-main b{color:var(--green-deep);font-size:.92rem}
.scheme-row-meta{display:flex;align-items:center;gap:14px;font-size:.8rem;color:var(--muted);flex-wrap:wrap}
.scheme-row-caret{transition:transform .2s;color:var(--gold)}
.scheme-row-caret-open{transform:rotate(180deg)}
.scheme-row-detail{border-top:1px solid var(--line);border-radius:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;padding:16px}
.scheme-row-detail.is-hidden{display:none}

/* Ticket filters */
.ticket-filter-bar{margin-bottom:18px;padding:18px 20px}
.ticket-filter-grid{display:grid;grid-template-columns:2fr repeat(4,minmax(120px,1fr)) auto;gap:12px;align-items:end}
.ticket-filter-actions{display:flex;gap:8px;flex-wrap:wrap;padding-bottom:2px}
@media(max-width:1100px){.ticket-filter-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.ticket-filter-grid{grid-template-columns:1fr}.ticket-filter-actions{width:100%}.ticket-filter-actions .btn{flex:1}}

/* Admin portfolio */
.portfolio-search-wrap{position:relative;margin-bottom:18px}
.portfolio-search-form .portfolio-search-inner{display:flex;gap:0;background:#fff;border:2px solid rgba(206,157,65,.18);border-radius:12px;overflow:hidden;box-shadow:var(--gold-glow-sm)}
.portfolio-search-form .portfolio-search-inner:focus-within{border-color:var(--gold)}
.portfolio-search-input{flex:1;border:none;padding:12px 16px;font-size:15px;outline:none;background:transparent}
.portfolio-search-btn{border-radius:0;padding:12px 20px}
.portfolio-suggest{position:absolute;top:100%;left:0;right:0;background:#fff;border:1.5px solid var(--line);border-top:none;border-radius:0 0 12px 12px;box-shadow:var(--gold-glow-md);z-index:50;display:none;overflow:hidden}
.portfolio-sug-item{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;border:none;border-bottom:1px solid var(--line);background:#fff;cursor:pointer;text-align:left;font-family:inherit}
.portfolio-sug-item:last-child{border-bottom:none}
.portfolio-sug-item:hover{background:var(--green-soft)}
.portfolio-sug-item b{display:block;font-size:.9rem;color:var(--green-deep)}
.portfolio-sug-item small{display:block;font-size:.78rem;color:var(--muted);font-family:ui-monospace,monospace;margin-top:2px}
.portfolio-sug-src{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:4px;background:var(--gold-soft);color:#8a6420}
.portfolio-options{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;align-items:flex-end}
.portfolio-actions{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.portfolio-pan-badge{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;background:var(--green-soft);border-radius:8px;font-weight:700;color:var(--green-deep);font-family:ui-monospace,monospace}
.portfolio-frame-wrap{background:#fff;border:1px solid rgba(206,157,65,.12);border-radius:var(--radius);overflow:hidden;box-shadow:var(--gold-glow-sm);min-height:70vh}
.portfolio-frame{width:100%;height:min(85vh,1200px);border:none;display:block;background:#f8fafc}
.portfolio-empty{text-align:center;padding:48px 24px}

/* ── NAV import ─────────────────────────────────────────────────────────── */
.nv-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-bottom:18px}
.nv-tile{background:#fff;border:1px solid var(--line,#d8e0d8);border-radius:10px;padding:12px 14px}
.nv-tile-bad{border-color:#e0b4b4;background:#fffafa}
.nv-k{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted,#6b7a70);font-weight:700}
.nv-v{font-size:1.15rem;font-weight:800;margin:3px 0 1px}
.nv-s{font-size:.74rem;color:var(--muted,#6b7a70)}
.nv-panel{margin-bottom:18px}
.nv-h{display:flex;align-items:center;gap:9px;font-size:1rem;margin:0 0 8px}
.nv-pill{font-size:.68rem;font-weight:700;background:#eaf3ec;color:#1B4020;border-radius:20px;padding:2px 9px}
.nv-note{font-size:.84rem;color:var(--muted,#6b7a70);line-height:1.6;margin:0 0 8px}
.nv-note code{background:#f2f5f2;border-radius:4px;padding:1px 5px;font-size:.9em}
.nv-note-bad{color:#a02020}
.nv-note-key{background:#fbf7ec;border-left:3px solid #C9A44C;padding:9px 12px;border-radius:0 6px 6px 0}
.nv-drop{border:2px dashed var(--line,#d8e0d8);border-radius:11px;padding:22px;text-align:center;
  cursor:pointer;transition:.15s;margin:12px 0}
.nv-drop:hover,.nv-drop.is-over{border-color:#1B4020;background:#f6faf7}
.nv-drop-i{font-size:1.5rem;color:#1B4020;margin-bottom:5px}
.nv-drop-t{font-weight:600;font-size:.9rem}
.nv-drop-s{font-size:.75rem;color:var(--muted,#6b7a70);margin-top:2px}
.nv-drop-f{margin-top:9px;font-size:.8rem;font-weight:700;color:#1B4020}
.nv-label{display:block;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted,#6b7a70);margin:10px 0 5px}
.nv-text{width:100%;box-sizing:border-box;border:1px solid var(--line,#d8e0d8);border-radius:8px;
  padding:10px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.78rem;
  line-height:1.55;background:#fdfdfd;resize:vertical}
.nv-text:focus{outline:none;border-color:#1B4020;background:#fff}
.nv-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px}
.nv-hint{font-size:.78rem;color:var(--muted,#6b7a70)}
.nv-out{margin-top:12px}
.nv-msg{font-size:.85rem;padding:9px 12px;border-radius:8px;background:#f2f5f2;margin-bottom:8px}
.nv-msg-ok{background:#eaf3ec;color:#1B4020}
.nv-msg-bad{background:#fdeaea;color:#a02020}
.nv-msg-warn{background:#fbf3e2;color:#8a6100}
.nv-stats{display:flex;gap:16px;flex-wrap:wrap;font-size:.82rem;color:var(--muted,#6b7a70);
  padding:8px 2px;margin-bottom:6px}
.nv-stats b{color:var(--ink,#0f2419);font-size:.95rem}
.nv-sub{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted,#6b7a70);margin:12px 0 6px}
.nv-table{width:100%;border-collapse:collapse;font-size:.8rem}
.nv-table th{text-align:left;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted,#6b7a70);padding:5px 8px 5px 0;border-bottom:1px solid var(--line,#d8e0d8)}
.nv-table td{padding:5px 8px 5px 0;border-bottom:1px solid #f1f4f1}
.nv-table .mono{font-family:ui-monospace,monospace;font-size:.92em}
.nv-log{background:#0f2419;color:#dfe7e0;padding:12px 14px;border-radius:8px;font-size:.74rem;
  line-height:1.5;overflow:auto;max-height:320px;white-space:pre-wrap;word-break:break-word}

/* Category totals — Overview */
.ct-table tfoot .ct-total td{background:#f2f5f2;border-top:2px solid var(--line,#d8e0d8);font-weight:700}
.ct-table td.pos{color:#0a7a3d}
.ct-table td.neg{color:#c0392b}

/* Category grouping inside holdings tables */
.cp-table .cp-cat-row td{background:#eef3ef;font-weight:700;font-size:.78rem;
  text-transform:uppercase;letter-spacing:.04em;color:#1B4020;padding-top:9px;padding-bottom:7px}
.cp-table .cp-cat-n{float:right;font-weight:600;text-transform:none;letter-spacing:0;
  color:var(--muted,#6b7a70);font-size:.75rem}
.cp-table .cp-subtotal-row td{background:#f7faf8;font-weight:700;
  border-top:1px solid var(--line,#d8e0d8);border-bottom:1px solid var(--line,#d8e0d8)}
.cp-table .cp-total-row td{background:#e8efe9;font-weight:800;border-top:2px solid #1B4020}

/* ── UCC check / registration view ──────────────────────────────────────── */
.ucc-card{background:#fff;border:1px solid var(--line,#d8e0d8);border-radius:12px;
  padding:18px 20px;margin-bottom:16px}
.ucc-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  flex-wrap:wrap;padding-bottom:12px;border-bottom:1px solid var(--line,#d8e0d8)}
.ucc-title{font-size:1.05rem;font-weight:800}
.ucc-sub{font-size:.8rem;color:var(--muted,#6b7a70);margin-top:3px}
.ucc-head-s{display:flex;gap:6px;flex-wrap:wrap}
.ucc-chip{display:inline-block;border-radius:20px;padding:3px 10px;font-size:.72rem;font-weight:700;
  white-space:nowrap}
.ucc-ok{background:#eaf3ec;color:#0a7a3d}
.ucc-warn{background:#fbf3e2;color:#8a6100}
.ucc-bad{background:#fdeaea;color:#b3261e}
.ucc-idle{background:#f2f5f2;color:#6b7a70}
.ucc-remediation{display:flex;gap:9px;align-items:flex-start;background:#fbf7ec;
  border-left:3px solid #C9A44C;padding:10px 13px;border-radius:0 7px 7px 0;margin:12px 0;
  font-size:.85rem;line-height:1.55}
.ucc-issues{margin:12px 0}
.ucc-issues h5{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted,#6b7a70);margin:0 0 7px}
.ucc-issue{border-left:3px solid;padding:8px 12px;border-radius:0 7px 7px 0;margin-bottom:6px;
  background:#fafbfa}
.ucc-issue.ucc-bad{border-color:#b3261e;background:#fdf6f6}
.ucc-issue.ucc-warn{border-color:#C9A44C;background:#fdfaf3}
.ucc-issue-t{font-weight:700;font-size:.85rem}
.ucc-issue-d{font-size:.8rem;color:var(--muted,#6b7a70);margin-top:2px;line-height:1.5}
.ucc-clear{display:flex;gap:9px;align-items:center;background:#eaf3ec;color:#0a7a3d;
  padding:10px 13px;border-radius:8px;margin:12px 0;font-size:.85rem;font-weight:600}
.ucc-h5{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted,#6b7a70);margin:18px 0 8px;display:flex;gap:9px;align-items:baseline}
.ucc-h5-note{text-transform:none;letter-spacing:0;font-weight:500}
.ucc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;
  background:var(--line,#e6ebe6);border:1px solid var(--line,#e6ebe6);border-radius:8px;overflow:hidden}
.ucc-cell{background:#fff;padding:7px 11px;display:flex;flex-direction:column;gap:1px}
.ucc-k{font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted,#6b7a70);font-weight:700}
.ucc-v{font-size:.86rem;word-break:break-word}
.ucc-holder{border:1px solid var(--line,#e6ebe6);border-radius:9px;padding:12px 14px;margin-bottom:10px}
.ucc-holder-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:9px;font-size:.9rem}
.ucc-holder-s{margin-left:auto}
.ucc-tablewrap{overflow-x:auto;border:1px solid var(--line,#e6ebe6);border-radius:8px;margin-top:8px}
.ucc-table{width:100%;border-collapse:collapse;font-size:.82rem}
.ucc-table th{background:#f6f8f6;text-align:left;font-size:.68rem;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted,#6b7a70);padding:7px 10px;white-space:nowrap}
.ucc-table td{padding:7px 10px;border-top:1px solid var(--line,#eef2ee);vertical-align:top}
.ucc-table td.r,.ucc-table th.r{text-align:right}
.ucc-table tfoot td{background:#f6f8f6;font-weight:700}
.ucc-cellnote{font-size:.72rem;color:var(--muted,#6b7a70);margin-top:3px}
.ucc-dim{color:#a9b5ab}
.ucc-yes{color:#0a7a3d;font-weight:700}
.ucc-no{color:#b3261e;font-weight:700}
.ucc-none{font-size:.84rem;color:var(--muted,#6b7a70);padding:9px 2px}

/* ── Business analytics dashboard ───────────────────────────────────────── */
.ba-wrap{margin-bottom:22px}
.ba-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  margin-bottom:12px;font-size:.8rem;color:var(--muted,#6b7a70)}
.ba-toggle{display:inline-flex;align-items:center;gap:7px;cursor:pointer;font-weight:600}
.ba-updated b{color:var(--ink,#0f2419)}
.ba-refresh{margin-left:10px;font-weight:700;color:#1B4020;text-decoration:none}
.ba-refresh:hover{text-decoration:underline}
.ba-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:16px}
.ba-metric{background:#fff;border:1px solid var(--line,#d8e0d8);border-radius:11px;padding:13px 15px}
.ba-metric.is-lead{background:linear-gradient(135deg,#0f2419,#1B4020);border-color:#0f2419}
.ba-metric.is-lead .ba-m-k{color:rgba(255,255,255,.65)}
.ba-metric.is-lead .ba-m-v{color:#fff}
.ba-m-k{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700;
  color:var(--muted,#6b7a70)}
.ba-m-v{font-size:1.3rem;font-weight:800;margin-top:4px;letter-spacing:-.01em}
.ba-m-n{font-size:.68rem;color:#a05a00;margin-top:2px;cursor:help}
.ba-cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px}
@media (max-width:1100px){.ba-cols{grid-template-columns:1fr 1fr}.ba-card-wide{grid-column:1/-1}}
@media (max-width:700px){.ba-cols{grid-template-columns:1fr}}
.ba-card{background:#fff;border:1px solid var(--line,#d8e0d8);border-radius:11px;padding:14px 16px}
.ba-h{font-size:.86rem;font-weight:800;margin-bottom:10px;display:flex;gap:9px;align-items:baseline}
.ba-h-note{font-size:.72rem;font-weight:500;color:var(--muted,#6b7a70)}
.ba-tablewrap{overflow-x:auto}
.ba-table{width:100%;border-collapse:collapse;font-size:.8rem}
.ba-table th{text-align:left;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;
  color:var(--muted,#6b7a70);padding:6px 9px;border-bottom:1px solid var(--line,#d8e0d8);white-space:nowrap}
.ba-table td{padding:7px 9px;border-bottom:1px solid #f1f4f1;white-space:nowrap}
.ba-table td.r,.ba-table th.r{text-align:right}
.ba-table .ba-tot{background:#f6f8f6;font-weight:700}
.ba-table tr.ba-net td{background:#f7faf8;font-weight:700;border-top:1px solid var(--line,#d8e0d8)}
.ba-table td.ba-neg{color:#c0392b}
.ba-list{list-style:none;margin:0;padding:0}
.ba-list li{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:6px 0;border-bottom:1px solid #f1f4f1;font-size:.82rem}
.ba-list li:last-child{border-bottom:none}
.ba-list b{font-size:.95rem;font-weight:800}
.ba-ok{color:#0a7a3d}
.ba-warn{color:#b3261e}
.ba-na{color:#a9b5ab;font-weight:600;font-size:.8rem;cursor:help}
.ba-empty{font-size:.82rem;color:var(--muted,#6b7a70);padding:8px 0;line-height:1.55}
/* Screen-share mask: the layout must not move when figures are hidden. */
.is-masked{filter:blur(7px);user-select:none}
.ba-sources{font-size:.76rem;color:var(--muted,#6b7a70);margin:-6px 0 14px;line-height:1.7}
.ba-sources b{color:var(--ink,#0f2419);font-weight:700}
.ba-missing{display:block;color:#a05a00;margin-top:2px}

/* ── Transaction code audit ─────────────────────────────────────────────── */
.ta-intro{font-size:.85rem;color:var(--muted,#6b7a70);line-height:1.65;margin-bottom:14px}
.ta-intro p{margin:0 0 6px}
.ta-note{font-size:.8rem}
.ta-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:9px;margin-bottom:14px}
.ta-tile{background:#fff;border:1px solid var(--line,#d8e0d8);border-radius:10px;padding:11px 13px;
  display:flex;flex-direction:column;gap:2px;text-decoration:none;transition:.15s}
.ta-tile:hover{border-color:#1B4020}
.ta-tile.is-on{border-color:#1B4020;box-shadow:0 0 0 2px rgba(27,64,32,.12)}
.ta-t-k{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700;color:var(--muted,#6b7a70)}
.ta-t-v{font-size:1.25rem;font-weight:800;color:var(--ink,#0f2419)}
.ta-tile.ta-bad .ta-t-v{color:#b3261e}
.ta-tile.ta-warn .ta-t-v{color:#8a6100}
.ta-tile.ta-ok .ta-t-v{color:#0a7a3d}
.ta-alarm{background:#fdeaea;border-left:3px solid #b3261e;padding:11px 14px;border-radius:0 8px 8px 0;
  font-size:.85rem;line-height:1.6;margin-bottom:14px;color:#7a1f1f}
.ta-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  font-size:.78rem;color:var(--muted,#6b7a70);margin-bottom:10px}
.ta-tablewrap{overflow-x:auto;border:1px solid var(--line,#d8e0d8);border-radius:10px;background:#fff}
.ta-table{width:100%;border-collapse:collapse;font-size:.8rem}
.ta-table th{background:#f6f8f6;text-align:left;font-size:.67rem;text-transform:uppercase;
  letter-spacing:.04em;color:var(--muted,#6b7a70);padding:8px 10px;white-space:nowrap;
  position:sticky;top:0;z-index:1}
.ta-table td{padding:8px 10px;border-top:1px solid #eef2ee;vertical-align:top}
.ta-table td.r,.ta-table th.r{text-align:right}
.ta-desc{max-width:280px}
.ta-sample{font-size:.7rem;color:#a9b5ab;margin-top:2px}
.ta-when{white-space:nowrap;font-size:.74rem;color:var(--muted,#6b7a70)}
.ta-sub{font-size:.76rem}
.ta-leg,.ta-sys{display:inline-block;font-size:.62rem;font-weight:700;border-radius:4px;
  padding:1px 5px;margin-left:3px;text-transform:uppercase}
.ta-leg{background:#eef2ff;color:#3b5bdb}
.ta-sys{background:#eaf3ec;color:#0a7a3d}
.ta-type{display:inline-block;font-size:.68rem;font-weight:700;border-radius:5px;padding:2px 7px}
.ta-ty-buy{background:#eaf3ec;color:#0a7a3d}
.ta-ty-sell{background:#fdeaea;color:#b3261e}
.ta-ty-switch{background:#eef2ff;color:#3b5bdb}
.ta-ty-none{background:#f2f5f2;color:#6b7a70}
.ta-verdict{display:inline-block;font-size:.68rem;font-weight:700;border-radius:20px;padding:2px 9px}
.ta-vunclassified{background:#fdeaea;color:#b3261e}
.ta-vguessed{background:#fbf3e2;color:#8a6100}
.ta-vreview{background:#fbf3e2;color:#8a6100}
.ta-vok{background:#eaf3ec;color:#0a7a3d}
.ta-row.ta-v-unclassified td{background:#fffafa}
.ta-empty{text-align:center;color:var(--muted,#6b7a70);padding:26px}

/* SIP Summary grid */
.sipg-range{display:flex;gap:4px}
.sipg-range-opt{font-size:.72rem;font-weight:700;padding:3px 9px;border-radius:20px;
  border:1px solid var(--line,#d8e0d8);color:var(--muted,#6b7a70);text-decoration:none}
.sipg-range-opt.is-on{background:#1B4020;border-color:#1B4020;color:#fff}
.sipg-table td.sipg-zero{color:#c3cdc6}
.sipg-table tfoot .sipg-total td{background:#f2f5f2;font-weight:800;border-top:2px solid #1B4020}

/* ── NAV by ISIN (admin/nav-mfapi.php) ───────────────────────────────────── */
.nmf{max-width:920px}
.nmf-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:20px}
.nmf-tile{background:#fff;border:1px solid var(--line);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:4px}
.nmf-tile.bad{border-color:rgba(184,58,58,.4);background:rgba(184,58,58,.04)}
.nmf-n{font-size:1.45rem;font-weight:700;color:var(--green-deep);line-height:1.1}
.nmf-tile.bad .nmf-n{color:#b83a3a}
.nmf-l{font-size:.74rem;color:var(--muted);line-height:1.3}

.nmf-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin-bottom:16px}
.nmf-card.good{border-color:rgba(30,58,36,.3);background:rgba(30,58,36,.03)}
.nmf-card.warn{border-color:rgba(206,157,65,.45);background:rgba(206,157,65,.05)}
.nmf-card.bad{border-color:rgba(184,58,58,.4);background:rgba(184,58,58,.04)}
.nmf-card.nmf-first{border-style:dashed}
.nmf-card h3{margin:0;font-size:1rem;color:var(--green-deep)}
.nmf-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.nmf-sub{font-size:.74rem;color:var(--muted)}
.nmf-p{margin:0 0 14px;font-size:.85rem;color:var(--muted);line-height:1.55}
.nmf-p code,.nmf-facts code{background:var(--bg);padding:1px 5px;border-radius:4px;font-size:.8em}
.nmf-warn{margin:10px 0 0;font-size:.82rem;color:#8a6a1f}
.nmf-btns{display:flex;flex-wrap:wrap;gap:10px}
.btn-sm{padding:6px 12px;font-size:.78rem}

.nmf-facts{margin:0;padding-left:18px;font-size:.86rem;color:var(--muted);line-height:1.7}
.nmf-facts b{color:var(--green-deep)}
.nmf-facts li.bad b{color:#b83a3a}

.nmf-bar{height:8px;border-radius:99px;background:var(--bg);overflow:hidden;margin:4px 0 10px}
.nmf-bar span{display:block;height:100%;width:0;background:var(--green);border-radius:99px;transition:width .25s ease}
.nmf-progress{margin:0 0 12px;font-size:.82rem;color:var(--green-deep);font-weight:600}

.nmf-log{max-height:300px;overflow-y:auto;border:1px solid var(--line);border-radius:10px;background:var(--bg)}
.nmf-line{display:grid;grid-template-columns:88px minmax(0,1fr) minmax(0,1.1fr);gap:10px;
  padding:7px 12px;font-size:.76rem;border-bottom:1px solid rgba(0,0,0,.045);align-items:baseline}
.nmf-line:last-child{border-bottom:0}
.nmf-line-s{font-weight:700;text-transform:uppercase;font-size:.66rem;letter-spacing:.04em}
.nmf-line.is-new .nmf-line-s{color:var(--green)}
.nmf-line.is-same .nmf-line-s{color:var(--muted)}
.nmf-line.is-error .nmf-line-s{color:#b83a3a}
.nmf-line-n{color:var(--green-deep);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nmf-line-d{color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media(max-width:640px){
  .nmf-line{grid-template-columns:1fr;gap:2px}
  .nmf-btns .btn{width:100%;justify-content:center}
}
.nmf-line.is-fix .nmf-line-s{color:#8a6a1f}

/* ── Cold-build holding page (includes/portfolio-gate.php) ───────────────── */
.pgate{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--bg)}
.pgate-card{width:100%;max-width:460px;background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:34px 32px;text-align:center;box-shadow:0 12px 40px rgba(12,24,18,.06)}
.pgate-card h1{margin:0 0 6px;font-size:1.3rem;color:var(--green-deep)}
.pgate-who{margin:0 0 22px;font-size:.9rem;color:var(--muted);line-height:1.5}
.pgate-pan{font-size:.78rem;letter-spacing:.08em;color:var(--muted)}

.pgate-spin{display:flex;gap:7px;justify-content:center;margin-bottom:20px}
.pgate-spin span{width:9px;height:9px;border-radius:50%;background:var(--green);
  animation:pgateBounce 1.2s infinite ease-in-out both}
.pgate-spin span:nth-child(1){animation-delay:-.24s}
.pgate-spin span:nth-child(2){animation-delay:-.12s}
@keyframes pgateBounce{0%,80%,100%{transform:scale(.5);opacity:.45}40%{transform:scale(1);opacity:1}}

.pgate-bar{height:7px;border-radius:99px;background:var(--bg);overflow:hidden;margin-bottom:10px}
.pgate-bar span{display:block;height:100%;width:0;border-radius:99px;
  background:linear-gradient(90deg,var(--green),var(--gold));transition:width .5s ease}
.pgate-step{margin:0 0 20px;font-size:.84rem;font-weight:600;color:var(--green-deep);min-height:1.2em}
.pgate-note{margin:0;font-size:.78rem;color:var(--muted);line-height:1.6}
.pgate-err{margin-top:16px;padding:11px 13px;border-radius:10px;font-size:.82rem;
  background:rgba(184,58,58,.06);border:1px solid rgba(184,58,58,.3);color:#8f2f2f}
.pgate-back{margin:22px 0 0;font-size:.82rem}
.pgate-back a{color:var(--green);font-weight:600}

@media (prefers-reduced-motion: reduce){
  .pgate-spin span{animation:none;opacity:.7}
  .pgate-bar span{transition:none}
}

/* ── Client login management (admin/client-login.php) ────────────────────── */
.clg{max-width:760px}
.clg-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px 22px;margin-bottom:16px}
.clg-card h3{margin:0 0 14px;font-size:1rem;color:var(--green-deep)}
.clg-card.clg-empty{border-style:dashed;color:var(--muted);font-size:.88rem}
.clg-card.clg-empty p{margin:0}

.clg-find{display:flex;gap:10px;flex-wrap:wrap}
.clg-find input{flex:1;min-width:200px;padding:11px 14px;border:1.5px solid var(--line);
  border-radius:10px;font-family:var(--sans);letter-spacing:.08em;font-weight:600}
.clg-find input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(206,157,65,.12)}
.clg-who{margin:12px 0 0;font-size:.85rem;color:var(--muted)}

.clg-state{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px}
.clg-state>div{display:flex;flex-direction:column;gap:3px}
.clg-state span{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.clg-state b{font-size:.88rem;color:var(--green-deep);font-weight:600}
.clg-dim{color:var(--muted);font-weight:400}
.clg-good{color:var(--green)}
.clg-bad{color:#b83a3a}
.clg-warn-t{color:#8a6a1f}

.clg-form .f{margin-bottom:18px}
.clg-form label{display:block;font-size:.82rem;font-weight:600;color:var(--green-deep);margin-bottom:7px}
.clg-form input[type=text]{width:100%;padding:12px 15px;border:1.5px solid var(--line);border-radius:10px;
  font-family:var(--sans);font-size:.92rem;background:var(--canvas)}
.clg-form input[type=text]:focus{outline:none;border-color:var(--gold);background:#fff;
  box-shadow:0 0 0 4px rgba(206,157,65,.12)}
.clg-hint{margin:7px 0 0;font-size:.77rem;color:var(--muted);line-height:1.55}
.clg-hint code{background:var(--bg);padding:1px 5px;border-radius:4px}
.clg-link{background:none;border:0;padding:0;color:var(--green);font-weight:600;cursor:pointer;
  font-family:var(--sans);font-size:.77rem;text-decoration:underline}

.clg-radio{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border:1.5px solid var(--line);
  border-radius:10px;margin-bottom:8px;cursor:pointer;font-weight:400}
.clg-radio:has(input:checked){border-color:var(--green);background:rgba(30,58,36,.03)}
.clg-radio input{margin-top:3px;accent-color:var(--green)}
.clg-radio span{font-size:.85rem;color:var(--muted);line-height:1.45}
.clg-radio b{color:var(--green-deep);font-weight:600}

.clg-check{display:flex;gap:10px;align-items:flex-start;margin-bottom:18px;font-weight:400}
.clg-check input{margin-top:3px;width:16px;height:16px;accent-color:var(--green)}
.clg-check span{font-size:.85rem;color:var(--green-deep);line-height:1.45}
.clg-check small{display:block;font-size:.76rem;color:var(--muted);margin-top:3px;font-weight:400}

.clg-danger{color:#b83a3a;border-color:rgba(184,58,58,.35)}
.clg-danger:hover{background:rgba(184,58,58,.06)}

/* Issued credentials */
.clg-issued{border-color:rgba(30,58,36,.35);background:rgba(30,58,36,.025)}
.clg-issued-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.clg-once{font-size:.7rem;text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:#8a6a1f;
  background:rgba(206,157,65,.14);padding:4px 9px;border-radius:99px}
.clg-cred{margin:16px 0;border:1px solid var(--line);border-radius:11px;overflow:hidden;background:#fff}
.clg-cred-row{display:grid;grid-template-columns:104px minmax(0,1fr) auto;gap:10px;align-items:center;
  padding:11px 14px;border-bottom:1px solid rgba(0,0,0,.05)}
.clg-cred-row:last-child{border-bottom:0}
.clg-cred-l{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
.clg-cred code{font-size:.88rem;color:var(--green-deep);word-break:break-all}
.clg-cred code.clg-pass{font-size:1.05rem;font-weight:700;letter-spacing:.06em}
.clg-copy{background:none;border:1px solid var(--line);border-radius:8px;width:32px;height:32px;
  cursor:pointer;color:var(--muted);flex:0 0 auto}
.clg-copy:hover{color:var(--green-deep);border-color:var(--green)}
.clg-copy.is-done{color:#fff;background:var(--green);border-color:var(--green)}

.clg-msg-l{display:block;font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);margin-bottom:6px}
.clg-msg{width:100%;padding:13px 15px;border:1.5px solid var(--line);border-radius:11px;background:#fff;
  font-family:var(--sans);font-size:.85rem;line-height:1.6;color:var(--green-deep);resize:vertical}
.clg-share{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.clg-warn{margin:16px 0 0;font-size:.79rem;color:#8a6a1f;line-height:1.6}

@media(max-width:560px){
  .clg-cred-row{grid-template-columns:1fr auto;gap:4px 10px}
  .clg-cred-l{grid-column:1/-1}
  .clg-share .btn{width:100%;justify-content:center}
}

/* Staff-setting-a-password banner on client/change-password.php */
.cp-admin-note{display:flex;gap:12px;align-items:flex-start;padding:13px 15px;margin-bottom:20px;
  border:1px solid rgba(206,157,65,.4);background:rgba(206,157,65,.07);border-radius:12px;
  font-size:.83rem;line-height:1.6;color:var(--green-deep)}
.cp-admin-note i{color:#8a6a1f;margin-top:2px;flex:0 0 auto}
.cp-admin-note b{display:block;margin-bottom:3px}
.cp-admin-note a{color:var(--green);font-weight:600}

/* ── Office map (contact.php) ─────────────────────────────────────────────── */
.map-card{display:grid;grid-template-columns:1.55fr 1fr;gap:0;background:#fff;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 14px 44px rgba(12,24,18,.07)}
.map-frame{position:relative;min-height:420px;background:var(--bg)}
.map-frame iframe{position:absolute;inset:0;width:100%;height:100%;display:block}

.map-side{padding:32px 30px;display:flex;flex-direction:column}
.map-side h3{margin:0 0 10px;font-family:var(--serif);font-size:1.3rem;color:var(--green-deep)}
.map-addr{margin:0 0 22px;font-size:.9rem;line-height:1.75;color:var(--muted)}

.map-meta{margin:0 0 24px;display:grid;grid-template-columns:auto;gap:2px}
.map-meta dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);font-weight:700;margin-top:12px}
.map-meta dt:first-child{margin-top:0}
.map-meta dt i{color:var(--gold);margin-right:6px}
.map-meta dd{margin:0;font-size:.88rem;color:var(--green-deep);font-weight:600}

.map-actions{display:flex;flex-direction:column;gap:10px;margin-top:auto}
.map-actions .btn{width:100%;justify-content:center}
.map-note{margin:10px 0 0;font-size:.74rem;color:var(--muted);text-align:center}

.info-map-link{display:inline-flex;align-items:center;gap:6px;margin-top:8px;
  font-size:.8rem;font-weight:600;color:var(--green)}
.info-map-link:hover{text-decoration:underline}

@media(max-width:900px){
  .map-card{grid-template-columns:1fr}
  .map-frame{min-height:320px}
  .map-side{padding:26px 22px}
}

/* ── Order entry: scheme picker & mandate box ─────────────────────────────── */
.schm{position:relative}
.schm-box{position:relative}
.schm-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);
  color:var(--muted);font-size:.82rem;pointer-events:none}
.schm-q{padding-left:32px !important}

.schm-picked{display:flex;align-items:center;gap:10px;margin-top:8px;padding:10px 12px;
  background:var(--green-soft);border:1px solid var(--line);border-radius:10px}
.schm-picked.is-hidden{display:none}
.schm-picked-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.schm-picked-main b{font-size:.86rem;color:var(--green-deep);line-height:1.35}
.schm-picked-main span{font-size:.74rem;color:var(--muted)}
.schm-clear{flex:none;background:none;border:0;cursor:pointer;color:var(--muted);
  padding:4px 6px;border-radius:6px;font-size:.9rem}
.schm-clear:hover{background:#fff;color:var(--green-deep)}

.schm-results{position:absolute;z-index:40;left:0;right:0;top:100%;margin-top:4px;
  max-height:320px;overflow-y:auto;background:#fff;border:1px solid var(--line);
  border-radius:12px;box-shadow:0 16px 44px rgba(12,24,18,.16)}
.schm-results.is-hidden{display:none}
.schm-row{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;
  padding:10px 14px;background:none;border:0;border-bottom:1px solid var(--line);
  cursor:pointer;font:inherit}
.schm-row:last-child{border-bottom:0}
.schm-row:hover,.schm-row.is-on{background:var(--green-soft)}
.schm-row-name{font-size:.84rem;font-weight:600;color:var(--green-deep);line-height:1.35}
.schm-row-meta{font-size:.72rem;color:var(--muted)}
.schm-row.is-blocked{opacity:.62}
.schm-row-flag{font-size:.68rem;color:#b4443a;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.schm-empty{padding:14px;font-size:.8rem;color:var(--muted);text-align:center}

.mand label{display:flex;align-items:center;justify-content:space-between;gap:10px}
.mand-sync{background:none;border:1px solid var(--line);border-radius:8px;
  padding:3px 10px;font-size:.7rem;font-weight:600;color:var(--green);cursor:pointer;
  text-transform:none;letter-spacing:0}
.mand-sync:hover:not(:disabled){background:var(--green-soft)}
.mand-sync:disabled{opacity:.55;cursor:default}
.mand option.is-blocked{color:#b4443a}

.mand-detail{margin-top:10px;padding:12px 14px;background:var(--bg);
  border:1px solid var(--line);border-radius:10px}
.mand-detail.is-hidden{display:none}
.mand-dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0}
.mand-dl dt{font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);font-weight:700}
.mand-dl dd{margin:0;font-size:.8rem;color:var(--green-deep);font-weight:600}
.mand-warn{margin:10px 0 0;font-size:.76rem;color:#b4443a;line-height:1.5}
.mand-stale{margin:8px 0 0;font-size:.72rem;color:var(--muted);line-height:1.5}
.f-hint.is-warn{color:#b4443a}

/* Mandate status pills, shared by the mandates page and the order screen. */
.mand-pill{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.68rem;
  font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.mand-approved{background:#e4f1e6;color:#1f6b34}
.mand-pending{background:#fdf1dc;color:#8a5a12}
.mand-rejected{background:#fbe6e4;color:#a2382d}
.mand-expired{background:#eee;color:#666}
.mand-unknown{background:#e8ecf5;color:#3d4d70}

/* ── Client master: full-record panel ─────────────────────────────────────── */
.cm-row{cursor:pointer}
.cm-row:hover{background:var(--green-soft)}
.cm-row:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}

.cmd-overlay{position:fixed;inset:0;z-index:120;background:rgba(12,24,18,.42);
  display:flex;justify-content:flex-end;backdrop-filter:blur(2px)}
.cmd-overlay.is-hidden{display:none}
.cmd-panel{width:min(560px,100%);height:100%;background:#fff;display:flex;
  flex-direction:column;box-shadow:-18px 0 50px rgba(12,24,18,.22);
  animation:cmdIn .18s ease-out}
@keyframes cmdIn{from{transform:translateX(24px);opacity:.4}to{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.cmd-panel{animation:none}}

.cmd-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:22px 24px 16px;border-bottom:1px solid var(--line)}
.cmd-head h3{margin:0;font-family:var(--serif);font-size:1.15rem;color:var(--green-deep)}
.cmd-sub{margin:4px 0 0;font-size:.76rem;color:var(--muted);font-family:ui-monospace,monospace}
.cmd-close{background:none;border:0;font-size:1.05rem;color:var(--muted);cursor:pointer;
  padding:4px 8px;border-radius:8px;line-height:1}
.cmd-close:hover{background:var(--bg);color:var(--green-deep)}

.cmd-body{flex:1;overflow-y:auto;padding:20px 24px 32px}
.cmd-sec{margin-bottom:22px}
.cmd-sec h4{margin:0 0 10px;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;
  color:var(--gold);font-weight:700}
.cmd-sec h4 span{color:var(--muted);font-weight:600}
.cmd-dl{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:6px 16px;margin:0}
.cmd-dl dt{font-size:.76rem;color:var(--muted);text-transform:capitalize}
.cmd-dl dd{margin:0;font-size:.8rem;color:var(--green-deep);font-weight:600;word-break:break-word}
.cmd-none{font-size:.8rem;color:var(--muted);margin:0}

.cmd-table{width:100%;border-collapse:collapse;font-size:.76rem}
.cmd-table th{text-align:left;font-size:.66rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--muted);padding:6px 8px;border-bottom:1px solid var(--line)}
.cmd-table td{padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
.cmd-table .r,.cmd-table th.r{text-align:right}

/* ── Order entry: folio suggestions ───────────────────────────────────────── */
.fol-suggest{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.fol-suggest.is-hidden{display:none}
.fol-lead{flex:0 0 100%;font-size:.72rem;color:var(--muted);line-height:1.5;margin-bottom:2px}
.fol-chip{display:flex;flex-direction:column;gap:1px;text-align:left;cursor:pointer;
  background:#fff;border:1px solid var(--line);border-radius:9px;padding:6px 11px;font:inherit}
.fol-chip:hover{border-color:var(--green);background:var(--green-soft)}
.fol-chip b{font-size:.78rem;color:var(--green-deep);font-family:ui-monospace,monospace}
.fol-chip span{font-size:.68rem;color:var(--muted)}
.fol-chip.is-exact{border-color:var(--green);background:var(--green-soft)}
.fol-chip.is-on{border-color:var(--gold);box-shadow:0 0 0 2px rgba(191,155,74,.22)}

/* ── NSE reports & bank picker ────────────────────────────────────────────── */
.rep-tabs{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start}
.rep-group{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.rep-group-label{font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;
  color:var(--gold);font-weight:700;margin-right:2px}
.rep-wrap{max-height:70vh;overflow:auto}
.rep-table{font-size:.74rem;white-space:nowrap}
.rep-table th{position:sticky;top:0;background:#fff;z-index:2;box-shadow:0 1px 0 var(--line)}
.rep-table td,.rep-table th{padding:7px 10px}

.bank-pick label{display:flex;align-items:center;justify-content:space-between;gap:10px}

/* ── Registrations & cancellations ────────────────────────────────────────── */
.reg-errs{margin:8px 0 0 18px;padding:0;font-size:.82rem;line-height:1.65}
.reg-errs li{margin-bottom:3px}
.f.is-off{opacity:.5}
.f.is-off input,.f.is-off select{background:var(--bg);cursor:not-allowed}

/* ── Dashboard: top-holdings tables ───────────────────────────────────────── */
.ba-table th.r,.ba-table td.r{text-align:right}
.ba-table td.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.72rem}
.ba-muted{color:var(--muted)}

/* ── Dashboard charts ─────────────────────────────────────────────────────── */
.ba-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0}
.ba-chart-card{padding:16px 18px}
.ba-chart-wide{grid-column:1 / -1}
.ba-chart-wrap{position:relative;height:230px;margin-top:12px}
.ba-chart-wrap.ba-chart-tall{height:290px}
@media(max-width:900px){
  .ba-charts{grid-template-columns:1fr}
  .ba-chart-wide{grid-column:auto}
}
/* Charts are numbers too — the Hide metrics toggle must blur them as well. */
.ba-wrap.is-hidden .ba-chart-wrap{filter:blur(7px);pointer-events:none;user-select:none}

/* ── Grouped sidebar navigation ──────────────────────────────────────────
   Thirty-five links in one flat list buries the ones you use daily among the
   ones you touch twice a year. <details> gives collapse for free, keyboard
   included, with no JS needed for the basic behaviour. */
/* An OPEN section has to look like a container, not like more list.
   The first version only indented its links by 20px and left everything else —
   colour, weight, icon size, background — identical to a top-level link. So
   opening a section just made the flat list longer: nothing showed where the
   section began or ended, and the heading you had clicked looked no different
   from the one below it. The hierarchy now comes from four things at once —
   the open section is tinted and outlined as one block, its heading fills in,
   its links sit against a rail, and they are set a step smaller and lighter. */
.panel-group{border-radius:10px;border:1px solid transparent;transition:background .18s,border-color .18s}
.panel-group + .panel-group{margin-top:3px}
.panel-group[open]{
  background:linear-gradient(180deg,rgba(233,241,234,.55),rgba(233,241,234,.2));
  border-color:var(--line);
  padding-bottom:2px
}
.panel-group-head{
  display:flex;align-items:center;gap:9px;
  padding:9px 12px;cursor:pointer;list-style:none;border-radius:9px;
  font-size:.68rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  color:var(--muted);user-select:none;transition:.18s
}
.panel-group-head::-webkit-details-marker{display:none}
.panel-group-head:hover{background:var(--green-soft);color:var(--green-deep)}
/* The section's own glyph, matched in width to the item icons below it so
   headings and links share one left edge. */
.panel-group-icon{width:20px;text-align:center;font-size:.82rem;opacity:.85;flex:0 0 auto}
.panel-group-head span{flex:1;min-width:0}
.panel-group-caret{font-size:.62rem;transition:transform .2s;opacity:.6;flex:0 0 auto}
.panel-group[open] > .panel-group-head > .panel-group-caret{transform:rotate(180deg);opacity:1}
/* The heading you just clicked reads as the lid of the box it opened. */
.panel-group[open] > .panel-group-head{
  color:var(--green-deep);border-radius:9px 9px 0 0;
  border-bottom:1px solid rgba(206,157,65,.22)
}
.panel-group[open] > .panel-group-head > .panel-group-icon{color:var(--gold);opacity:1}

/* The rail: one continuous line the section's links hang off, so the eye can
   see at a glance which links belong to which heading. */
.panel-group-body{
  display:flex;flex-direction:column;gap:1px;
  margin:5px 10px 4px 21px;padding:1px 0 1px 11px;
  border-left:2px solid rgba(206,157,65,.28)
}
/* A step down from a top-level link — smaller, lighter, smaller glyph — so a
   child never reads as a sibling of the sections around it. */
.panel-group-body .panel-link{
  padding:8px 10px;font-size:.83rem;font-weight:500;border-radius:8px
}
.panel-group-body .panel-link i{width:16px;font-size:.78rem;opacity:.75}
.panel-group-body .panel-link:hover{background:rgba(255,255,255,.85);color:var(--green-deep)}
.panel-group-body .panel-link:hover i{opacity:1}
/* The current page: filled, and marked on the rail itself rather than only by
   its own background, so it is findable while scanning the rail. */
.panel-group-body .panel-link.active{
  background:#fff;font-weight:700;color:var(--green-deep);
  border:1px solid rgba(206,157,65,.28);box-shadow:var(--gold-glow-sm);
  position:relative
}
.panel-group-body .panel-link.active::before{
  content:'';position:absolute;left:-13px;top:50%;transform:translateY(-50%);
  width:2px;height:60%;background:var(--gold);border-radius:2px
}
.panel-group-body .panel-link.active i{opacity:1;color:var(--gold)}
/* A collapsed section holding the current page would hide where you are, so
   the active link keeps its emphasis and the section opens by default. */
.panel-group:not([open]) .panel-link.active{background:none}
/* A section that is shut but holds the current page still says so, quietly. */
.panel-group:not([open]):has(.panel-link.active) > .panel-group-head{
  color:var(--green-deep)
}
.panel-group:not([open]):has(.panel-link.active) > .panel-group-head > .panel-group-icon{
  color:var(--gold);opacity:1
}

/* ── UCC registration: PAN first, then collapsible categories ──────────────
   The form asks for the PAN before anything else because NSE already knows the
   name and the KYC status, and re-keying a name the API just returned is how a
   registered name stops matching. */
.ucc-pan{background:linear-gradient(120deg,var(--green-soft),#fff 70%);
  border:1px solid var(--line);border-left:3px solid var(--gold);
  border-radius:12px;padding:16px 18px;margin-bottom:16px}
.ucc-pan-row{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap}
.ucc-pan-row .f{flex:1 1 240px;min-width:0;margin:0}
.ucc-pan-input{font-family:ui-monospace,Menlo,monospace!important;letter-spacing:.1em;
  text-transform:uppercase;font-size:1rem!important}
.ucc-req{font-weight:400;font-size:.68rem;color:#b93a3a;text-transform:none;letter-spacing:0}
.ucc-pan-btn{font:inherit;font-size:.8rem;font-weight:700;padding:11px 18px;border-radius:9px;
  border:1px solid var(--line);background:#fff;color:var(--green-deep);cursor:pointer;
  white-space:nowrap;transition:.18s}
.ucc-pan-btn:hover{border-color:var(--gold);box-shadow:var(--gold-glow-sm)}
.ucc-pan-hint{font-size:.76rem;color:var(--muted);line-height:1.6;margin:10px 0 0}

.ucc-pan-out{margin-top:12px;padding:11px 13px;border-radius:9px;font-size:.8rem;line-height:1.6;
  border:1px solid var(--line);background:#fff}
.ucc-pan-out.is-ok{background:var(--green-soft);border-color:rgba(15,76,21,.2)}
.ucc-pan-out.is-warn{background:#fdf7e8;border-color:rgba(206,157,65,.4)}
.ucc-pan-name{font-weight:800;font-size:.95rem;color:var(--green-deep);letter-spacing:.01em}
.ucc-pan-status{margin-top:3px;font-weight:700;font-size:.76rem;color:var(--green-deep)}
.ucc-pan-status span{font-weight:400;color:var(--muted)}
.ucc-pan-out.is-warn .ucc-pan-status{color:#8a6215}
.ucc-pan-filled{margin-top:6px;font-size:.74rem;color:var(--muted)}
.ucc-pan-msg{margin-top:6px;font-size:.74rem;color:var(--muted)}
.ucc-spin{display:inline-block;width:11px;height:11px;border:2px solid var(--line);
  border-top-color:var(--green);border-radius:50%;animation:ucc-spin .7s linear infinite;
  vertical-align:-1px;margin-right:6px}
@keyframes ucc-spin{to{transform:rotate(360deg)}}
/* A field the lookup filled is marked, so an operator can see at a glance what
   they did not type themselves. */
.is-autofilled{background:var(--green-soft)!important}

.ucc-sec{border:1px solid var(--line);border-radius:11px;margin-bottom:9px;background:#fff}
.ucc-sec.has-err{border-color:rgba(185,58,58,.35);border-left:3px solid #b93a3a}
.ucc-sec>summary{cursor:pointer;list-style:none;padding:13px 16px;display:flex;
  align-items:center;gap:10px;flex-wrap:wrap}
.ucc-sec>summary::-webkit-details-marker{display:none}
.ucc-sec>summary::before{content:'+';font-weight:800;color:var(--gold);width:18px;
  height:18px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);border-radius:50%;font-size:.8rem;flex:0 0 auto}
.ucc-sec[open]>summary::before{content:'\2212'}
.ucc-sec[open]>summary{border-bottom:1px solid var(--line)}
.ucc-sec-t{font-weight:700;font-size:.92rem;color:var(--ink)}
.ucc-sec-n{font-size:.74rem;color:var(--muted)}
.ucc-sec-badge{margin-left:auto;font-size:.68rem;font-weight:700;padding:2px 9px;
  border-radius:999px;white-space:nowrap}
.ucc-sec-badge.is-done{background:var(--green-soft);color:var(--green-deep)}
.ucc-sec-badge.is-part{background:var(--canvas);color:var(--muted)}
.ucc-sec-badge.is-err{background:#fdeeee;color:#8f2b2b}
.ucc-sec-body{padding:14px 16px 16px}
.ucc-sec-body .fr:first-child{margin-top:0}

@media(max-width:560px){
  .ucc-pan-row{flex-direction:column;align-items:stretch}
  .ucc-pan-btn{width:100%}
}