:root{--gold:#c08a3a;--brown:#4b3028;--green:#178755;--cream:#f7f5f0;--dark:#27332b;--white:#fff}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--cream);color:var(--dark);font-family:Arial,sans-serif}.navbar{background:var(--brown);color:var(--white);justify-content:space-between;align-items:center;padding:22px 6%;display:flex}.navbar h1{letter-spacing:1px;color:var(--white);font-size:24px;font-weight:700}.navbar div{align-items:center;gap:24px;display:flex}.navbar a{color:var(--white);font-size:15px;text-decoration:none}.navbar a:hover{color:var(--gold)}button,input,select{font:inherit}button{cursor:pointer;color:var(--white);border:none;border-radius:999px;padding:7px 18px;font-size:12px;transition:opacity .15s}button:hover{opacity:.85}.dashboard{background:var(--white);max-width:1100px;margin:0 auto;padding:18px 40px 30px}.dashboard h2{color:var(--dark);margin-bottom:16px;font-size:15px;font-weight:700}.filter{align-items:center;gap:20px;margin-bottom:22px;display:flex}.filter input,.filter select{color:var(--dark);background:var(--white);border:1px solid var(--brown);border-radius:999px;outline:none;padding:7px 14px;font-size:12px}.filter input:focus,.filter select:focus{border-color:var(--gold)}.filter input{flex:1}.filter select{text-align:center;flex:1}.filter button{background:var(--gold);color:var(--white)}.table-container{background:var(--white);border:none;border-radius:0;overflow-x:auto}table{border-collapse:collapse;text-align:center;width:100%}th,td{border:1px solid var(--gold);padding:6px 10px;font-size:12px}th{background:var(--brown);color:var(--white);padding:10px;font-weight:700}td{color:var(--dark);height:34px}tbody tr:hover{background:var(--cream)}.aksi{white-space:nowrap}.detail{background:var(--gold);color:var(--white);margin-right:8px}.tambah{background:var(--green);color:var(--white)}.detail-page{background:0 0;max-width:1100px;padding:20px 40px 40px}.dashboard .detail-title{text-align:center;color:var(--gold);margin-bottom:16px;font-size:15px}.detail-info{background:var(--white);border:1px solid var(--gold);border-radius:14px;gap:8px;margin-bottom:22px;padding:14px 22px;display:grid}.detail-info p{color:var(--dark);grid-template-columns:110px 1fr;font-size:12px;display:grid}.riwayat-section{background:var(--brown);border-radius:14px;padding:14px 14px 16px}.riwayat-section h3{color:var(--white);margin-bottom:12px;font-size:12px}.riwayat-section .table-container{background:var(--white);border:1px solid var(--gold);min-height:120px;box-shadow:none;border-radius:10px}.riwayat-section th,.riwayat-section td{color:var(--dark);background:0 0;border:none;padding:8px 10px;font-size:12px}.riwayat-section th{padding-top:12px;font-weight:700}.riwayat-section tbody tr:hover{background:var(--cream)}.hapus{color:var(--white);background:#f0453a}.detail-actions{justify-content:space-between;align-items:center;margin-top:16px;display:flex}.detail-actions .detail{margin-right:0}.form-page{background:0 0;max-width:1100px;padding:20px 40px 40px}.dashboard .form-title{text-align:center;color:var(--gold);text-transform:uppercase;margin-bottom:16px;font-size:15px}.form-card{background:var(--white);border:1px solid var(--gold);border-radius:14px;padding:22px 20px 24px}.form-group{margin-bottom:14px}.form-group label,.form-label{color:var(--dark);margin-bottom:6px;font-size:12px;font-weight:700;display:block}.form-input{width:100%;color:var(--dark);resize:vertical;background:#ecdcc2;border:none;border-radius:6px;outline:none;padding:8px 12px;font-size:12px;display:block}.form-input:focus{box-shadow:0 0 0 2px var(--gold)}.form-input[readonly]{cursor:default}.radio-group{gap:6px;display:grid}.form-group .radio-item{cursor:pointer;align-items:center;gap:8px;margin-bottom:0;font-size:11px;font-weight:400;display:flex}.radio-item input{accent-color:var(--gold)}.form-card .detail-actions{margin-top:22px}@media (width<=600px){.navbar{padding:16px 20px}.navbar h1{font-size:21px}.navbar div{gap:14px}.dashboard{padding:16px 15px 24px}.filter{flex-direction:column;align-items:stretch;gap:12px}th,td{padding:8px}}