:root{--wine:#8f2029;--wine-dark:#2b1112;--wine-deep:#180b0c;--rose:#bd454c;--gold:#d49a20;--gold-soft:#f4dfb7;--ink:#171417;--muted:#6f6664;--line:#eadfd7;--paper:#fffdfa;--surface:#fff;--success:#12a04d;--shadow:0 14px 34px #2e1a1317,0 2px 8px #2e1a1314}*{box-sizing:border-box}html{background:#f8f3ee;min-width:320px}body{color:var(--ink);letter-spacing:0;background:linear-gradient(90deg,#8f20290a,#0000 28%),radial-gradient(circle at 85% 8%,#d49a201f,#0000 24rem),#faf7f3;margin:0;font-family:Instrument Sans,ui-sans-serif,system-ui,sans-serif}a{color:inherit;text-decoration:none}button{cursor:pointer;font:inherit;border:0}.icon-sprite{display:none}.app-shell{grid-template-columns:300px minmax(0,1fr);min-height:100vh;display:grid}.sidebar{color:#ffffffdb;background:linear-gradient(180deg,#4e1919f5,#180b0cfa),var(--wine-deep);scrollbar-color:#d87937b8 #ffffff14;scrollbar-width:thin;flex-direction:column;height:100vh;padding:28px 14px 0;display:flex;position:sticky;top:0;overflow:hidden auto}.sidebar::-webkit-scrollbar{width:8px}.sidebar::-webkit-scrollbar-track{background:#ffffff14}.sidebar::-webkit-scrollbar-thumb{background:#d87937b8;border:2px solid #180b0cfa;border-radius:999px}.brand{grid-template-columns:74px minmax(0,1fr);align-items:center;gap:14px;min-height:106px;padding:4px 12px 22px;display:grid}.brand-mark{color:#d87937;place-items:center;width:68px;height:68px;display:grid}.brand-mark svg,svg{width:100%;height:100%}.brand-mark path{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.4px}.brand p{color:#fff;text-transform:uppercase;margin:0;font-size:1.28rem;font-weight:800;line-height:1.05}.brand span{color:#ffffffc2;text-transform:uppercase;margin-top:8px;font-size:.55rem;font-weight:700;display:block}.nav-list{gap:6px;padding-top:8px;display:grid}.nav-item{color:#ffffffc7;border-radius:8px;grid-template-columns:30px minmax(0,1fr);align-items:center;gap:12px;min-height:50px;padding:0 18px;font-size:1rem;transition:all .18s;display:grid}.nav-item svg{fill:currentColor;opacity:.85;width:22px;height:22px}.nav-item:hover,.nav-item.is-active{color:#fff6e7;background:linear-gradient(90deg,#8f2029db,#8f202947)}.sidebar-art{align-items:flex-end;margin:auto -14px 0;padding-top:18px;display:flex}.nav-divider{background:#ffffff1f;height:1px;margin:10px 18px 6px}.nav-group-label{color:#ffffff6b;text-transform:uppercase;letter-spacing:.08em;grid-template-columns:22px minmax(0,1fr);align-items:center;gap:12px;padding:8px 18px 2px;font-size:.7rem;font-weight:700;display:grid}.nav-group-label svg{fill:currentColor;opacity:.6;width:16px;height:16px}.nav-sub-item{padding-left:34px!important}.sidebar-art img{-o-object-fit:contain;object-fit:contain;-o-object-position:bottom center;object-position:bottom center;width:100%;max-height:310px;display:block}.main-content{min-width:0;padding-bottom:30px}.topbar{z-index:4;background:linear-gradient(135deg,#fffffff7,#fffdfae8),var(--paper);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-bottom:1px solid #5a2f261a;justify-content:space-between;align-items:center;gap:18px;min-height:110px;padding:20px 32px;display:flex;position:sticky;top:0;box-shadow:0 8px 24px #3c22180d}.topbar:after{content:"";opacity:.26;background:linear-gradient(135deg,transparent 45%,var(--gold) 46% 54%,transparent 55%) 0 0/20px 20px,linear-gradient(45deg,transparent 45%,var(--wine) 46% 54%,transparent 55%) 8px 8px/20px 20px;width:150px;height:36px;position:absolute;bottom:0;right:30px}.title-group,.account-actions,.profile,.notification-button,.icon-button{align-items:center;display:flex}.title-group{gap:22px}.title-group h1{margin:0;font-size:clamp(1.45rem,2vw,1.85rem);font-weight:800}.title-group p{color:#4f4645;margin:12px 0 0;font-size:.98rem}.title-group strong{color:var(--wine)}.icon-button{color:#312222;background:0 0;border-radius:8px;justify-content:center;width:38px;height:38px}.icon-button svg{fill:currentColor;width:24px;height:24px}.account-actions{gap:22px}.notification-button{color:#241a1a;background:0 0;border-radius:50%;justify-content:center;width:42px;height:42px;position:relative}.notification-button svg{fill:currentColor;width:25px;height:25px}.notification-button span{color:#fff;background:var(--wine);border-radius:50%;place-items:center;width:20px;height:20px;font-size:.72rem;font-weight:700;display:grid;position:absolute;top:2px;right:2px}.profile{gap:12px}.profile-photo{color:#fff;background:radial-gradient(circle at 50% 34%,#f6d6a7 0 14%,#0000 15%),radial-gradient(circle at 50% 44%,#151111 0 16%,#0000 17%),radial-gradient(at 50% 86%,#3c1d1b 0 39%,#0000 40%),#f0c376;border:4px solid #e7bd74;border-radius:50%;place-items:center;width:52px;height:52px;font-size:0;display:grid}.profile strong,.profile span{display:block}.profile strong{font-size:.96rem}.profile span{color:var(--muted);font-size:.82rem}.profile .chevron{color:#4d4442;margin-left:8px;font-size:1.2rem}.metrics-grid{grid-template-columns:repeat(5,minmax(165px,1fr));gap:18px;padding:30px 28px 14px;display:grid}.metric-card,.panel{box-shadow:var(--shadow);background:#ffffffdb;border:1px solid #48251c1a;border-radius:8px}.metric-card{grid-template-columns:74px minmax(0,1fr);align-items:center;gap:14px;min-height:116px;padding:18px 20px;display:grid}.metric-icon{color:#fff;border-radius:50%;place-items:center;width:66px;height:66px;display:grid}.metric-icon.wine{background:linear-gradient(135deg,#a32a34,#70131a)}.metric-icon.gold{background:linear-gradient(135deg,#e2ad2d,#c28300)}.metric-icon.rose{background:linear-gradient(135deg,#d96166,#9d222b)}.metric-icon svg{fill:currentColor;width:34px;height:34px}.metric-card p,.metric-card span{color:var(--muted);margin:0;font-size:.86rem}.metric-card strong{color:#100d0e;margin:2px 0 4px;font-size:clamp(1.65rem,2vw,2rem);line-height:1;display:block}.metric-card .positive{color:var(--success)}.dashboard-grid{grid-template-columns:minmax(360px,1.25fr) minmax(330px,1.1fr) minmax(300px,.95fr);grid-auto-rows:minmax(0,auto);gap:18px;padding:8px 28px 20px;display:grid}.panel{min-width:0;padding:20px;overflow:hidden}.panel h2{color:#161112;margin:0;font-size:1.05rem;font-weight:800}.panel-header{justify-content:space-between;align-items:center;gap:16px;display:flex}.link-header a,.period-button{color:var(--wine);font-size:.86rem;font-weight:500}.donut-layout{grid-template-columns:minmax(140px,.85fr) minmax(160px,1fr);align-items:center;gap:14px;min-height:0;padding:18px 6px 0 0;display:grid}.donut-chart{aspect-ratio:1;background:conic-gradient(#8f2029 0 35%,#bd4631 35% 60%,#d69a2d 60% 75%,#e7bd74 75% 85%,#b9aa99 85% 90%,#e9e5df 90% 100%);border-radius:50%;place-items:center;width:min(240px,100%);display:grid;position:relative}.donut-chart:after{aspect-ratio:1;content:"";background:var(--surface);border-radius:50%;width:48%;position:absolute;box-shadow:inset 0 0 0 1px #50281c14}.donut-chart div{z-index:1;text-align:center;position:relative}.donut-chart strong,.donut-chart span{display:block}.donut-chart strong{font-size:1.65rem}.donut-chart span{font-size:.9rem}.legend-list{gap:12px;max-height:280px;margin:0;padding:0;list-style:none;display:grid;overflow-y:auto}.legend-list li{color:#3c3332;grid-template-columns:11px minmax(80px,1fr) auto;align-items:center;gap:8px;font-size:.82rem;display:grid}.legend-list span{background:var(--legend-color);border-radius:3px;width:11px;height:11px}.legend-list p{margin:0}.legend-list strong{color:#5e5553;font-weight:500}.member-list{gap:14px;margin-top:20px;display:grid}.member-row{grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;display:grid}.avatar{background:#e8ddd6;border-radius:50%;place-items:center;width:42px;height:42px;display:grid;overflow:hidden}.avatar img{-o-object-fit:cover;object-fit:cover;width:100%;height:100%;display:block}.avatar-lg{width:56px;height:56px}.member-row strong,.member-row span,.member-row time{display:block}.member-row strong{color:#1f1818;text-overflow:ellipsis;white-space:nowrap;font-size:.92rem;font-weight:700;overflow:hidden}.member-row span,.member-row time{color:var(--muted);font-size:.8rem}.member-row time{white-space:nowrap}.manage-link,.detail-button{border:1px solid var(--line);min-height:44px;color:var(--wine);background:#fff;border-radius:6px;align-items:center;font-size:.9rem;font-weight:700;display:grid}.manage-link{border-bottom:0;border-left:0;border-right:0;border-radius:0 0 8px 8px;grid-template-columns:24px minmax(0,1fr) 24px;gap:8px;margin:20px -20px -20px;padding:0 22px}.manage-link svg,.detail-button svg{fill:currentColor;width:18px;height:18px}.gender-summary{text-align:center;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px;display:grid}.gender-summary strong,.gender-summary span,.gender-summary small{display:block}.gender-summary strong{font-size:1.5rem;line-height:1}.gender-summary span{margin-top:4px;font-size:.85rem}.gender-summary small{color:#2d2221;margin-top:2px;font-size:.82rem}.gender-icon{border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin:0 auto 10px;display:flex}.gender-icon svg{fill:#fff;width:30px;height:30px}.gender-icon.male-icon{background:linear-gradient(135deg,#a32a34,#70131a)}.gender-icon.female-icon{background:linear-gradient(135deg,#e2ad2d,#c28300)}.gender-bar{background:#eee3d9;border-radius:999px;grid-template-columns:54.7fr 45.3fr;height:14px;margin-top:18px;display:grid;overflow:hidden}.gender-bar span:first-child{background:var(--wine)}.gender-bar span:last-child{background:var(--gold)}.dashboard-footer{color:var(--wine);text-align:center;justify-content:center;align-items:center;gap:18px;padding:8px 28px 0;display:flex}.dashboard-footer span{background:linear-gradient(45deg,transparent 35%,var(--gold) 36% 45%,transparent 46% 54%,var(--gold) 55% 64%,transparent 65%) center/18px 18px repeat-x;width:54px;height:18px}.dashboard-footer p{margin:0;font-size:1rem;font-style:italic}.dashboard-grid-full{padding:0 28px 20px}.pekerjaan-panel .panel-header{margin-bottom:20px}.panel-badge{color:var(--wine);background:#8f202914;border-radius:999px;align-items:center;padding:3px 12px;font-size:.78rem;font-weight:600;display:inline-flex}.bar-chart{gap:12px;display:grid}.bar-row{grid-template-columns:140px minmax(0,1fr);align-items:center;gap:12px;animation:.5s ease-out both fadeSlideUp;display:grid}.bar-label{color:#3c3332;text-overflow:ellipsis;white-space:nowrap;font-size:.86rem;font-weight:600;overflow:hidden}.bar-track{background:#48251c0d;border-radius:6px;height:32px;overflow:hidden}.bar-fill{border-radius:6px;justify-content:flex-end;align-items:center;min-width:36px;height:100%;padding:0 10px;animation:.8s cubic-bezier(.22,.61,.36,1) .3s both barGrow;display:flex}.bar-value{color:#fff;text-shadow:0 1px 2px #0003;font-size:.78rem;font-weight:700}.bar-row:first-child{animation-delay:50ms}.bar-row:first-child .bar-fill{animation-delay:.35s}.bar-row:nth-child(2){animation-delay:.1s}.bar-row:nth-child(2) .bar-fill{animation-delay:.4s}.bar-row:nth-child(3){animation-delay:.15s}.bar-row:nth-child(3) .bar-fill{animation-delay:.45s}.bar-row:nth-child(4){animation-delay:.2s}.bar-row:nth-child(4) .bar-fill{animation-delay:.5s}.bar-row:nth-child(5){animation-delay:.25s}.bar-row:nth-child(5) .bar-fill{animation-delay:.55s}.bar-row:nth-child(6){animation-delay:.3s}.bar-row:nth-child(6) .bar-fill{animation-delay:.6s}.bar-row:nth-child(7){animation-delay:.35s}.bar-row:nth-child(7) .bar-fill{animation-delay:.65s}.bar-row:nth-child(8){animation-delay:.4s}.bar-row:nth-child(8) .bar-fill{animation-delay:.7s}.bar-row:nth-child(9){animation-delay:.45s}.bar-row:nth-child(9) .bar-fill{animation-delay:.75s}.bar-row:nth-child(10){animation-delay:.5s}.bar-row:nth-child(10) .bar-fill{animation-delay:.8s}.dashboard-grid-full .bar-row{animation:.6s cubic-bezier(.17,.67,.26,1.3) both pekSlideIn}.dashboard-grid-full .bar-fill{animation:1s cubic-bezier(.22,.61,.36,1) .4s both pekBarGrow;position:relative;overflow:hidden}.dashboard-grid-full .bar-fill:after{content:"";background:linear-gradient(105deg,#0000 35%,#ffffff59 50%,#0000 65%);animation:.8s ease-out 1.2s both shimmer;position:absolute;inset:0;transform:translate(-100%)}.dashboard-grid-full .bar-row:first-child{animation-delay:50ms}.dashboard-grid-full .bar-row:first-child .bar-fill{animation-delay:.45s}.dashboard-grid-full .bar-row:nth-child(2){animation-delay:.12s}.dashboard-grid-full .bar-row:nth-child(2) .bar-fill{animation-delay:.52s}.dashboard-grid-full .bar-row:nth-child(3){animation-delay:.19s}.dashboard-grid-full .bar-row:nth-child(3) .bar-fill{animation-delay:.59s}.dashboard-grid-full .bar-row:nth-child(4){animation-delay:.26s}.dashboard-grid-full .bar-row:nth-child(4) .bar-fill{animation-delay:.66s}.dashboard-grid-full .bar-row:nth-child(5){animation-delay:.33s}.dashboard-grid-full .bar-row:nth-child(5) .bar-fill{animation-delay:.73s}.dashboard-grid-full .bar-row:nth-child(6){animation-delay:.4s}.dashboard-grid-full .bar-row:nth-child(6) .bar-fill{animation-delay:.8s}.dashboard-grid-full .bar-row:nth-child(7){animation-delay:.47s}.dashboard-grid-full .bar-row:nth-child(7) .bar-fill{animation-delay:.87s}.dashboard-grid-full .bar-row:nth-child(8){animation-delay:.54s}.dashboard-grid-full .bar-row:nth-child(8) .bar-fill{animation-delay:.94s}.dashboard-grid-full .bar-row:nth-child(9){animation-delay:.61s}.dashboard-grid-full .bar-row:nth-child(9) .bar-fill{animation-delay:1.01s}.dashboard-grid-full .bar-row:nth-child(10){animation-delay:.68s}.dashboard-grid-full .bar-row:nth-child(10) .bar-fill{animation-delay:1.08s}.dashboard-grid-full .bar-row:first-child .bar-fill:after{animation-delay:1.25s}.dashboard-grid-full .bar-row:nth-child(2) .bar-fill:after{animation-delay:1.32s}.dashboard-grid-full .bar-row:nth-child(3) .bar-fill:after{animation-delay:1.39s}.dashboard-grid-full .bar-row:nth-child(4) .bar-fill:after{animation-delay:1.46s}.dashboard-grid-full .bar-row:nth-child(5) .bar-fill:after{animation-delay:1.53s}.dashboard-grid-full .bar-row:nth-child(6) .bar-fill:after{animation-delay:1.6s}.dashboard-grid-full .bar-row:nth-child(7) .bar-fill:after{animation-delay:1.67s}.dashboard-grid-full .bar-row:nth-child(8) .bar-fill:after{animation-delay:1.74s}.dashboard-grid-full .bar-row:nth-child(9) .bar-fill:after{animation-delay:1.81s}.dashboard-grid-full .bar-row:nth-child(10) .bar-fill:after{animation-delay:1.88s}.dashboard-grid-full .bar-row{transition:transform .2s}.dashboard-grid-full .bar-row:hover{transform:translate(4px)}.dashboard-grid-full .bar-row:hover .bar-fill{filter:brightness(1.1);box-shadow:0 2px 12px #8f20294d}.dashboard-grid-full .bar-fill{transition:box-shadow .25s,filter .25s}.metric-card{animation:.5s ease-out both fadeSlideUp}.metric-card:first-child{animation-delay:50ms}.metric-card:nth-child(2){animation-delay:.1s}.metric-card:nth-child(3){animation-delay:.15s}.metric-card:nth-child(4){animation-delay:.2s}.metric-card:nth-child(5){animation-delay:.25s}.dashboard-grid .panel,.dashboard-grid-full .panel{animation:.6s ease-out both fadeSlideUp}.dashboard-grid .panel:first-child{animation-delay:.1s}.dashboard-grid .panel:nth-child(2){animation-delay:.2s}.dashboard-grid .panel:nth-child(3){animation-delay:.3s}.donut-chart{animation:.8s cubic-bezier(.22,.61,.36,1) .3s both donutIn}.donut-chart div{animation:.5s ease-out .7s both fadeIn}.legend-list li{animation:.4s ease-out both fadeSlideRight}.legend-list li:first-child{animation-delay:.4s}.legend-list li:nth-child(2){animation-delay:.5s}.legend-list li:nth-child(3){animation-delay:.6s}.legend-list li:nth-child(4){animation-delay:.65s}.legend-list li:nth-child(5){animation-delay:.7s}.legend-list li:nth-child(6){animation-delay:.75s}.member-row{animation:.4s ease-out both fadeSlideUp}.member-row:first-child{animation-delay:.15s}.member-row:nth-child(2){animation-delay:.25s}.member-row:nth-child(3){animation-delay:.35s}.member-row:nth-child(4){animation-delay:.45s}.member-row:nth-child(5){animation-delay:.55s}.gender-bar{animation:.7s cubic-bezier(.22,.61,.36,1) .4s both barGrowHorizontal}.gender-icon{animation:.5s cubic-bezier(.17,.67,.26,1.4) .2s both popIn}.dashboard-footer{animation:.6s ease-out .5s both fadeIn}@keyframes barGrow{0%{width:0!important}}@keyframes fadeSlideUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeSlideRight{0%{opacity:0;transform:translate(-12px)}to{opacity:1;transform:translate(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes donutIn{0%{opacity:0;transform:scale(.6)rotate(-90deg)}to{opacity:1;transform:scale(1)rotate(0)}}@keyframes popIn{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes barGrowHorizontal{0%{transform-origin:0;transform:scaleX(0)}to{transform-origin:0;transform:scaleX(1)}}@keyframes pekSlideIn{0%{opacity:0;transform:translate(-40px)}to{opacity:1;transform:translate(0)}}@keyframes pekBarGrow{0%{opacity:.5;width:0!important}to{opacity:1}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(200%)}}.member-page-grid{grid-template-columns:minmax(0,1fr);gap:18px;padding:30px 28px 28px;display:grid}.member-table-panel{padding:0;overflow:hidden}.member-page-heading{justify-content:space-between;align-items:center;gap:20px;padding:22px;display:flex}.member-page-heading h2{margin:0;font-size:1.25rem}.member-page-heading p{color:var(--muted);margin:7px 0 0;font-size:.92rem}.member-actions,.member-toolbar,.filter-pills,.pagination{align-items:center;display:flex}.member-actions{gap:10px}.primary-button,.secondary-button,.filter-button,.filter-pills button,.pagination button,.pagination-btn,.table-action{border:1px solid var(--line);color:#5e514f;background:#fff;border-radius:6px;justify-content:center;align-items:center;font-size:.9rem;font-weight:700;text-decoration:none;display:inline-flex}.primary-button,.secondary-button,.filter-button{gap:8px;min-height:42px;padding:0 14px}.primary-button{color:#fff;background:linear-gradient(135deg,var(--wine),#6c151c);border-color:#0000}.secondary-button,.filter-button{color:var(--wine)}.primary-button svg,.secondary-button svg,.filter-button svg{fill:currentColor;width:18px;height:18px}.member-toolbar{background:#fffaf4b3;border-top:1px solid #48251c14;border-bottom:1px solid #48251c14;flex-wrap:wrap;gap:12px;padding:16px 22px}.search-field{border:1px solid var(--line);background:#fff;border-radius:6px;flex:1;grid-template-columns:22px minmax(0,1fr);align-items:center;gap:10px;min-width:min(390px,100%);min-height:44px;padding:0 14px;display:grid}.search-field svg{fill:#8b7771;width:19px;height:19px}.search-field input{min-width:0;color:var(--ink);font:inherit;background:0 0;border:0;outline:0}.search-field input::placeholder{color:#9a8d89}.filter-pills{flex-wrap:wrap;gap:8px}.filter-pills button{color:#5d514f;min-height:34px;padding:0 12px}.filter-pills .is-selected{color:var(--wine);background:#8f202914;border-color:#8f20292e}.table-wrap{overflow-x:auto}.members-table{border-collapse:collapse;width:100%;min-width:940px}.members-table th{color:#6c605d;text-align:center;text-transform:uppercase;background:#fbf7f1;font-size:.76rem;font-weight:800}table.members-table thead th,table.members-table thead td{text-align:center!important}.members-table th,.members-table td{vertical-align:middle;border-bottom:1px solid #48251c14;padding:15px 16px}.members-table td{color:#3f3533;font-size:.88rem}.members-table tbody tr:hover{background:#d49a200d}.table-member{grid-template-columns:42px minmax(170px,1fr);align-items:center;gap:12px;display:grid}.table-member strong,.table-member span{display:block}.table-member strong{color:#191313;font-size:.94rem}.table-member span{color:var(--muted);margin-top:3px;font-size:.78rem}.status{white-space:nowrap;border-radius:999px;align-items:center;min-height:28px;padding:0 10px;font-size:.78rem;font-weight:800;display:inline-flex}.status-dues-lunas,.status-member-aktif{color:#13713c;background:#12a04d1a}.status-dues-proses,.status-member-verifikasi{color:#946000;background:#d49a2026}.status-dues-belum{color:var(--wine);background:#8f20291a}.status-kk{color:#fff;background:linear-gradient(135deg,var(--wine),#6c151c)}.gender-badge{align-items:center;gap:5px;font-size:.82rem;font-weight:600;display:inline-flex}.gender-badge svg{fill:currentColor;width:15px;height:15px}.gender-male{color:#8f2029}.gender-female{color:#c28300}.table-member-link{cursor:pointer;text-decoration:none}.table-member-link:hover strong{color:var(--wine);text-decoration:underline}.table-action{color:#6d605d;width:34px;height:34px}.table-action svg{fill:currentColor;width:18px;height:18px}.action-buttons{align-items:center;gap:6px;display:flex}.action-buttons form{display:inline}.table-footer{justify-content:space-between;align-items:center;gap:16px;padding:16px 22px;display:flex}.table-footer p{color:var(--muted);margin:0;font-size:.88rem}.pagination{gap:6px}.pagination button,.pagination-btn{color:#5e514f;min-width:34px;min-height:34px;padding:0 10px}.pagination .is-current,.pagination-btn.is-current{color:#fff;background:var(--wine);border-color:#0000}.pagination button:disabled{opacity:.4;cursor:default}.btn-export-excel{background:#1d6f42;border-color:#1d6f42;transition:all .2s;color:#fff!important}.btn-export-excel:hover{background:#22874e;border-color:#22874e;transform:translateY(-2px);box-shadow:0 4px 12px #1d6f4259}.btn-export-excel:active{transform:translateY(0);box-shadow:0 2px 4px #1d6f4240}.btn-export-excel svg{transition:transform .2s}.btn-export-excel:hover svg{transform:translateY(2px)}.modal-open{overflow:hidden}.modal-backdrop{z-index:30;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#180b0c8f;place-items:center;padding:24px;animation:.25s modalFadeIn;display:grid;position:fixed;inset:0}.modal-backdrop[hidden]{display:none}.modal-dialog{background:var(--surface);border:1px solid #48251c24;border-radius:8px;width:min(760px,100%);max-height:min(820px,100vh - 48px);animation:.3s cubic-bezier(.21,1.02,.73,1) modalSlideUp;overflow:auto;box-shadow:0 24px 70px #140a0847}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(24px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.confirm-backdrop{z-index:50;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#180b0c9e;place-items:center;padding:24px;animation:.2s modalFadeIn;display:grid;position:fixed;inset:0}.confirm-dialog{background:var(--surface);border-radius:12px;width:min(420px,100%);animation:.28s cubic-bezier(.21,1.02,.73,1) modalSlideUp;overflow:hidden;box-shadow:0 28px 70px #140a0852}.confirm-icon{background:#8f202914;border-radius:50%;place-items:center;width:56px;height:56px;margin:0 auto 14px;display:grid}.confirm-icon svg{width:28px;height:28px;fill:var(--wine)}.confirm-body{text-align:center;padding:28px 28px 20px}.confirm-body h3{color:var(--ink);margin:0 0 8px;font-size:1.12rem;font-weight:800}.confirm-body p{color:var(--muted);margin:0;font-size:.92rem;line-height:1.5}.confirm-actions{justify-content:center;gap:10px;padding:0 28px 24px;display:flex}.confirm-actions button{cursor:pointer;border-radius:8px;min-height:42px;padding:0 24px;font-size:.92rem;font-weight:700;transition:all .18s}.confirm-cancel{border:1px solid var(--line);color:#5c4d4a;background:#fff}.confirm-cancel:hover{background:#f5f0eb}.confirm-delete{color:#fff;background:linear-gradient(135deg,var(--wine),#6c151c);border:1px solid #0000}.confirm-delete:hover{background:linear-gradient(135deg,#a12833,#7d1a20);box-shadow:0 4px 16px #8f20294d}.modal-dialog-wide{width:min(960px,100%)}.modal-header,.modal-footer{justify-content:space-between;align-items:center;gap:16px;display:flex}.modal-header{border-bottom:1px solid #48251c14;padding:22px}.modal-header h2{color:#161112;margin:0;font-size:1.22rem;font-weight:800}.modal-header p{color:var(--muted);margin:7px 0 0;font-size:.9rem}.modal-close{border:1px solid var(--line);color:#5c4d4a;background:#fff;border-radius:6px;flex:none;justify-content:center;align-items:center;width:38px;height:38px;display:inline-flex}.modal-close svg{fill:currentColor;width:18px;height:18px}.modal-form{padding:22px}.form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.form-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.form-field{gap:7px;display:grid}.form-field-full{grid-column:1/-1}.form-field span{color:#3f3533;font-size:.86rem;font-weight:800}.form-field input,.form-field select,.form-field textarea{border:1px solid var(--line);width:100%;min-height:42px;color:var(--ink);font:inherit;background:#fffdfa;border-radius:6px;outline:0;padding:0 12px}.form-field textarea{resize:vertical;min-height:92px;padding-top:10px}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:#8f202973;box-shadow:0 0 0 3px #8f20291a}.modal-footer{border-top:1px solid #48251c14;margin-top:22px;padding-top:18px}.field-error{color:var(--wine);font-size:.8rem;font-weight:600}.checkbox-group{flex-wrap:wrap;gap:8px;padding:4px 0;display:flex}.checkbox-item{border:1px solid var(--line);cursor:pointer;color:var(--ink);-webkit-user-select:none;user-select:none;background:#fffdfa;border-radius:6px;align-items:center;gap:6px;padding:7px 14px;font-size:.88rem;transition:all .18s;display:inline-flex}.checkbox-item:hover{background:#8f20290a;border-color:#8f20294d}.checkbox-item:has(input:checked){border-color:var(--wine);color:var(--wine);background:#8f202914;font-weight:700}.checkbox-item input{width:16px;height:16px;accent-color:var(--wine);cursor:pointer}.enroll-search-input{border:1px solid var(--line);background:#fff;border-radius:8px;width:60%;margin:12px auto 0;padding:10px 14px 10px 12px;font-size:.92rem;transition:border-color .18s;display:block}.enroll-search-input:focus{border-color:#8f202973;outline:none;box-shadow:0 0 0 3px #8f20291a}.enroll-list{flex-direction:column;gap:6px;max-height:380px;padding:4px 0;display:flex;overflow-y:auto}.enroll-item{border:1px solid var(--line);cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;align-items:center;gap:12px;padding:10px 14px;transition:all .18s;display:flex}.enroll-item:hover{background:#8f202908;border-color:#8f20294d}.enroll-item:has(input:checked){border-color:var(--wine);background:#8f20290f}.enroll-item input{width:18px;height:18px;accent-color:var(--wine);cursor:pointer;flex-shrink:0}.enroll-item .avatar{flex-shrink:0;width:36px;height:36px}.enroll-item .avatar img{-o-object-fit:cover;object-fit:cover;border-radius:50%;width:100%;height:100%}.enroll-info{flex-direction:column;gap:2px;min-width:0;display:flex}.enroll-info strong{color:var(--ink);font-size:.92rem}.enroll-info span{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;overflow:hidden}.enroll-empty-search{text-align:center;color:var(--muted);padding:30px 0}.dt-container{padding:0}.dt-container .dt-search{padding:16px 22px 0}.dt-container .dt-search input{border:1px solid var(--line);min-height:40px;color:var(--ink);font:inherit;background:#fffdfa;border-radius:6px;outline:0;padding:0 14px}.dt-container .dt-search input:focus{border-color:#8f202973;box-shadow:0 0 0 3px #8f20291a}.dt-container .dt-search label{color:var(--muted);font-size:.9rem;font-weight:600}.dt-container .dt-length{padding:16px 22px 0}.dt-container .dt-length select{border:1px solid var(--line);min-height:36px;font:inherit;background:#fffdfa;border-radius:6px;padding:0 8px}.dt-container .dt-length label{color:var(--muted);font-size:.88rem;font-weight:500}.dt-container .dt-info{color:var(--muted);padding:14px 22px;font-size:.88rem}.dt-container .dt-paging{padding:0 22px 16px}.dt-container .dt-paging .dt-paging-button{color:#5e514f;cursor:pointer;border-radius:6px;justify-content:center;align-items:center;min-width:34px;min-height:34px;margin:0 3px;padding:0 10px;font-size:.9rem;font-weight:700;display:inline-flex;border:1px solid var(--line)!important;background:#fff!important}.dt-container .dt-paging .dt-paging-button:hover{color:var(--wine);background:#8f20290f!important}.dt-container .dt-paging .dt-paging-button.current{color:#fff!important;background:var(--wine)!important;border-color:#0000!important}.dt-container .dt-paging .dt-paging-button.disabled{opacity:.4;cursor:default}.auth-body{background:linear-gradient(135deg,#4e1919eb,#180b0cf5),var(--wine-deep);place-items:center;min-height:100vh;padding:24px;display:grid}.auth-container{width:100%;max-width:440px}.auth-card{background:var(--surface);border-radius:12px;padding:40px 36px;box-shadow:0 30px 80px #00000059}.auth-header{text-align:center;margin-bottom:32px}.auth-header .brand-mark{color:#d87937;width:64px;height:64px;margin:0 auto 16px}.auth-header h1{color:var(--ink);margin:0;font-size:1.4rem;font-weight:800}.auth-header p{color:var(--muted);margin:8px 0 0;font-size:.88rem}.auth-form{gap:18px;display:grid}.auth-form .form-field{gap:6px}.auth-remember{color:#4f4645;cursor:pointer;align-items:center;gap:8px;font-size:.88rem;display:flex}.auth-remember input{width:18px;height:18px;accent-color:var(--wine);cursor:pointer}.auth-submit{border-radius:8px;justify-content:center;gap:10px;width:100%;min-height:46px;font-size:1rem}.auth-status{color:#13713c;background:#12a04d1a;border-radius:6px;margin-bottom:16px;padding:12px 16px;font-size:.88rem;font-weight:600}.toast{z-index:50;color:#fff;border-radius:8px;align-items:center;gap:12px;min-width:300px;padding:16px 20px;font-size:.92rem;font-weight:600;animation:.3s toastIn;display:flex;position:fixed;top:24px;right:24px;box-shadow:0 12px 40px #0003}.toast svg{fill:currentColor;flex-shrink:0;width:20px;height:20px}.toast span{flex:1}.toast button{color:#ffffffb3;background:0 0;padding:0 0 0 8px;font-size:1.2rem}.toast-success{background:linear-gradient(135deg,#12a04d,#0d7a3a)}.toast-error{background:linear-gradient(135deg,var(--wine),#6c151c)}@keyframes toastIn{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}.kk-detail-card{padding:28px}.kk-detail-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;display:flex}.kk-detail-avatar{align-items:center;gap:16px;display:flex}.kk-detail-avatar h2{margin:0;font-size:1.3rem}.kk-detail-avatar p{color:var(--muted);margin:4px 0 0;font-size:.9rem}.kk-detail-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;display:grid}.kk-info-item span{color:var(--muted);margin-bottom:4px;font-size:.82rem;display:block}.kk-info-item strong{font-size:.96rem;display:block}.kk-info-full{grid-column:1/-1}@media (width<=1420px){.metrics-grid{grid-template-columns:repeat(3,minmax(210px,1fr))}.dashboard-grid{grid-template-columns:minmax(340px,1fr) minmax(330px,1fr)}}@media (width<=1080px){.app-shell{grid-template-columns:1fr}.sidebar{z-index:20;width:300px;transition:left .3s;position:fixed;left:-320px}.sidebar.is-open{left:0}.topbar{position:relative}}@media (width<=820px){.topbar{flex-direction:column;align-items:flex-start;padding:18px 16px}.metrics-grid,.dashboard-grid,.member-page-grid{grid-template-columns:1fr;padding-inline:16px}.dashboard-grid-full{padding-inline:16px}.bar-row{grid-template-columns:110px minmax(0,1fr)}.member-page-heading,.member-actions,.modal-header,.modal-footer,.table-footer{flex-direction:column;align-items:stretch}.kk-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=640px){.form-grid{grid-template-columns:1fr}.modal-backdrop{padding:12px}.kk-detail-grid{grid-template-columns:1fr}.donut-layout{grid-template-columns:1fr;justify-items:center}}.role-badge{white-space:nowrap;border-radius:999px;align-items:center;min-height:26px;padding:0 10px;font-size:.78rem;font-weight:800;display:inline-flex}.role-root{color:#fff;background:linear-gradient(135deg,#8f2029,#6d1518)}.role-admin_ikt{color:#5a3300;background:#f4dfb7}.role-admin_arisan{color:#13713c;background:#12a04d1a}.role-admin_panitia{color:#1e4a8a;background:#d0e3ff}.role-tallu_lembangna{color:#0e5e6f;background:#b8e8f0}.arisan-field-toggle{display:none}.arisan-field-toggle.is-visible{display:grid}.checkbox-group{grid-template-columns:1fr;gap:8px;max-height:200px;padding:4px 0;display:grid;overflow-y:auto}.checkbox-group label{cursor:pointer;border-radius:4px;align-items:center;gap:8px;padding:6px 8px;font-size:.88rem;transition:background .15s;display:flex}.checkbox-group label:hover{background:#f5f0eb}.checkbox-group input[type=checkbox]{width:18px;height:18px;accent-color:var(--wine)}