@import"https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700;800&display=swap";:root{--color-green-900: #004225;--color-green-800: #00622d;--color-green-700: #008f44;--color-green-600: #00a850;--color-green-500: #14d861;--color-lime: #98e303;--color-gold: #f6c600;--color-cream: #fbf8f1;--color-paper: #fffdf8;--color-line: #e7dfcf;--color-brown: #5a411e;--color-slate: #687286;--color-ink: #1d2733;--color-rose: #fae2e5;--color-danger: #e1253a;--font-sans: "Poppins", Inter, Roboto, system-ui, sans-serif;--viewport-height: 100vh;color:var(--color-ink);letter-spacing:0;background:#eef4ee;font-family:var(--font-sans)}@supports (height: 100dvh){:root{--viewport-height: 100dvh}}*{box-sizing:border-box}button,input,select,textarea{font:inherit;letter-spacing:0}button{cursor:pointer}body{min-width:320px;min-height:var(--viewport-height);margin:0}#root{min-height:var(--viewport-height)}a{color:inherit;text-decoration:none}.phone-shell{width:100%;min-height:var(--viewport-height);max-width:640px;margin:0 auto;background:var(--color-paper);position:relative;display:flex;flex-direction:column}@media (min-width: 768px){body{background:linear-gradient(180deg,#e8f3ea,#eef4ee)}.phone-shell{max-width:680px;min-height:calc(var(--viewport-height) - 32px);margin:16px auto;border-radius:20px;box-shadow:0 20px 50px #00321c24,0 0 0 1px #00422514;overflow:hidden}}.mobile-screen{width:100%;flex:1;min-height:var(--viewport-height);position:relative;display:flex;flex-direction:column}@media (min-width: 768px){.mobile-screen{min-height:calc(var(--viewport-height) - 32px)}}.primary-action,.secondary-action,.join-button{border:0;border-radius:8px;justify-content:center;align-items:center;gap:8px;height:46px;font-weight:700;display:inline-flex}.primary-action{color:#fff;background:var(--color-green-600);width:100%;font-size:16px}.secondary-action{color:var(--color-green-600);background:#fff;border:1px solid var(--color-line);width:100%}.join-button{color:#fff;background:var(--color-green-500);border-radius:24px;padding:0 32px}.text-link{color:var(--color-green-600);background:none;border:0;font-weight:700}.field{color:#24b96b;background:#ffffffd6;border:1px solid #cfcfcf;border-radius:8px;display:grid;grid-template-columns:34px 1fr;align-items:center;height:47px;padding:0 12px}.field input{min-width:0;color:var(--color-ink);background:none;border:0;outline:none}.field input::placeholder{color:#b0b4bd}.form-row{display:block;margin-bottom:14px}.form-row span{color:var(--color-brown);margin-bottom:7px;font-size:13px;font-weight:700;display:block}.form-row div,.form-row select{border:1px solid #eee5d8;border-radius:8px;align-items:center;gap:8px;height:43px;padding:0 12px;display:flex;width:100%;background:#fff}.form-row input,.form-row select{width:100%;color:var(--color-slate);background:none;border:0;outline:none}.app-logo{display:block;line-height:0}.app-logo img{width:auto;height:auto;max-width:min(140px,32vw);max-height:120px;object-fit:contain}.app-logo.large img{max-width:min(220px,52vw);max-height:180px}.app-logo.small img{max-width:min(96px,24vw);max-height:72px}.auth-screen{display:flex;flex-direction:column;align-items:center;padding:clamp(48px,12vh,120px) clamp(20px,6vw,40px) 36px;background:var(--color-paper);overflow:auto}.auth-title{color:var(--color-green-800);margin:clamp(16px,3vh,24px) 0 clamp(32px,6vh,48px);font-size:clamp(28px,6vw,40px);font-weight:800;text-align:center}.onboarding-brand{position:absolute;top:clamp(32px,8vh,56px);left:50%;transform:translate(-50%);z-index:4;filter:drop-shadow(0 8px 18px #00321c33)}.pattern-green{background:linear-gradient(180deg,#13d861eb,#006b58fa),repeating-linear-gradient(45deg,#ffffff29 0 2px,transparent 2px 66px),var(--color-green-600)}.onboarding-copy{z-index:3;color:#fff;text-align:center;position:absolute;top:clamp(38%,42vh,52%);left:clamp(20px,6vw,40px);right:clamp(20px,6vw,40px)}.onboarding-copy h1{margin:0 0 24px;font-size:clamp(22px,5vw,28px);font-weight:800;line-height:1.38}.onboarding-copy p{margin:0;font-size:16px;line-height:1.45}.dots{justify-content:center;gap:14px;margin-top:34px;display:flex}.dots button{background:none;border:1px solid #fff;border-radius:999px;width:10px;height:10px;padding:0}.dots button.active{background:var(--color-lime)}.app-screen{background:#fffaf1;min-height:var(--viewport-height);display:flex;flex-direction:column}.green-header{color:#fff;display:grid;grid-template-columns:64px 1fr 40px;gap:clamp(12px,3vw,16px);min-height:clamp(160px,24vh,180px);padding:max(44px,env(safe-area-inset-top,0px) + 24px) clamp(16px,4vw,24px) 0;background:linear-gradient(180deg,var(--color-green-600),var(--color-green-800));position:relative}.member-avatar{width:64px;height:64px;box-shadow:0 8px 18px #28261b17;background:#fff;border-radius:8px;display:grid;place-items:center;font-weight:800;color:var(--color-green-700);font-size:22px}.greeting{display:flex;flex-direction:column;gap:4px}.greeting span,.greeting small{font-size:14px}.greeting strong{font-size:18px}.app-scroll{flex:1;min-height:0;overflow:auto;padding:0 clamp(16px,4vw,24px) calc(100px + env(safe-area-inset-bottom,0px));scrollbar-width:none}.app-scroll::-webkit-scrollbar{display:none}.home-scroll{margin-top:-40px;position:relative;z-index:2}.member-list{display:grid;gap:12px}@media (min-width: 540px){.member-list{grid-template-columns:repeat(2,minmax(0,1fr))}}.bottom-nav{position:sticky;bottom:0;left:0;right:0;height:calc(76px + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:#fff;border-top:1px solid var(--color-line);display:grid;grid-template-columns:repeat(4,1fr);z-index:10;flex-shrink:0}.bottom-nav a,.bottom-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;color:var(--color-slate);background:none;border:0;font-size:11px;font-weight:700}.bottom-nav a.active,.bottom-nav button.active{color:var(--color-green-600)}.section-header{color:#806947;display:flex;justify-content:space-between;align-items:center;margin:24px 0 14px;font-weight:800}.member-card{text-align:left;width:100%;box-shadow:0 8px 18px #28261b17;background:#fff;border:0;border-radius:8px;display:grid;grid-template-columns:64px 1fr;align-items:center;gap:14px;min-height:96px;padding:16px;cursor:pointer}.member-card h3{color:var(--color-slate);margin:0;font-size:16px}.member-card p{color:var(--color-brown);margin:4px 0 0;font-size:13px}.member-logo{width:56px;height:56px;border-radius:8px;background:#eef2eb;display:grid;place-items:center;font-weight:800;color:var(--color-green-700)}.progress-alert{text-align:left;color:#6e6270;width:100%;min-height:100px;box-shadow:0 8px 18px #28261b17;background:#fde1e4;border:0;border-radius:8px;padding:18px 16px}.progress-alert span{font-size:15px;line-height:1.3;display:block}.membership-strip{color:#fff;background:linear-gradient(135deg,var(--color-green-800),var(--color-green-600));width:100%;min-height:76px;box-shadow:0 8px 18px #28261b17;text-align:left;border:0;border-radius:8px;display:flex;justify-content:space-between;align-items:center;margin-top:12px;padding:16px 18px}.search-box{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--color-line);border-radius:8px;height:44px;padding:0 14px;margin-bottom:12px}.search-box input{flex:1;border:0;outline:none;background:none}.filter-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.filter-row select{height:40px;border:1px solid var(--color-line);border-radius:8px;padding:0 10px;background:#fff;color:var(--color-brown);font-size:13px}.status{border-radius:999px;display:inline-grid;place-items:center;min-width:72px;min-height:26px;font-size:11px;font-weight:900}.status.aktif{color:var(--color-green-800);background:#dff8e7}.status.expired{color:#a34b00;background:#fff0db}.status.pending{color:#a40b25;background:#ffe1e8}.form-screen{background:var(--color-cream);flex-direction:column;gap:18px;padding:max(28px,env(safe-area-inset-top,0px) + 16px) clamp(16px,4vw,24px) 28px;min-height:var(--viewport-height);display:flex;overflow:auto}.simple-header{color:var(--color-brown);display:flex;justify-content:space-between;align-items:center;font-weight:800}.icon-button{width:38px;height:38px;color:inherit;background:#ffffffb8;border:0;border-radius:50%;display:inline-flex;justify-content:center;align-items:center}.error-banner{background:var(--color-rose);color:var(--color-danger);border-radius:8px;padding:12px 14px;font-size:14px;font-weight:600}.admin-shell{min-height:var(--viewport-height);display:grid;grid-template-columns:260px 1fr;background:#f8faf7}.admin-sidebar{color:#fff;background:linear-gradient(180deg,var(--color-green-800),var(--color-green-900));padding:max(24px,env(safe-area-inset-top,0px) + 16px) 24px 24px}.admin-brand{display:grid;justify-items:center;gap:8px;margin-bottom:8px}.admin-brand .app-logo img{max-width:120px;max-height:96px;filter:drop-shadow(0 6px 14px #001a0f44)}.admin-sidebar h1{text-align:center;margin:12px 0 4px;font-size:28px}.admin-sidebar>span{text-align:center;display:block;opacity:.8;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #ffffff47}.admin-nav{display:grid;gap:8px}.admin-nav a{color:#ffffffc7;border-radius:8px;align-items:center;gap:12px;height:48px;padding:0 16px;display:flex;font-weight:600}.admin-nav a.active{color:#fff;background:#ffffff24}.admin-content{padding:clamp(20px,4vw,32px) clamp(16px,4vw,40px);overflow:auto}.admin-topbar h2{color:var(--color-brown);margin:4px 0 0;font-size:28px}.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin:24px 0}.metric-card{box-shadow:0 8px 18px #28261b17;background:#fff;border-radius:8px;min-height:120px;padding:20px;display:grid;gap:8px}.metric-card strong{color:var(--color-brown);font-size:36px}.metric-card span{color:var(--color-slate);font-weight:700}.admin-table{border:1px solid #ede6d8;border-radius:8px;overflow:hidden;background:#fff}.admin-row{min-height:64px;color:var(--color-slate);border-top:1px solid #f0eadf;display:grid;grid-template-columns:1.2fr 1fr 1fr 120px 140px;align-items:center;gap:12px;padding:0 16px}.admin-row.head{min-height:48px;color:var(--color-brown);background:#fff8e9;border-top:0;font-weight:800}.admin-row strong{display:block;color:var(--color-brown)}@media (max-width: 980px){.admin-shell{grid-template-columns:1fr;grid-template-rows:auto 1fr}.admin-sidebar{padding-bottom:16px}.admin-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.admin-nav a{justify-content:center;padding:0 8px;font-size:13px}.admin-row{grid-template-columns:1fr;padding:14px 16px}.admin-row.head{display:none}}@media (max-width: 480px){.phone-shell{max-width:100%;margin:0;border-radius:0;box-shadow:none}.admin-nav{grid-template-columns:1fr}}