:root{--ink:#191525;--purple:#6e4add;--purple2:#5835c7;--muted:#7e7786;--line:#e9e5ee;--soft:#f8f6fa;--green:#16815e}*{box-sizing:border-box}body{margin:0;font-family:Arial,sans-serif;color:var(--ink);background:#faf9fb}a{text-decoration:none;color:inherit}.brand{font-size:25px;font-weight:800;display:flex;align-items:center;gap:10px}.brand span{width:35px;height:35px;background:var(--purple);color:#fff;border-radius:11px;display:grid;place-items:center;font-family:Georgia,serif;font-style:italic}.top{height:78px;max-width:1180px;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.top>div{display:flex;align-items:center;gap:20px;font-size:12px}.primary,.outline{display:inline-block;border:0;border-radius:9px;padding:12px 17px;font-weight:700;font-size:11px;cursor:pointer}.primary{background:var(--purple);color:#fff}.primary:hover{background:var(--purple2)}.outline{background:#fff;border:1px solid var(--line)}.big{padding:15px 21px}.landing{background:radial-gradient(circle at 80% 30%,#eee8ff,transparent 35%),#fff;min-height:calc(100vh - 78px)}.landing>section{max-width:1180px;margin:auto;min-height:620px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px}.hero-copy>b{color:var(--purple);font-size:10px;letter-spacing:1.5px}.hero-copy h1{font:56px/1.04 Georgia,serif;letter-spacing:-2px;margin:20px 0}.hero-copy h1 em{color:var(--purple);font-weight:normal}.hero-copy p{color:var(--muted);line-height:1.7;margin-bottom:30px}.product-card{background:#fff;border:1px solid var(--line);padding:30px;border-radius:20px;box-shadow:0 30px 70px #39265c22}.product-card>div{display:flex;justify-content:space-between}.product-card h3{font:22px Georgia,serif;margin:0}.product-card>div small{color:var(--green);background:#e3f6ee;padding:6px 8px;border-radius:15px}.product-card>p{font-size:10px;color:#999;margin:30px 0 6px}.product-card>strong{font-size:32px}.product-card i{font-size:10px;font-style:normal}.product-card hr{border:0;height:8px;background:linear-gradient(90deg,var(--purple) 78%,#eee 78%);border-radius:10px;margin:18px 0}.product-card section{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:10px}.product-card section span{padding:15px;border-right:1px solid var(--line);font-weight:700}.product-card section span:last-child{border:0}.product-card section small{display:block;color:#999;font-size:8px;margin-top:5px}.modal-bg{position:fixed;inset:0;background:#1a132799;display:grid;place-items:center;padding:20px;z-index:50}.auth-card,.install-card{background:#fff;width:min(420px,100%);padding:30px;border-radius:17px;box-shadow:0 25px 80px #0004;position:relative}.auth-card.wide{width:min(560px,100%)}.auth-card h2,.install-card h1{font:27px Georgia,serif;margin:28px 0 8px}.auth-card>p,.install-card>p{color:var(--muted);font-size:11px}.close{position:absolute;right:20px;top:15px;font-size:24px;color:#888}.auth-card form,.install-card form{display:grid;gap:13px;margin:22px 0}.auth-card label,.install-card label{font-size:9px;font-weight:700}.auth-card input,.auth-card select,.auth-card textarea,.install-card input{display:block;width:100%;border:1px solid #ddd7e3;padding:11px;border-radius:8px;margin-top:6px;font-size:11px}.auth-card textarea{min-height:65px}.auth-card>small{display:block;text-align:center;color:#888}.auth-card>small a{color:var(--purple);font-weight:bold}.alert,.flash{padding:11px;border-radius:8px;background:#fff0db;color:#9b5c06;font-size:10px;margin:15px 0}.success-box{text-align:center}.success-box p{color:var(--muted);font-size:11px;line-height:1.6}.auth-body{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at 50% 0,#eee8ff,transparent 40%),#f8f6fa}.install-card{width:min(500px,calc(100% - 30px))}.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dash{display:grid;grid-template-columns:235px 1fr;min-height:100vh}.dash aside{position:fixed;width:235px;height:100vh;background:#211a30;color:#fff;padding:25px 18px;display:flex;flex-direction:column}.light{color:#fff;margin:0 10px 28px}.dash aside>label{background:#2d253b;border:1px solid #40364f;padding:10px;border-radius:9px;font-size:8px;color:#aaa}.dash aside select{display:block;width:100%;margin-top:6px;background:transparent;color:#fff;border:0;font-weight:bold;font-size:11px}.dash aside select option{color:#222}.dash aside nav{display:grid;margin-top:25px;gap:5px}.dash aside nav a{padding:11px 12px;border-radius:8px;color:#afa7b8;font-size:11px}.dash aside nav a.active{background:var(--purple);color:#fff;font-weight:bold}.dash aside>div{margin-top:auto;border-top:1px solid #3b3248;display:grid;padding-top:12px}.dash aside>div a{padding:7px 10px;color:#aaa;font-size:10px}.content{grid-column:2;padding:0 38px 50px}.content header{height:88px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.content header small{font-size:8px;color:#999;letter-spacing:1px}.content header h1{font:23px Georgia,serif;margin:5px 0}.content header>b{text-align:right;font-size:10px}.content header>b small{display:block;margin-top:4px}.flash.success{background:#e4f7ee;color:#157c58}.title{display:flex;justify-content:space-between;align-items:end;margin:30px 0 20px}.title small{background:#eee8ff;color:#6543c7;padding:5px 7px;border-radius:5px;font-size:8px;font-weight:bold}.title h2{font:28px Georgia,serif;margin:6px 0}.title p{font-size:10px;color:#888;margin:0}.empty{max-width:540px;margin:110px auto;text-align:center;background:#fff;border:1px solid var(--line);padding:50px;border-radius:17px}.empty>span{display:grid;place-items:center;margin:auto;width:58px;height:58px;border-radius:17px;background:#eee8ff;color:var(--purple);font:italic 28px Georgia}.empty h2{font:27px Georgia,serif}.empty p{color:#888;font-size:11px;margin-bottom:25px}.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:16px}.kpis article,.panel{background:#fff;border:1px solid var(--line);border-radius:13px;padding:20px}.kpis small,.kpis span{display:block;color:#96909b;font-size:8px}.kpis strong{display:block;font-size:19px;margin:7px 0}.panel-head{display:flex;justify-content:space-between;align-items:center}.panel h3{font:18px Georgia,serif;margin:0 0 15px}.panel-head b{color:var(--purple)}.progress{height:9px;background:#eeeaf2;border-radius:10px;margin:18px 0}.progress i{display:block;height:100%;background:linear-gradient(90deg,var(--purple),#9b7bea);border-radius:10px}.member-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}.member-list>div{display:grid;grid-template-columns:32px 1fr auto;align-items:center;gap:9px;background:#faf9fb;padding:10px;border-radius:9px}.member-list>div>i{width:31px;height:31px;border-radius:50%;background:#ebe4ff;color:#6140c4;display:grid;place-items:center;font-style:normal;font-size:8px}.member-list b,.member-list small{display:block;font-size:9px}.member-list small{color:#999}.paid,.pending{font-style:normal;font-size:8px;padding:5px 8px;border-radius:15px}.paid{color:#167e59;background:#e1f6ec}.pending{color:#a86a13;background:#fff0d3}.block{display:block;text-align:center;margin-top:18px}.table{overflow:auto;margin:0 -20px -20px}table{border-collapse:collapse;width:100%;min-width:700px}th{text-align:left;background:#faf9fb;padding:11px 15px;color:#918b96;font-size:8px}td{border-top:1px solid #eee;padding:12px 15px;font-size:9px}td small{display:block;color:#999;margin-top:3px}td form{margin:0}td select{border:1px solid #ddd;border-radius:6px;padding:5px;font-size:9px}.tiny{border:0;background:var(--purple);color:#fff;border-radius:6px;padding:6px 8px;font-size:8px}.timeline>div{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #eee}.timeline i{background:#e3f6ed;color:#16805a;width:27px;height:27px;border-radius:8px;display:grid;place-items:center;font-style:normal}.timeline b,.timeline small{display:block;font-size:9px}.timeline small,.timeline time{color:#999}.timeline time{font-size:8px}.settings{display:grid;grid-template-columns:1fr 1fr;gap:15px}.settings .code{text-align:center}.code>small{font-size:8px;color:#999}.code>strong{display:block;color:var(--purple);font-size:30px;letter-spacing:5px;margin:16px}.code p,.settings p{font-size:10px;color:#888}
@media(max-width:800px){.top,.landing>section{margin:0 20px}.landing>section{grid-template-columns:1fr;padding:60px 0}.hero-copy h1{font-size:42px}.product-card{display:none}.dash{display:block}.dash aside{position:relative;width:100%;height:auto;flex-direction:row;align-items:center;padding:13px}.dash aside .brand{margin:0}.dash aside>label{margin-left:auto;max-width:180px}.dash aside nav{position:fixed;z-index:20;bottom:0;left:0;right:0;background:#211a30;margin:0;display:flex;justify-content:space-around;padding:7px}.dash aside nav a{font-size:0}.dash aside nav a:first-letter{font-size:18px}.dash aside>div{display:none}.content{padding:0 18px 75px}.kpis{grid-template-columns:1fr}.member-list,.settings{grid-template-columns:1fr}}@media(max-width:500px){.top>div>a:first-child{display:none}.hero-copy h1{font-size:36px}.fields{grid-template-columns:1fr}.content header>b{display:none}.title{align-items:flex-start}.member-list{grid-template-columns:1fr}}
.payment-center{width:min(1100px,calc(100% - 30px));margin:35px auto}.pay-head{display:flex;align-items:center;justify-content:space-between;margin:25px 0}.pay-head h1{font:30px Georgia,serif;margin:0}.pay-head p,.orange-config p{color:var(--muted);font-size:11px}.pay-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px}.pay-form{display:grid;gap:12px}.pay-form label{font-size:9px;font-weight:700}.pay-form input,.pay-form select{width:100%;display:block;margin-top:6px;padding:11px;border:1px solid #ddd7e3;border-radius:8px;background:#fff}.proof-link{color:var(--purple);font-weight:700}.flash.error{background:#ffe8e8;color:#9c2828}@media(max-width:700px){.pay-grid{grid-template-columns:1fr}.pay-head{align-items:flex-start;gap:20px}.payment-center{margin:20px auto}}
.momo-config{border-top:4px solid #ffcc00}.momo-button,.momo-badge{background:#ffcc00;color:#111;border:0;border-radius:8px;padding:12px 16px;font-weight:800;cursor:pointer}.momo-badge{display:inline-block;padding:8px 13px}.momo-status{text-align:center}.momo-status h1{margin-top:20px}