*{margin:0;padding:0;box-sizing:border-box;}
body{font-family:'Nunito',Arial,sans-serif;background:#fff8f2;color:#222;min-height:100vh;}
nav{background:#fff;box-shadow:0 2px 10px rgba(0,0,0,0.07);position:sticky;top:0;z-index:100;padding:0 20px;}
.nav-inner{max-width:900px;margin:auto;display:flex;align-items:center;justify-content:space-between;min-height:62px;gap:18px;}
.logo{font-size:1.5rem;font-weight:900;color:#f80;letter-spacing:-1px;white-space:nowrap;}
.logo span{color:#222;}
.nav-links{display:flex;gap:28px;align-items:center;}
.nav-links a{text-decoration:none;color:#444;font-weight:700;font-size:.97rem;transition:color .2s;}
.nav-links a:hover,.nav-links a.active{color:#f80;}
.menu-toggle{display:none;background:#fff3e0;color:#f80;border:1px solid #ffe0b2;border-radius:8px;width:40px;height:36px;font-size:1.25rem;font-weight:900;cursor:pointer;}
.hero{background:linear-gradient(135deg,#ff8c00 0%,#ffb347 100%);color:#fff;padding:60px 20px 50px;text-align:center;}
.hero h1{font-size:2.2rem;font-weight:900;line-height:1.2;margin-bottom:14px;letter-spacing:0;}
.hero p{font-size:1.05rem;opacity:.93;max-width:480px;margin:0 auto 28px;line-height:1.5;}
.btn-white{display:inline-block;background:#fff;color:#f80;font-weight:800;font-size:1rem;padding:14px 38px;border-radius:50px;text-decoration:none;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 15px rgba(0,0,0,.15);}
.btn-white:hover{transform:translateY(-2px);box-shadow:0 7px 20px rgba(0,0,0,.2);}
.section{max-width:700px;margin:0 auto;padding:40px 20px;}
.section-tight{padding-top:0;}
.section-title{font-size:1.7rem;font-weight:900;color:#222;margin-bottom:8px;letter-spacing:0;}
.section-sub{color:#666;font-size:.97rem;margin-bottom:28px;line-height:1.6;}
.cat-card{background:#fff;border-radius:16px;padding:24px 20px;margin-bottom:18px;box-shadow:0 2px 12px rgba(0,0,0,.06);}
.cat-title{font-size:1.1rem;font-weight:800;color:#f80;margin-bottom:14px;}
.cat-item{display:flex;align-items:center;gap:10px;margin-bottom:9px;font-size:.97rem;color:#333;}
.diamond{color:#4aa8e8;font-size:1rem;}
.proceed-wrap{margin-top:10px;}
.btn-orange{display:block;background:#f80;color:#fff;font-weight:800;font-size:1.05rem;padding:17px 20px;border-radius:50px;text-align:center;text-decoration:none;transition:background .2s,transform .15s;box-shadow:0 4px 14px rgba(255,136,0,.3);border:none;cursor:pointer;font-family:'Nunito',Arial,sans-serif;width:100%;}
.btn-orange:hover{background:#e07800;transform:translateY(-1px);}
.link-button{text-decoration:none;display:block;text-align:center;}
.steps{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:10px;}
.step{background:#fff;border-radius:14px;padding:20px 16px;text-align:center;box-shadow:0 2px 10px rgba(0,0,0,.05);}
.step-num{width:38px;height:38px;background:#fff3e0;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:900;color:#f80;font-size:1rem;margin:0 auto 10px;}
.step h4{font-size:.92rem;font-weight:800;color:#222;margin-bottom:5px;}
.step p{font-size:.82rem;color:#777;line-height:1.5;}
.progress-wrap{background:#fff;padding:16px 20px;border-bottom:1px solid #ffe0b2;}
.progress-inner{max-width:500px;margin:auto;display:flex;align-items:center;justify-content:space-between;}
.step-dot{display:flex;flex-direction:column;align-items:center;gap:5px;min-width:48px;}
.dot{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.9rem;}
.dot.active{background:#f80;color:#fff;}
.dot.inactive{background:#ffe0b2;color:#f80;}
.dot.done{background:#4caf50;color:#fff;}
.step-label{font-size:.72rem;font-weight:700;color:#888;}
.step-label.active{color:#f80;}
.step-label.done{color:#4caf50;}
.progress-line{flex:1;height:3px;background:#ffe0b2;margin:0 8px 18px;border-radius:2px;}
.progress-line.done{background:#f80;}
.page{max-width:500px;margin:36px auto;padding:0 16px 40px;}
.card{background:#fff;border-radius:20px;padding:32px 28px;box-shadow:0 4px 20px rgba(0,0,0,.07);}
.card-title{font-size:1.6rem;font-weight:900;color:#222;margin-bottom:6px;}
.card-sub{color:#888;font-size:.93rem;margin-bottom:26px;line-height:1.5;}
label{display:block;font-weight:700;font-size:.9rem;color:#444;margin-bottom:6px;margin-top:18px;}
label:first-of-type{margin-top:0;}
input[type=text],input[type=tel],input[type=password],input[type=number]{width:100%;padding:13px 15px;border:2px solid #ffe0b2;border-radius:10px;font-size:.97rem;font-family:'Nunito',Arial,sans-serif;color:#222;outline:none;transition:border .2s;background:#fff;}
input:focus{border-color:#f80;}
.hint{font-size:.8rem;color:#aaa;margin-top:5px;}
.error{background:#fff0f0;border:1px solid #ffcccc;border-radius:10px;padding:12px 16px;color:#c0392b;font-size:.9rem;margin-bottom:16px;font-weight:600;}
.pending-box,.success-box{text-align:center;padding:20px 0;}
.pending-icon,.success-icon{font-size:3.5rem;margin-bottom:12px;line-height:1;}
.pending-box h2,.success-box h2{font-size:1.45rem;font-weight:900;color:#222;margin-bottom:10px;letter-spacing:0;}
.pending-box p,.success-box p{color:#666;font-size:.94rem;line-height:1.7;margin-bottom:18px;}
.pending-box .note,.success-box .note{background:#fff8f0;border:1px solid #ffe0b2;border-radius:12px;padding:14px 16px;font-size:.85rem;color:#888;margin-top:16px;}
.btn-refresh{display:block;width:100%;background:#fff;color:#f80;font-weight:800;font-size:1rem;padding:14px;border-radius:50px;border:2px solid #f80;cursor:pointer;margin-top:16px;font-family:'Nunito',Arial,sans-serif;text-align:center;text-decoration:none;}
.upload-box{border:2px dashed #ffb347;border-radius:12px;padding:24px;text-align:center;cursor:pointer;background:#fff9f0;margin-top:6px;}
.upload-box input[type=file]{display:none;}
.upload-icon{font-size:2rem;margin-bottom:8px;color:#f80;}
.upload-box p{font-size:.9rem;color:#888;margin:0;}
.upload-label{font-weight:700;color:#f80;}
.preview-img{max-width:100%;border-radius:10px;margin-top:12px;display:none;border:2px solid #ffe0b2;}
.level-grid{display:grid;gap:10px;margin-top:6px;}
.level-option{border:2px solid #ffe0b2;border-radius:12px;padding:14px 16px;cursor:pointer;transition:border .2s,background .2s;margin-top:0;}
.level-option input[type=radio]{display:none;}
.level-option.selected{border-color:#f80;background:#fff3e0;}
.level-name{font-weight:800;color:#f80;font-size:.95rem;margin-bottom:6px;}
.level-items{font-size:.82rem;color:#555;line-height:1.7;}
.admin-shell{max-width:1040px;margin:34px auto;padding:0 18px 44px;}
.admin-topbar{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-bottom:18px;}
.admin-logout{max-width:130px;margin-top:0;}
.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:18px;}
.stat-card{background:#fff;border-radius:16px;padding:20px;box-shadow:0 2px 12px rgba(0,0,0,.06);border:1px solid #ffe0b2;}
.stat-card span{display:block;font-size:2rem;font-weight:900;color:#f80;line-height:1;}
.stat-card p{font-size:.9rem;color:#666;font-weight:800;margin-top:8px;}
.admin-card{background:#fff;border-radius:18px;padding:22px;box-shadow:0 4px 20px rgba(0,0,0,.07);}
.admin-card-title{font-size:1.15rem;font-weight:900;margin-bottom:16px;}
.table-wrap{width:100%;overflow-x:auto;}
.admin-table{width:100%;border-collapse:collapse;min-width:760px;}
.admin-table th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:0;color:#777;background:#fff8f0;padding:12px;border-bottom:1px solid #ffe0b2;}
.admin-table td{font-size:.9rem;color:#333;padding:13px 12px;border-bottom:1px solid #f4eadf;vertical-align:middle;}
.empty-row{text-align:center;color:#888;padding:28px!important;}
.status-pill{display:inline-flex;align-items:center;justify-content:center;min-width:92px;padding:6px 10px;border-radius:999px;font-size:.78rem;font-weight:900;text-transform:capitalize;background:#fff3e0;color:#f80;}
.status-pill.approved,.status-pill.activated{background:#eaf7ec;color:#2e7d32;}
.status-pill.pending,.status-pill.not_activated{background:#fff3e0;color:#f80;}
.small-btn{background:#f80;color:#fff;border:none;border-radius:999px;padding:9px 15px;font-family:'Nunito',Arial,sans-serif;font-weight:900;cursor:pointer;box-shadow:0 3px 10px rgba(255,136,0,.22);}
.approved-text{color:#2e7d32;font-weight:900;font-size:.86rem;}
.success-alert{background:#eaf7ec;border:1px solid #bfe6c4;color:#2e7d32;border-radius:12px;padding:13px 16px;margin-bottom:16px;font-weight:800;}
footer{background:#222;color:#aaa;text-align:center;padding:22px 20px;font-size:.85rem;margin-top:20px;}
footer span{color:#f80;font-weight:700;}
@media(max-width:650px){
  nav{padding:0 14px;}
  .nav-inner{min-height:62px;align-items:flex-start;padding:13px 0;position:relative;}
  .menu-toggle{display:block;margin-left:auto;}
  .nav-links{display:none;position:absolute;top:56px;right:0;left:0;background:#fff;border:1px solid #ffe0b2;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.08);padding:12px;gap:4px;flex-direction:column;align-items:stretch;}
  .nav-links.open{display:flex;}
  .nav-links a{padding:10px 12px;border-radius:8px;}
  .nav-links a.active{background:#fff3e0;}
  .admin-topbar{display:block;}
  .admin-logout{max-width:none;margin-top:12px;}
  .admin-stats{grid-template-columns:1fr;}
}
@media(max-width:500px){
  .hero{padding:50px 16px 42px;}
  .hero h1{font-size:1.7rem;}
  .steps{grid-template-columns:1fr;}
  .card{padding:28px 22px;border-radius:18px;}
  .progress-wrap{padding:14px 10px;}
  .progress-inner{max-width:100%;}
  .step-dot{min-width:42px;}
  .step-label{font-size:.66rem;}
  .progress-line{margin-left:4px;margin-right:4px;}
}
